Manuals / UI/UX Foundations / Chapter 3

A · Understand · beginner · Week 1 · Chapter 3 of 13

User flows & friction mapping

Map the happy path and sad paths. Boxes and arrows expose drop-off risks before pixels.

Path progress
18%

Step 1 of 3

Happy path

Start → key steps → success outcome. One primary job only.

Happy pathDrag stickies · tap for tips
Study mapDrag stickies · tap for tipsKeep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Assert the UIdrag · tap →Retry wiselydrag · tap →Seed datadrag · tap →Close the loopdrag · tap →Keep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Pathwise hackdrag · tap →Happy pathdrag · tap →Try thisdrag · tap →Follow the dashed drag · tap →

Do this now

Map signup → first value for subject app in FigJam.

Was this step clear?
Chapter learning outcomes
  • Flow notation
  • Happy vs edge paths
  • Friction scoring
  • Time-on-task intuition

Clear these before you leave

Side quest

Timed task

Time yourself completing happy path. Note every hesitation >3 seconds.