Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have two functions in my user registration form

  • One checks the password and confirmed password are the same.
  • The other checks if the password is strong enough.

I have two presentation related questions

  • What words should I use if the passwords don't match or isn't strong enough? I have a text field beside the first password which is initially empty but gets updated as each character is typed in (I can add a second text field beside the confirm password part).
  • When and in what order should the functions be called? For example if I only call the passwords match function on the confirm password section then if the user goes back and changes the first password things will get messed up. If I call the passwords match function at the first time the user types in the password then it will override the message about the password not being strong enough or the strong enough password will override the "password don't match" message.

The function that checks if the password is strong enough is real simple, just to prevent "123" and password. In the future I'd like to make an option to unmask the password and only have one field and no confirm.

share|improve this question
    
I find progress-bar-like indicators of password strength a very nice feature. (The bar is updated with every character.) They're often color coded and red until the strength has a value of "strong" at which point they turn green, indicating it's acceptably strong. But there should be something besides the color change to indicate that it's acceptable. –  obelia Feb 22 '13 at 22:37
    
@obelia my password requirments are so simple I was just planning on having "password good" "password too simple". Could you elaborate on such a design? –  Celeritas Feb 22 '13 at 23:24
add comment

1 Answer

up vote 7 down vote accepted

Keep it simple:

  • As the user types into the first textfield, have a strength indicator near by telling the user if their password is strong that updates as they type. Don't enable the confirm field until they have entered a password that meets your requirements.
  • When they tab into the second field to confirm, have a label next to it that updates as they type saying whether the passwords match.
  • If the user goes back to the first text field and makes a change, blank out the confirm textfield and make them enter the whole thing all over again.

Your end goal of eventually having an unmasked single field is a good one. I left them unmasked in the diagram below for the sake of demonstration.

The key take away is: focus your user on one task at a time, and validate once the user has completed that task and then move them to the next step in the workflow. Give real time information about their status in that step in the workflow.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer
    
In the Entered Password part I notice you have "Password doesn't match". When should that appear (as opposed to being blank)? For example, after the first character in the Confirm Password is typed or when focus is put to the element? –  Celeritas Feb 22 '13 at 23:36
    
It could be either. One option is to just display "Password doesn't match" as soon as they focus on the textfield. Another is to have it say "Please re-enter your password" when the second textfield is enabled and then as soon as they enter a char switch to "Password doesn't match" –  Charles Wesley Feb 22 '13 at 23:38
    
In regards to the second option don't you think it's kind of redundant to have "Please re-enter your password" and above the text field say "Confirm password"? –  Celeritas Feb 23 '13 at 9:09
    
It could be. I would test and see if your users need it or not. –  Charles Wesley Feb 25 '13 at 17:54
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.