09 Nov Journey Maps: Tracing a Visitor From First Click to Contact, Donation, or Booking
Part 6 of Start the UX Design Process — a series on the UX principles I use in client work.
A persona tells you who a visitor is. A user story tells you what they need. A journey map tells you what actually happens between the two — step by step, click by click, feeling by feeling — from the moment somebody first finds you to the moment they contact, donate, register, or book. Or, just as importantly, to the moment they quit.
Most businesses have never seen their own site as a journey. They have seen it as pages: a homepage, a services page, a contact page, each judged on its own. Visitors do not experience pages. They experience a path, and a path is only as strong as its weakest step. A beautiful donate page cannot save a journey that lost the donor three steps earlier, on a story page that never explained what the money does.
What a journey map actually is
Strip away the workshop posters and a journey map is a simple timeline with four rows. Across the top, the steps a visitor takes, in order. Under each step, what they are doing. Under that, what they are thinking or feeling. And under that, where it breaks — the pain points from post three, placed at the exact step where they bite.
Take a first-time donor to a nonprofit like United Way of Wayne County. The journey might run: sees a social post, lands on the homepage, reads a story about the work, looks for how to give, opens the donate page, hesitates, completes or abandons. That is six steps, and each one is a chance to help or lose the person. If the story page never connects the work to the donation, the donor arrives at the donate page unconvinced. If the donate page asks for information nobody has handy, the donor stalls at the last step — the most expensive place to lose someone, because they were already willing.
Take a first-time guest for First Baptist Church of Goldsboro. The journey might run: searches for a church, lands on the homepage, looks for service times, tries to picture Sunday morning, looks for kids’ information, decides whether to come. If any step fails — times buried, no picture of Sunday, no answer about kids — the journey ends with a polite “maybe next week” that never comes.
Take a festival attendee for NC Freedom Fest on event day. The journey is shorter and faster: opens the site on a phone, looks for today’s schedule, looks for parking, heads to the event. On a phone, in a car, in a hurry, every extra tap is a risk. A journey map for that visitor is ruthless about tap count, because the visitor is ruthless about it too.
How to build one without a workshop
You do not need a wall of sticky notes to build a useful journey map, though sticky notes help if you like them. Start with one persona and one user story from the last two posts. Write the steps that persona takes to finish that story, in order, as they actually happen today — not as you wish they happened. Be honest about the detours: the search that failed, the menu that confused, the page they landed on by accident. The map of the real journey is useful. The map of the ideal journey is a fantasy.
Then, under each step, add two things: what the visitor is feeling, and where it breaks. Feelings matter because they predict behavior. Confusion predicts back-button clicks. Worry predicts abandonment. Confidence predicts completion. If you cannot name the feeling at a step, you have not listened closely enough yet — go back to the interviews.
Then run one more check at every step, for accessibility. Limits on using a site are not always permanent: a broken arm, a bright screen in sunlight, a noisy room, a parent holding a baby all temporarily change how somebody can use a page — and the same step that fails a visitor with a permanent disability will often fail them too. At each step, ask: can this be done one-handed? Can it be understood without sound? Without color alone? By a screen reader, if the information lives only in an image? A schedule posted only as a picture, a video with no captions, a form that flags errors only in red — each of these is a journey step that quietly ends for a whole group of visitors. Catching them on the map, step by step, is far cheaper than discovering them after launch.
Finally, mark the moments that matter most. In journey work these are sometimes called moments of truth: the step where trust is won or lost. For a donor, it is often the story-to-donate handoff. For a guest, it is the first picture of what Sunday actually looks like. For an attendee, it is the schedule loading fast on a phone. Fix the moments of truth first. A journey with strong moments of truth forgives a weak step elsewhere. A journey with a broken moment of truth does not.
What journey maps change
The first thing a journey map changes is the argument about the homepage. Once you see the whole path, you stop judging pages in isolation and start judging handoffs: does this page send the visitor to the right next step, with the right information and the right confidence? A page that looks fine alone can be a terrible handoff — it answers a question nobody asked, or it ends without a next step, and the visitor drifts away.
The second thing it changes is priorities. A journey map makes it obvious which step is losing the most people, and that step becomes the redesign’s first job — not the prettiest page, not the loudest stakeholder’s page, but the step where the journey actually breaks. That is a much better use of a redesign budget than a fresh coat of paint on a page that was never the problem.
The third thing is empathy that sticks. A team that has walked a visitor’s journey step by step stops designing for “users” in the abstract. They start designing for the parent in the car, the guest on Sunday morning, the donor hovering over the donate button. That shift — from pages to people on a path — is the whole point of this series so far.
With the journey mapped, the research phase has done its job. You know who your visitors are, what they need, where they get stuck, and where the path breaks. The next post turns all of that into the single most useful sentence in a website project: a problem statement that names the real design problem, so the ideas in the posts after it solve the right thing.
Want to see your own site as a visitor’s journey, not just a set of pages? I build and redesign websites for small businesses, non-profits, and churches across Eastern NC. Get a free consultation or see recent work.
Previous in this series: User Stories · Next: Define the Problem: Problem Statements, Hypothesis Statements, and Value Propositions
This article is my own take, in my own words, on UX principles I use in client work. It is not affiliated with or endorsed by Google or Coursera.