Flows

UX Flows

A flow is a designed map of movement through an experience: the steps, decisions, states, and handoffs between a starting intent and an outcome. Flows are the working…

User Flow

A user flow is a diagram of the path a user takes through a product to complete one goal — including ALL realistic routes, not just the ideal one. NN/g's distinction: a user…

Task Flow

A task flow maps ONE task as a single, linear, ideal path — no branching, no decision diamonds. Every user is assumed to take the same steps in the same order. This is the…

User Journey Map

A user journey map visualizes what one person experiences over time while pursuing a goal in a specific scenario: the stages they pass through, what they do, think, and feel…

Customer Journey Map

A customer journey map charts the whole relationship between a person and a company — from first hearing of it, through evaluating, buying, onboarding, using, getting help,…

Experience Map

An experience map charts a whole real-world experience as a human lives it — across every tool, service, person, and workaround involved — WITHOUT centering any particular…

Service Blueprint

A service blueprint maps the user's experience AND everything behind it that makes the experience happen: the employees, systems, policies, and internal processes the user…

Screen Flow / Wireflow

A screen flow shows the sequence of ACTUAL screens a user moves through, with the interaction that causes each transition. Where a user flow abstracts steps ("Enter…

Navigation Flow

A navigation flow maps how users MOVE through a product's navigation structure. The split that keeps this file honest: information architecture is the structure (what exists,…

Information Architecture

The full IA method — card sorting, tree testing, information scent, organization schemes, labeling, taxonomy governance — lives in Information Architecture. Read that for how…

Decision Flow

A decision flow maps the conditional logic of an experience: every point where the product asks a question about the user, the data, or the situation, and routes differently…

Process Flow

A process flow maps an operation from trigger to completion: the sequence of steps a piece of work goes through, regardless of who or what performs each step. Where a user…

Workflow Diagram

A workflow diagram maps how people, roles, and teams complete work together: who does each step, who hands off to whom, who approves, and where work waits. It is a process…

State Flow

A state flow maps every state an interface, component, or screen can be in, plus the events that move between them. Where a user flow asks "where does the person go next?", a…

Authentication Flows

An authentication flow maps every route by which a person proves who they are — and every route by which that proof fails and is recovered. This file maps the ROUTES; the…

Onboarding Flows

An onboarding flow maps everything between a new user's arrival and their first meaningful success — the "aha moment" the product was bought for. This file maps the ROUTES;…

Checkout Flows

A checkout flow maps the route from cart to confirmed order — and every branch where money, trust, or patience can leak out. This file maps the ROUTES; field-level evidence…

Registration Flows

A registration flow maps account creation specifically: from "I need an account" to "the account exists and is usable." State the boundary clearly in your flow docs, because…

Error Flow

An error flow maps what happens when things go wrong: every way a task can fail, and the route from each failure back to progress. The happy path is one line; the error flow…

Empty State Flow

An empty state flow maps how users arrive at each empty state and how they get out of it. Emptiness is not one state — it is five different states with five different causes,…

Notification Flows

A notification flow maps what happens between a system event and a (possibly) informed user: trigger → decision (notify at all?) → channel selection → delivery → user action…

Permission Flow

A permission flow maps who can do what, and — the half that gets skipped — what everyone else sees when they can't. Three distinct systems get called "permissions"; a product…

Multi-User Flow

A multi-user flow maps a process that several people — usually in different roles — complete together: collaboration, handoffs, review/approval cycles, and the notifications…

Data Flow

A data flow maps how information moves through a product: what the user enters, what gets validated and transformed, where it's stored, which APIs it travels through, and…

Content Flow

A content flow maps the lifecycle of a content item — create → draft → review → approve → publish → update → version → archive/delete — plus who may move it between steps and…

Conversation Flow

A conversation flow maps a dialogue between a user and a system — bot, voice assistant, or AI agent — as turns: user intent → system response → clarifying questions →…

Voice Interaction Flow

A voice interaction flow maps a spoken dialogue plus the machinery around it: wake word → listening state → intent recognition → confirmation → spoken response → next turn…

XR (VR/AR) Interaction Flow

An XR interaction flow maps how a person enters, moves through, acts in, and exits a 3D experience — headset VR, passthrough mixed reality, or phone/headset AR. It adds…

System Flow

A system flow maps what the software does in response to a user action: the events fired, validations run, jobs queued, APIs called, records written, notifications sent, logs…

Swimlane Flow

A swimlane flow organizes a process into parallel lanes — one per actor, system, or department — so that every step sits in the lane of whoever performs it, and every handoff…

End-to-End Flow

An end-to-end flow maps the entire designed path from a person's first touchpoint to the final business outcome — ad to renewal, search result to referral — as one connected…

Specialized Flows

Nine recurring flows too specific for their own long files, each mapped the same way: what it is, when to design it explicitly, key states, risks, and a compact example.…

Flow Selection Guide

You don't pick a flow type by name — you pick it by the question you need answered. Find your question below, start with that artifact, and expect to add 2–3 companions: the…

Flow Design Checklists

Master checklists for reviewing any flow before it becomes wireframes or code. Not every group applies to every flow — but decide that a group doesn't apply; don't just skip…

Examples Library

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…