Error messages are frustrating to see. They mean that somewhere, somehow, something went wrong. The mistake can be due to a user error or a system malfunction. Either way, both us as humans and the product we’re interacting with are imperfect by nature, which means mistakes are bound to happen.
Because of this reality, error messages are a vital aspect in the user experience in any app or web design. The key is making errors useful so that users can be helped to overcome roadblocks, instead of abandoning the experience altogether.
The list of best practices below can help make error message user experience (UX) more effective.
By clearly describing what the error is, why it happened, and how to overcome the problem, an error message can be a powerful UX resource to empower users.
1. Make error messages human friendly
Be clear and specific
Error messages are seen as an annoyance because they’re often extremely vague. They might say that “an error occurred,” but not much else. This leads to a dead end since the user doesn’t know the true cause of the error, nor which action to take next in order to overcome the problem.
Users shouldn’t have to guess what’s wrong with the product they’re using. By clearly describing what the error is, why it happened, and when possible, how the user can overcome the problem, an error message can be a powerful UX resource to empower users despite any mistakes that occur.
The above left is a good example of an error message that is clear. It explains what the error is (a rename error), it explains why it happened - because another file with that name exists. Finally, it explains how the user can overcome it, by specifying a different name. The error message is specific enough, so that the issue doesn’t turn into an insurmountable obstacle.
In the above example, Doordash has a nicely designed err