Errors Happen
- Sometimes they happen because we make mistakes or sometimes because the system fails.
- Whatever the cause, how these errors are handled, can have a huge impact on the way a user experiences your app
- A lazy error handling and ill-constructed error message can fill user with frustation and make them stop using your app.
- On the other hand, a well-crafted error handling, can turn a moment of failure into a moment of delight.
What is an Error?
Errors (or error conditions) occur when an app fails to complete an expected action, such as:
- The application does not understand user input.
- The application fails.
- A user intends to run incompatible operations currently.
Every error, regardless of who is to blame, becomes a point of friction for your users. Luckily, a well-designed error handling can help reduce that friction.
Think Ahead of Time
Prevention is always better than cure! So, while designing app, think about the in-app interactions that might result in error states.
In other words, its better to prevent users from making errors in the first place by offering suggestions, utilizing constraints, and being flexible.
For example, either eliminate error-prone conditions or check for them and notify the users about that before they perform the action.
Basic Principles to Follow
- The error message should be easy to notice and understand.
- The error should be easy to locate.
- Users shouldn’t have to memorize the instructions for fixing the error.
Avoid Using Technical Jargon
Express everything in simple words, don’t assume users to be tech savvy so that they understand message’s context.
Aim For Inline Validation Wherever Possible
Never confuse the user where they made the mistake. Show them clearly which field they missed or entered an incorrect data.
This type of error message is easily noticeable, immediately fixed and users don’t need to navigate or switch context to a new field.
Indicate Success Entry For Complex Fields
Inline validation can also be used to indicate successful completion.
For complex input such as passwords, instant inline validation, will prevent users from guessing or checking multiple times if what they have entered meets the guidelines set by the system.
Use Colors and Add Iconography
Colors and icons can be used to differentiate errors from the normal field state and make them more noticeable.
Here are the universally used colors and icons :
Red – Error
Green – Success
Yellow – Warning
Blue – Information
Remember
Don’t Blame The Users
Give Users A Solution
Correct Errors Automatically If Possible
Add Constraints
Always Remember The 4H’s Of Error Messages
Human
Helpful
Humorous
Humble
