Designing mobile and responsive experiences that delight our users and meet our organizational objectives isn’t easy, but it’s not impossible. User journeys can help. Understanding our users context is critical to the success of every app or responsive website. But more often than not, we jump right into discussing functionality and technical requirements without ever stopping to considering who our users are and what they need. While many of us seek out shiny new tools to prototype products, mapping the users’s journey is still the most reliable tool we can use to understand context and design mobile experiences that matter. This talk covers: -What journey mapping entails (and why it is an essential tool for designing effective mobile experiences) -Practical tools and exercises you can use to understand user context and consider those insights in your app or responsive design -Techniques for mapping user journeys with your team and applying what you’ve learned to build better user flows, features, interactions and interfaces

1. FOR DAMN GOOD DIGITAL DESIGN
Journey Mapping
CHARLOTTE DIGITAL SUMMIT 2015 - @REBEKAHCANCINO

2. Roadtrippin’ with Dad

3. Quite the journey

4. Remember these?

5. Roadside design decisions
UNDERSTANDING THE TRAVELER’S NEEDS

6. Get your kicks...

7. So glamorous

8. All the necessities

9. Not necessary at all

10. Context, baby

11. THINKING
DOINGFEELING
The user’s context
From Daniel Eizans

12. THINKING
DOINGFEELING
The user’s context
I need an
affordable place
to stay for the
night and a way
for the kids to
release some
energy
Driving for long
periods of time
with two kids in
the back
Carrying a lot of
luggage for the
family
Parents: tired,
hungry
Kids: restless,
hungry

13. Find motel Park, unpack
kids, lug into
lobby, book
room
Park near
room, unload
kids, bring
luggage
Take kids
swimming
Find food Go to bed
Dear God, no.
Hooray!

14. Motels vs. hotels: affordable, swimming pool,
parking nearby rooms, outside facing doors
Clustering necessities: lodging, food, gas
Roadside attractions with novel flair
Showers, truck washes, auto repair
And so on…
Contextually relevant experiences

15. Design for context
AND EVERYTHING ELSE WILL FOLLOW

16. Context

17. The mobile context?

18. “I love fiction. Unicorns, UFOs, faith healing, the
Mobile Web, the Mobile Context, psychics.”
- Stephen Hay

19. CONTEXT ISN’T TIED TO DEVICES

20. CONTEXT IS TIED TO PEOPLE

21. Responsive website or native app?
iOS and Android? Windows?
Features?
Gestures?
Wondering where to start?

22. THINKING
DOINGFEELING
Start with context

23. What actions are users taking to meet their needs?
What’s the real goal or hidden motivation?
What do they expect?
What are their potential high points and low points?
What devices do they use? For what? When?
Then keep going...

24. Why map the journey?
BUILD ALIGNMENT, ADD VALUE,
AND MAKE STUFF THAT MATTERS

25. The world’s first
social streaming media player?

26. Wasted time and money

27. Create alignment and a shared understanding of the
users journey, behaviors, and needs
Remove politics and pet projects out of product design
Prioritize needs and identify key functionality
Discover opportunities for innovation and delight
The value of journey mapping

28. Journey maps are strategic tools you can use
to save time and money, add value, and make
experiences that matter.

29. Understanding context clarifies user needs
so that you can create products that deliver
business results.

30. Strategic direction: Why are we making this, what
problem are we solving?
Required functionality: What features and functionality
should we offer?
Design decisions: How the product should look, sound,
and feel?
Three kinds of insight

31. Strategic insight
WHAT PROBLEM ARE WE SOLVING?

32. Invite two groups of users from each key segment:
they formulate problem statement, you ask smart
questions
Have internal cross-discipline team of stakeholders
help facilitate: build shared understanding, get
alignment on direction
Share ideas with the group: listen for nuances,
patterns, and hidden motivations
Codesign the way forward

34. Formulate a problem statement

35. Map the user’s context

36. Share with group, listen for nuances

37. Look for patterns

38. After working with customers to define problem and
map context, we discovered that the planned app
was the wrong solution all together.

40. Bonus, beyond the journey

42. Required functionality
WHAT FUNCTIONALITY AND FEATURES
SHOULD WE OFFER?

44. Journey evidence is everywhere

45. Mine the data, all the data

46. Made for in-store experiences

47. Search
For photos on your
phone while you’re
waiting
47
Select
Choose the photos you
want to print
Print & pick-up
Your photos are ready
for pick-up after your
waiting is through

48. vs.

51. Estimate your fare here!

52. I mean . . .

53. Map the journey

54. User steps (their journey)

55. Features, functionality, content

56. Critical steps, what’s going well,
what needs improvement

57. Design decisions
HOW SHOULD IT LOOK, SOUND, AND FEEL?

60. THINKING
DOINGFEELING
The user’s context
I need a way to
relax, increase my
focus, and be
more intentional
On their phone
trying to focus
their attention,
perhaps in the
mist of a busy
space
Stressed,
overwhelmed,
scattered

62. Authentic, helpful, and human

65. “I didn’t go looking for grief this afternoon, but it found
me anyway, and I have designers and programmers to
thank for it. In this case, the designers and programmers
are somewhere at Facebook.”
@meyerweb
Inadvertent algorithmic cruelty

67. Super secure

68. Customer:
“Why can’t I take a screenshot while using the Wells Fargo
app on my Android phone?”
Wells Fargo:
“For the safety of our customers we have disabled this
feature in the Android OS… Given that there could be
some sensitive info on the screenshot, we blocked this
capability on Android.”

69. Get buy-in
HOW TO GET PEOPLE ON BOARD

70. Journey maps help us: get strategic insight,
prioritize features and functionality, and make good
design decisions.
Whether you’re deciding on language, visual design,
features, gestures or anything else in between—
understanding context and mapping the journey
helps you make it better.

71. Save time and money by getting to the best solution
faster with less rework
Gain and retain customers by providing them with
elegant solutions they need
The value of understanding context
and mapping the journey

72. @rebekahcancino
rebekahcancino.com
sitewire.com
Happy mapping!