Online Shopping Journey
The code
journey
title Online Shopping Trip
section Discover
Search for shoes: 4: Shopper
Compare two brands: 3: Shopper
section Decide
Read reviews: 4: Shopper
Add to cart: 5: Shopper
section Checkout
Enter payment details: 2: Shopper
Track the delivery: 5: Shopper
How this template works
Retail teams live and die by one number — cart abandonment — and the journey diagram is the tool that explains it: a shopper’s trip drawn as scored steps, with the low point exactly where the money leaks. This template maps the classic arc in three sections, and the built-in finding is the 2 at payment details, the step every checkout team is fighting.
The syntax matches any journey here: journey declares the type, title Online Shopping Trip names it, and section blocks split the trip into Discover, Decide, and Checkout. Task lines are Task: score: Actor — Search for shoes: 4: Shopper scores the search step a 4 for the Shopper persona. Scores drive the color from red at 1 to green at 5, and the shape of the curve is the argument: interest dips during comparison, peaks at the cart, collapses at payment, and recovers at tracking.
The gotchas: three fields exactly, colons only as separators — a task name like “Enter payment: card details” breaks the parse. Scores must be 1 to 5. And the honesty rule: the 2 is the diagram’s whole point; a version where checkout scores 4 is a wish, not a measurement, and it will not survive contact with analytics.
To adapt it, add a Post-purchase section for returns, split Discover into Search and Browse for catalog-heavy stores, or run one file per device — mobile checkout usually scores a point lower than desktop. When presenting it, lead with the lowest score rather than the average: the average hides the leak, while the 2 at payment points straight at the sprint that should fix it.
Related templates: the customer onboarding journey for the SaaS version of the same arc, the payment processing sequence for the messages behind the 2, and the order fulfillment flowchart for what happens after tracking. Full reference: the journey diagram guide.
Variations to try
- Add a Post-purchase section with the return flow if your category has high return rates.
- Change the actor to Returning customer to compare loyal buyers against first-time visitors.
