Success State

Concept

The screen state that reports a task finished and offers what the person can do next.

Why it exists

Teams routinely drew the failing states and left the succeeding one blank. The loading state and the error state make it into the mockups; when things go well, returning to the previous screen seems like enough and nothing gets designed.

So people repeat the action, not being sure it landed. Send an invitation, see nothing change on screen, press the button again — and the invited person receives two identical emails. The retry is rational: the only evidence available said nothing had happened. In places that are hard to reverse, that second attempt arrives as a support ticket.

There's also a wasted opportunity in the blank space. Someone who has just finished one thing is as ready as they will ever be to accept the next one, and with nothing there they go back to the list and stop.

How it works

The first decision is how loudly to announce it. Three levels.

  1. A brief confirmation that appears and leaves. A three-second notice saying something saved, used for results the person can check again later if they miss it.
  2. A notice that carries a way to undo. Right after deleting a document, "Deleted" sits next to "Undo." With undo present, the confirmation before deleting can be dropped entirely.
  3. A full-screen success page. Used where one flow has ended and another has to begin — payment complete, signup complete.

Three things belong in it: what finished, named specifically; a route to verify the result; and one suggested next action. "Saved 2026 Plan to Team documents" beats "Saved." Being specific is what keeps someone from opening another tab to check.

Don't end in a dead end. A success page offering only a Close button parks the person there and makes them find the next step themselves. If there's no next action worth suggesting, that flow's success was a short notice rather than a full screen. The question of what comes next doubles as a test of whether the flow really ended here.

When you show success before the server answers — optimistic UI — build the reversal for the failure case at the same time. Quietly removing a success you already displayed leaves the person unsure whether their work survived.

How it sounds at work

"Nothing happens after sending an invite, so people are sending twice."

An empty success state is producing retries.

"Put one next action on this success page. Sharing is the natural one."

Use the finished moment as the entrance to the next flow.

"Don't just say saved — say where it saved to."

Naming the target removes the trip to go verify it.

Pagedeck's first-document flow had no such state. Creating a document dropped you straight into the editor and said nothing. Noa added a short notice naming where it saved, with a share button beside it. The share of people who created a first document and went on to share it that week went from 19 percent to 31 percent.

Where to go next

  • UI state

    see how many states there are and which group this one belongs to

  • Loading state

    see the state that comes before it in the same flow

Last updated 2026-09-16