Interaction design to reduce password input errors

Caps Lock is turned on when entering the password, so sometimes small and uppercase letters are entered incorrectly.

This is because, when entering a password in the input box, '*' is usually displayed instead of the input character. If you can't see others, you can't see yourself. So, when the password is not a number but a letter, the most common error when entering is when the Caps Lock key is pressed and the alphabet is entered in uppercase.

Since the characters you are typing are not visible, you cannot know what characters are currently being typed. So I can't tell if the letter is uppercase or lowercase.

Actually, Korean input is not allowed in the password input window. Each character is marked with *, so only English characters can be entered. You can check it by looking at the IME of the password input control in a development environment such as Visual Basic, Visual Studio, or Delphi.

Since Korean cannot be input, only English letters, numbers, and symbols are input, Caps Lock, which makes all English letters in uppercase, seems to play a role in causing errors when entering passwords.

That's why there are friendly software and websites out there that will give you a password error message saying "Make sure Caps Lock is on".

Yahoo! Login Error Message


However, this is after the user has already experienced the error. Let me know as you type so you won't have to go through the error.

After installing Windows XP for the first time, I discovered something. It means that when you log in, if Caps Lock is turned on, a message will appear in the password input window.
Windows XP caps lock message


I couldn't take a screenshot of the login window, so I took a picture with a digital camera ^^

I gave the option to enter the password in the program to be installed and took a screen capture. It also appears here. It seems that this processing is done in the password input window of Windows common control.

password caps lock


It is appropriate to use a UI element called Balloon, not a dialog, as the UI element used to notify the user that Caps Lock is on.

Guidelines for Balloon UI in Vista on Windowslook at

A balloon is a small pop-up window that informs the user of a non-critical problem with some UI element or under certain conditions.

The balloon UI element is used to inform the user of certain conditions without disturbing the user. For example, it is used when the input length is exceeded or the Caps Lock is set incorrectly. Balloon UI gives feedback to the user without stealing input focus. This is especially important in password or PIN boxes.


Windows Vista Ballon


Vista's guidelines are written in the design pattern language method, not the existing guideline method. When will I have time to write about the design pattern language?


I think the Caps Lock message when entering the password in Windows XP as a well-designed interaction. However, there are places where it is not applied consistently within Windows. This is where you change the user's password in Windows XP. Caps Lock is not displayed when changing the password.


Windows XP Caps Lock Message


Caps Lock isn't just about entering passwords. Even when changing the password, you will have to display the current Caps Lock status to eliminate input errors from the beginning.

A user's typo when entering the password has no way for the system to do anything. However, noticing and notifying the user of a condition such as Caps Lock seems to be a good way to reduce user input errors.


0 If you like the article, please click the heart~ It will be a strength to bloggers (SNS/login/advertising is not related)

Articles you might like

smart stock calculator

Various stock calculators for successful stock investment: profit/loss ratio, profit/loss unit price, purchase quantity, water/burning unit price, unit price required funds, selling price, percentage, etc.

Add a Comment

Email addresses are not disclosed. Required items *is indicated by

This posting is part of Coupang Partners' activities, and a certain amount of commission is provided accordingly.