You’ve asked the right questions and maybe you have some personas. There’s a heap of feature requests from your client and a whole lot of content to organize into a sitemap (IA) document and wireframes. However, something’s not sitting right and you wonder how your WordPress site fits into the bigger customer journey with the client’s brand, business, and products. In this session, we’ll learn how to get started with taking all of that subject matter expertise you’ve been collecting in your mind, and to convert it into one of several useful types of journey maps. You’ll gain techniques and approaches for summoning ideas from many decision-makers and learn how these tools can fit into your greater web project.

1. Intro to User Journey Maps
for Building Better Websites
WordCamp Minneapolis 2017 • #wcmsp • @anthonydpaul

2. Which design is better? Which is higher quality? Which cost more?

3. Both are inappropriate in context (props to Jeff Patton for the cake metaphor)

4. Websites work the same.
Who is it for?
Where are they using it?
How does it fit into their life?

5. All of this affects the type of
cake website we make.

6. website

7. journey website

8. journey website

9. journey website
People are complex
Thoughts and decisions
Tasks to perform
Discovery and advancement
Motivations and anxieties

10. Where do I start?

11. Anthony D Paul
Futurist, Researcher, and Usability Flag-Waver
@anthonydpaul

12. Don’t assume you need this

13. Do as little as possible.
Identify blind spots.
Say what you might know.
Use other smart people.

14. Documentation is disposable.
Document to ask and answer
questions—to gain shared
understanding.

15. 1. Who Audience groups
2. Why Motivations, anxieties, influencers
3. What / How Decisions, tasks
4. When / Where Devices, scenarios, entrances, exits
Use any fidelity to ask questions and provide answers

16. Sources for Audience Information

17. Interviews with clients and subject
matter experts (SMEs)
Pros: Usually easy to access
Cons: Can introduce stereotypes
Can pit internal politics (ranking opinions)

18. Interviews with customers (users)
Pros: Best source of qualitative stories
Cons: Needs a diverse sampling
Can be a headache to get access and organize

19. “contextual inquiry”

20. group audience definition

21. group task definition

22. group task definition

23. group task prioritization

25. group journey map

26. group journey map

27. Usability tests with customers (users)
Pros: Best source of qualitative stories
Shortcut to recommendations
Cons: Needs a diverse sampling
Can be a headache to get access and organize
http://wordpress.tv/2016/08/14/anthony-d-paul-organizing-your-first-website-usability-test-2/

28. Usability test today’s site

29. raw findings

30. anecdotal but qualitative

31. quantified

32. Survey data
Pros: Great quantitative content
Cons: Needs a diverse sampling
Needs to be analyzed

33. Market reports
Pros: Often does the work for you
Cons: Level of specificity is hit and miss
May or may not map to your segments
Google > filetype:pdf

34. Google > filetype:pdf

35. Web analytics
Pros: Easy to access (if it exists)
Cons: Ambiguous, lacks context
Need to be analyzed

36. Google Analytics > Audience > User Explorer

37. Google Analytics > User Explorer

38. For best results,
a blend of info sources

39. Example Documents

40. 1. Who Audience groups
2. Why Motivations, anxieties, influencers
3. What / How Decisions, tasks
4. When / Where Devices, scenarios, entrances, exits
Define and prioritize

41. Audience types

42. 1. Who Audience groups
2. Why Motivations, anxieties, influencers
3. What / How Decisions, tasks
4. When / Where Devices, scenarios, entrances, exits

43. Audience types (with motivations, anxieties, influencers)

44. Individual persona

45. 1. Who Audience groups
2. Why Motivations, anxieties, influencers
3. What / How Decisions, tasks
4. When / Where Devices, scenarios, entrances, exits
Determine order, optional, and required

46. User scenario

47. Decision phases

48. Decision flow with UI conversations

49. Google Analytics > User Explorer

50. Session flow map

51. storyboard

52. 1. Who Audience groups
2. Why Motivations, anxieties, influencers
3. What / How Decisions, tasks
4. When / Where Devices, scenarios, entrances, exits

53. High-level ecosystem flow (email, 3rd-party systems)

54. Detailed ecosystem flow (login validation)

55. Example Project

56. Summer Camp Website

57. Define and prioritize groups
• Parents
• School groups and educators
• New camp counselors
• Sponsors/Donors/Partners
• Extra credit = Content administrators

58. Take one group and document “why”
New Camp Parents
• Want child to learn during summer (motivation)
• Heard about camp from a friend (entrance)
• Find site via Google (entrance)
• May have a budget (anxiety)

59. Document decisions
New Camp Parents
• How is this camp different?
• Are we eligible? Can we afford it?
• Is there availability? How do I sign up?
• Are there mobile driving directions?

60. Convert decisions into task flows
Is there availability? How do I sign up?
• Access seasonal calendar
• Filter by topic or grade level (e.g.)
• [See available]
• Use sign-up button

61. Single user and scenario journey map

62. Homework Assignment
See Eric Meyer’s WC Northeast Ohio 2016 Keynote
http://wordpress.tv/2016/06/24/eric-a-meyer-design-for-real-life/

63. Our instinct is to imagine
someone like ourselves.
So many of our users are
nothing like us in any way.”
“

64. Journeys help us understand
real-world “stress cases.”
Journeys define who
we care about.

65. Think of journeys for users who
• Have accessibility issues
• Are sad
• Are in a life crisis
• Are hurried

66. journey website

68. SlideShare
http://www.slideshare.net/anthonydpaul
WordPress.tv
http://wordpress.tv/speakers/anthony-d-paul/
(my talks and blog)
http://adp.rocks or http:// .ws or http:// .ws
Thank you
@anthonydpaul