[AJAX Login] Very, Very Intuitive User Interface

[Update: January 15, 2007]  For information about the live AJAX Login demo which implements the attributes described in this post see the third post in the series - Unique URLs and Live Demo.

In Simplifying the Sign In Experience with AJAX, I brainstormed about how an AJAX Login control that could improve a user's web application sign in experience.  The first item on the list of desired attributes for such a control was Very, Very Intuitive User Interface.  This post dives into the details of that attribute and gives some direction on how it might be implemented.

Desired Sign In Experience

1. When a user first visits a web page, there should be an indication of whether they are currently logged in or not.
   

2. If a user clicks the link to sign in, a form should immediately appear.  The first field in the form should have the focus and the field which currently has focus should be quite noticeable.  Users should be able to tab or click to the next field.  At any time, the user can press the Enter key or click the Sign In button to attempt authentication.  At any time, the user should be able to easily close the form.
   
   
3. The user should not have to wait through the entire authentication process just to learn of invalid fields.  If a user enters an invalid e-mail, they should be notified immediately.  Additionally, the e-mail field should be given focus so that the user can easily correct the problem without another click.
   
   
4. Similar to item 3, a user should be immediately notified if they forgot to enter a password.  The password field should be given focus when this occurs so that the user can easily enter their password.
   
   
5. Again, similar to item 3, a user should be immediately notified if their password does not meet a given requirement.  When the notification appears, the cursor should be in the password field so that the user can correct the error.
   
   
6. If all fields are found to be valid, then the data can be sent for verification.  When this happens, the user should be notified so that they know that everything is working.
   
   
7. If authentication fails, the user should be given a clear indication for why it failed.  When the failure is a result of an e-mail that has not yet been registered, then they should be given an option to join.
   
   
8. When the failure is a result of an incorrect password, then the user should be given the option to correct it.
   
   
9. Once the user is successfully authenticated, the sign in form should automatically be closed and the Sign In link should be replaced by a Sign Out link.
   

Desired Account Creation Experience

1. When a user clicks a link to create a new account or join the community, a form should immediately appear.  The first field in the form should have the focus and the field which currently has focus should be quite noticeable.  Users should be able to tab or click to the next field.  At any time, the user can press the Enter key or click the Sign In button to attempt registration.  At any time, the user should be able to easily close the form.
   
   
2. Similar to items 3, 4, and 5 in the Desired Sign In Experience, when there is a problem with anything the user has entered, they should be notified immediately.  Unique to the registration process is the problem of non-matching passwords.
   
   
3. If a user enters an e-mail address that is already registered, they should be notified immediately and given the option to sign in with that e-mail or choose a different one.
   
   
4. Once the user is successfully registered, they should be notified and automatically logged in.
   

Live demo coming soon.