Skip to main content
Design & UX

User Flow

UX Flow | User Journey Map

Portrait of Robert Klimant, co-founder of Roelu Studio
Robert KlimantCo-founder

What is User Flow?

A user flow, sometimes called a UX flow or user journey map, is a diagram of the steps a person takes to complete a specific task in a product — like signing up, booking a demo, or buying something. Each step is a screen or decision point, connected by arrows. User flows are built before high-fidelity design to make sure the structure of the experience is right before any pixels get polished.

Why it matters

Most conversion problems aren't design problems. They're flow problems. The button is fine. The form looks great. The issue is that the visitor had to click through four pages to reach it, or got asked to log in before they understood the offer. User flows expose this in a single diagram. The team can see the path on a wall, count the steps, and ask the obvious question: does this actually have to be this long? Almost always, it doesn't. Cutting steps out of a flow is the highest-impact UX work there is.

How it works

The designer picks a key task — "book a demo," "start a trial," "purchase a plan," "recover a password" — and maps every screen the user passes through, from entry point to completion. Decision points ("is the user logged in?" "do they have a saved payment method?") branch into multiple paths. The flow gets drawn in Figma, FigJam, Whimsical, or even on paper. The team walks the diagram and asks the obvious question: which steps can be combined, removed, or deferred until later in the relationship? Once the flow is tight, the designer moves into wireframes and prototypes built against the new structure. Post-launch, analytics tools like PostHog confirm whether actual user behavior matches the planned flow — or where the real users invented their own path.

Related terms

  • User Experience

    Design & UX

    How it feels to use a product from start to finish — the speed, the clarity, the flow, the copy, the moments of friction, the parts that just work — not just…

  • Wireframe

    Design & UX

    A low-fidelity sketch of a webpage that shows structure, layout, and content priorities — without color, type, or polish — so the team can argue about the plan…

  • Prototype

    Design & UX

    A clickable mock-up of a website or product that simulates the real interactions — clicks, transitions, flows, micro-states — so the team can test how it…

  • Customer Journey

    Marketing

    The full path a person takes from first hearing about your category to becoming a happy paying customer — every search, click, conversation, comparison, and…

  • Conversion Rate Optimization

    Marketing

    The practice of systematically improving the percentage of website visitors who take a desired action — sign up, book a demo, buy — instead of just chasing…

  • Marketing Funnel

    Marketing

    The path a stranger takes from first hearing about your company to becoming a paying customer — usually drawn as broad awareness at the top narrowing down to a…

  • Figma

    Design & UX

    The browser-based design tool most product and marketing teams use to design websites, apps, and interfaces — collaborative, fast, and the de facto standard…