Skip to content
UX Atlas
WorkflowCraft conventionFoundational

User Flows

Map the decisions, states and exits before drawing screens, because most missing work hides in the branches nobody drew.

Definition

A user flow shows the sequence of steps, decisions and system states required to complete a task. It is a thinking tool first and a communication artefact second, and its main value is exposing the states a screen-led design silently omits.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this page
  1. Definition
  2. What a flow must contain
  3. Three levels, three uses
  4. Drawing them
  5. Continue from here

What a flow must contain

  • The entry points, all of them. Most tasks can be started from more than one place.
  • Each decision the person makes, with the options available at that moment.
  • Each decision the system makes, including validation, permission and availability.
  • The states that are not screens: loading, empty, partial, expired, offline.
  • The failure branches, with what happens to work in progress.
  • The exits, including abandonment and what is preserved.

Three levels, three uses

LevelShowsUse it for
Task flowOne path through one task, no branchesAligning on the happy path quickly.
User flowDecisions, branches and statesFinding the work nobody has scoped.
Service or journey mapSteps across channels and time, including offlineProblems that leave the product: delivery, support, billing.

Drawing them

Do

  • Use one shape per meaning and say what the shapes mean on the diagram itself.
  • Name each step as a verb the person performs.
  • Show error and empty branches at the same weight as the success path.
  • Keep the flow at one level of detail. Two levels on one canvas becomes unreadable.

Do not

  • Do not draw only the happy path and call the rest edge cases. They are most of the build.
  • Do not put screen thumbnails in a flow meant for decisions. It turns into a sitemap.
  • Do not maintain a flow nobody reads. If it has stopped being used, it has stopped being true.

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Often used with

These usually appear in the same screen or the same decision.

Related concept

Connected closely enough to change how you apply this.