I'm creating a password generator that derive password from personals informations.
I need to help users detect any mistake on one of the two fields
For now, users have to click on the eye icon to reveal their password and check for any typo.
I want to make the detection of typo less obtrusive. So, I've redesign my UI to display a color in the left border of the form.
When the user has finished to fill the
password fields, the left border change color.
If the user make a typo, the derivation is different, hence the color is different.
Our first test show that users don't understand that the color correspond to the combination of the two fields. They don't detect the error. Worse, they don't even see the color change.
Does a better way exists to help our users to detect the mistake ? (e.g. color transition longer, blink, repositioning)