UX Encyclopedia

Examples Library — Worked Text Flows

Fifteen compact, realistic flows in the section's text notation (Step → Step, indented branches). Each shows the happy path plus at least one failure branch, and names the flow files it exercises — copy the shape, then walk it through Flow Design Checklists.

SaaS project creation — uses: 02, 03, 14, 20, 22

Dashboard → "New project" → Name + template picker
  → (optional) invite teammates → Create
  → Project home in EMPTY state: guided first actions, sample data
  → First item added → empty state retires
Branch — name collision: inline error, suggest "Site Survey (2)",
  input preserved
Branch — invited user lacks a seat: explain, offer request-to-admin
  path instead of a silent failure

Drone-mapping upload & processing — uses: 03, 14, 19, 24, 29, 32

Select flight images (200) → client validation
  → 3 rejected (unsupported RAW) — listed, upload continues with 197
  → Upload with per-file progress, resumable → all received
  → Processing queue: "Stitching orthomosaic, ~20 min" → email +
    in-app notify when done → View map → annotate/share
Branch — processing fails on low overlap: job flagged, plain-language
  cause ("images overlap <60%"), refly guidance, no re-upload needed
  to retry adjacent fixes

E-commerce checkout — uses: 17, 14, 19, 07

Cart → Checkout (guest allowed) → Address (autofill) → Shipping
  choice → Payment → Review order → Place order
  → Processing (button disabled, one submit) → Confirmation + email
Branch — card declined: return to Payment with all fields intact,
  specific reason where the processor allows, alternate method
  offered; cart untouched
Behind the scenes (blueprint lane): fraud check and inventory
  reservation run between Place order and Confirmation — both need
  timeout states

User registration — uses: 18, 15, 19, 14

Landing → "Sign up" → email + password (rules shown up front)
  → Create account → verification email sent → user clicks link
  → verified → onboarding (16)
Branch — email already registered: don't leak it on-page; say
  "check your email" and send a sign-in/reset link instead
Branch — verification link expired: friendly page → one-tap resend
  → same flow resumes; account not stranded

Password reset — uses: 15, 19, 21

Sign-in → "Forgot password?" → enter email → "If an account exists,
  we've emailed a link" (no account enumeration) → email → link
  → new password (rules + strength shown) → success → signed in
  → confirmation email ("this was you?") to the address on file
Branch — link expired/reused: explain plainly, one tap to send a
  fresh link, no dead end
Branch — no email arrives: resend with rate limit + "check spam"
  + support path

AI chatbot support — uses: 26, 32, 19

User states problem → bot classifies → clarifying question (one)
  → suggests article with excerpt → "Did this solve it?"
  → Yes → close politely, log deflection
Branch — No, or no-match ×2: offer human handoff with transcript
  and account context attached → ticket created → number + response
  time stated
Branch — bot uncertain: says so and offers the human path early —
  never bluffs an answer

Uncertainty and handoff patterns: Designing AI-Powered Interfaces.

Voice checklist — uses: 27, 26

"Start my drone preflight checklist" → "Starting. Is the battery
  fully charged?" → "Yes" → "Confirm propellers are secure." →
  "Confirmed" → … → "Preflight complete. 6 of 6 checks passed."
Branch — a check fails: logged, "fix and say 'recheck', or 'skip'
  to note it and continue"
Branch — silence (user's hands are busy): generous timeout, then
  "Say 'ready' when you are" — the mic stays a state, not an error;
  "repeat" and "where am I?" work at every step

VR training module — uses: 28, 03, 14

2D briefing (space/pose expectations) → enter headset (fade in)
  → height calibration → tutorial panel → Station 1: watch demo
  → guided attempt (steps gated, mistakes coached in place)
  → free attempt (scored) → debrief panel → exit (fade) → 2D report
Branch — trainee removes headset mid-attempt: auto-save, pause;
  on return, re-orient ("You're on step 4") and resume
Comfort: teleport between stations; suggested break between modules

AR object inspection — uses: 28, 03, 19

Open app → coaching ("point at the unit, move slowly") → object
  recognized + anchored → spatial labels with leader lines →
  step through inspection points → mark pass/fail per point →
  summary → sync report
Branch — tracking lost (dark corridor): overlay dims, coaching
  returns, checklist state kept; inspector can continue in non-AR
  list mode and re-anchor later — the fallback is first-class

CMS article publishing — uses: 13, 23, 14, 22

Author drafts (autosave) → submit for review → Editor notified →
  review → approve → schedule → published at time → author notified
Branch — changes requested: editor comments attach to draft →
  returns to author IN DRAFT with comments visible → resubmit loop
  (state machine: draft ↔ in-review → approved → scheduled →
  published → archived)
Branch — publish-time failure (broken embed): stays scheduled,
  alert to editor with the failing element named — not a silent miss

Admin approval workflow — uses: 30, 23, 22, 21

Requester lane: submit expense → sees "pending"
Manager lane:   notified → review → approve (or reject with reason)
Finance lane:   batch approve → payment scheduled → paid
Requester lane: notified at each state change
Branch — manager idle 5 days: reminder → escalates to their manager
  (timeout is a designed transition, not a stuck ticket)
Branch — rejected: reason required; requester can edit and resubmit,
  history preserved

Subscription upgrade — uses: 32, 14, 24

Settings → Plans → compare → choose Pro → prorated price shown
  before any commitment → confirm → payment → features unlock
  immediately → receipt + next-billing date
Branch — payment fails: plan unchanged, clear message, retry or
  alternate card; no half-upgraded limbo state
Branch — downgrade path: show exactly what's lost and when it takes
  effect; over-limit data preserved read-only, not deleted

Search & filter — uses: 32, 02, 14

Focus search (recents shown) → type → suggestions → pick or Enter
  → results: count + query + sort → apply filters (chips visible)
  → refine → open result → back (state preserved)
Branch — zero results: spell-corrected retry offered, broadened
  matches labeled as such, popular categories, browse path — never
  a bare "0 results"
Branch — zero-result filter combo: prevented by per-value counts

File export — uses: 32, 24, 21

Report view → Export → choose format + range → size estimate
  → small: generate inline → download
  → large: async branch — job queued → progress in a jobs tray →
    notify when ready → download link (labeled expiry)
Branch — generation fails: named cause, retry keeps configuration
Branch — expired link: "Regenerate this export" with the saved
  settings, not a 404

Multi-user collaboration — uses: 23, 30, 14, 21

Owner shares doc → invite (role picker: view/comment/edit) →
  invitee accepts → both editing: presence cursors, changes merge
  live → comment → mention notifies → resolve
Branch — conflict on the same element: last-write wins with a
  visible "edited by Sam just now" + version history to recover —
  never silent overwrite
Branch — role revoked mid-session: editor becomes viewer in place,
  told why, unsaved local edits offered as a copy

Every example above deliberately shows fewer states than production needs. Before building any of them, run the full pass: Flow Design Checklists.

↑↓ to navigate · Enter to open · Esc to close