Skip to content
Afordz

Module 06 · 20 min

User flow charts

A user flow chart shows the path from entry to a goal. It sits on top of your IA: navigation says what exists; the flow says in what order people move.

  1. 01Onboard
  2. 02Browse
  3. 03Pay

Divide the flow into parts

For a shopping app like Bazaar, split the chart into three parts so it stays readable. Other app types use the same idea with different middle and end goals.

  • Onboarding / way to dashboard / login
  • Information architecture — browse, search, product detail
  • Payment process — cart, checkout, confirmation

Flow chart guidelines

Keep each step one clear action. Show decisions as branches. Include the unhappy paths you already know from research — empty cart, failed payment, blocked login.

  • Start with entry (splash, sign up, or login).
  • Name screens and decisions in the user’s words.
  • Mark success and failure exits.
  • Reuse your IA labels so the flow and navigation match.

Example: Bazaar user flow

A compressed outline of the three parts. Your chart can show more decision diamonds.