How To Design Better Error Messages UX.

❌ How To Design Better Error Messages UX. With useful guidelines to rethink, rewrite and redesign error messages to help users recover and succeed ↓

🚫 Not all errors have the same impact, so are error messages.
✅ Catalog errors: system failures, user errors, partial, total.
✅ Grade errors by impact: annoying, enraging, critical.
✅ For annoying errors, explain what happened and add warmth.
✅ For enraging errors, explain and provide clear instructions.
✅ For critical errors, own the problem, apologize and resolve.

✅ UIs must support 2 types of errors: slips and mistakes.
✅ Slips: users try to perform one action but do another.
✅ Mistakes: users don’t understand how the system works.
✅ Fix slips ← constraints, autocomplete, smart presets, good defaults.
✅ Fix mistakes ← examples, confirmations, forgiving formatting.

🚫 Never rely on red color alone — always include an icon.
🚫 Avoid auto-scrolling or sudden jumps: use error summary with links.
🚫 Never cover user’s input and errors when users are fixing errors.
🚫 Avoid technical jargon, 'please', 'sorry', 'valid', 'invalid', 'forbidden'.
✅ In forms, showing errors above input, in tables within the row.
✅ Always allow users to override non-critical error messages.

Error messages are often an afterthought, yet they can make or break the experience when things go south. Spending time and effort on crafting helpful, adaptive error messages is probably one of the best investments a company might make to reduce abandonment and drive conversions.

Audit and study where your error messages are coming from. Build a spreadsheet on why they occur, how they are phrased and how they can be rephrased to be more helpful and impactful. Measure how often errors occur, user’s error recovery rate, completion rates and abandonment.

Once you know where your users fail, start iterating and testing new messaging. Even a minor improvement can be enough to guide people on the right path and boost recovery rates. That’s the impact only few features can deliver.

Useful resources:

How To Write Any Error Message, by Rhiannon Jones
https://lnkd.in/eA4agUBJ

Writing Clearer Error Messages, by Amy Leak
https://lnkd.in/ekkmbS4V

Error Message Stop Words, on Gov.uk
https://lnkd.in/e5RksRuc

Preventing User Errors: Usability Guidelines, by Page Laubheimer (attached illustration)
https://lnkd.in/eWDsgDhC

The Art of the Error Message, by Marina Posniak
https://lnkd.in/edPk7wHf

Error-Message Guidelines, by Tim Neusesser
https://lnkd.in/eQttG-JM

Designing Better Error Messages UX, by yours truly Vitaly Friedman
https://lnkd.in/eHcuyRth

hashtag#ux hashtag#design hashtag#errors

Activate to view larger image,