Guide · UI states
Error-state design, explained
An error state is what a product shows when something fails — a form rejects input, a request times out, a payment declines. How a product handles its errors decides whether users trust it, yet error states are the ones most often left undesigned until they surface in production.
Last updated
The kinds of error
Errors are not all alike. A validation error is something the user can fix. A system error needs a retry, not a correction. A permission error is about access. Each calls for different copy, a different action, and a different tone.
Designing one generic "something went wrong" screen for all of them frustrates users, because it never tells them which kind of problem they have or what to do about it.
What a good error state does
A good error state says what happened in plain language, says how to recover, and preserves the user's work rather than discarding it. It avoids blame and jargon, and it points at a clear next step.
The best products treat errors as part of the experience, not an exception to it. A well-designed error path can even build trust, because it shows the product was thought through.
Where error states hide
Errors live in forms, network requests, payments, uploads, and edge inputs — exactly the places a happy-path demo skips. If a prototype only shows the successful screen, those decisions get improvised mid-build, which is where much rework comes from.
Koryvant draws the error state of every screen alongside its empty, loading, and populated states, so failure is a decided design before engineering starts.
Try it on your own idea
Describe your product to Koryvant and get a complete clickable prototype — every screen, every state, both themes — free to generate and preview.
Questions
- Why design error states in the prototype?
- Because error handling is where trust is won or lost, and deciding it up front removes the mid-build improvisation that causes rework. Koryvant draws every screen in its error state.
- What makes an error message good?
- It says what happened in plain language, how to recover, and preserves the user's work — without blame or jargon, and with a clear next step.
- Does Koryvant cover error paths?
- Yes. Koryvant draws the error and edge states of each screen, not just the happy path, so the whole product is decided.
Keep reading: Loading-state design, explained or Dark mode design, explained. Browse all guides, or see Koryvant by product type.