Context, Baby! Context! User Journeys for Responsive Design

  • 24,898 views
Uploaded on

Designing responsive experiences across screens takes consideration of users’ needs and situation. By mapping out and understanding the customer journey, we can plan content from the smallest …

Designing responsive experiences across screens takes consideration of users’ needs and situation. By mapping out and understanding the customer journey, we can plan content from the smallest canvas-out, and create content that's right for our organizations and our users regardless of the device.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
24,898
On Slideshare
0
From Embeds
0
Number of Embeds
13

Actions

Shares
Downloads
1
Comments
7
Likes
72

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Context, baby! Context! User journeys for Responsive design CS Applied USA 2013 @rebekahcancino
  • 2. Surprise!
  • 3. Context, baby! Context! User journeys for design
  • 4. That’s me, in the back there! @rebekahcancino
  • 5. It’s responsive! It’s adaptive?
  • 6. You keep using that word. I don’t think it means what you think it means.
  • 7. We have to think beyond breakpoints
  • 8. We have to plan from the smallest canvas-out
  • 9. You don’t know what you don’t know. Short-term tactics without long-term strategy will always lose. It’s just a matter of time. The “future” is getting faster. #CSAUSA @rebekahcancino
  • 10. Why user journeys? User journeys are really people journeys.
  • 11. CONTEXT.
  • 12. CONTEXT is not tied to devices
  • 13. CONTEXT is tied To people
  • 14. Every content experience we design is for people. To design delightful experiences, we must let our users decide what works for them and their context. #CSAUSA @rebekahcancino
  • 15. Sup, JSpool!
  • 16. "Search is only for the site’s content. The refund policy is not content." -  A Client
  • 17. Everything is content. “Content is what the user needs or wants right now.” - Jared Spool
  • 18. Good for grain, bad for user experiences
  • 19. Brands are not experienced in one channel or touchpoint. A lack of interconnectedness is a major competitive risk. #CSAUSA @rebekahcancino
  • 20. The experience we create digitally is just one very small slice of the overall customer experience. Customer journeys are massively important when it comes to creating a more unified experience across everything. #CSAUSA @rebekahcancino
  • 21. A bit of distinction. Customer Journey vs. User Journey. Today, we’re bringing in our focus to the User Journey in relation to a website. But please, for the love of all that’s holy, don’t forget the overall Customer Journey, in your other work. #CSAUSA @rebekahcancino
  • 22. Your context is not my context
  • 23. What about the “mobile context?” “I love fiction. UFOs, unicorns, faith healing, the Mobile Web, the Mobile Context, psychics.” - Stephen Hay
  • 24. We live in a cross-platform culture. People don’t think, “Is this task appropriate for this device?” We often use multiple devices, from start to finish, during a single task. #CSAUSA @rebekahcancino
  • 25. A mobile device may be someone’s only access to your site. People with lower incomes deserve equal access to the internet. #CSAUSA @rebekahcancino
  • 26. Surprise!
  • 27. “He found his last three sports cars on his phone. When he arrived at the dealership, he was ready to buy.”
  • 28. user journeys 1 1 2 1 Define your purpose and goals 3 1 v 4 1 5 Consider their behavioral context Know your audience Map their journey and attach to persona Iterate, test, refine, repeat!
  • 29. Why are you in business?
  • 30. Every journey has a destination
  • 31. Where a person is going says a lot about their journey. The person on the journey does not decide what the destination is like, they choose it because of what it already is. #CSAUSA @rebekahcancino
  • 32. Defining your purpose, values, style, and vision is the foundation for everything else. You can’t understand your users’ journeys without knowing why you exist and what you stand for. #CSAUSA @rebekahcancino
  • 33. PURPOSE VALUES Why you’re in business. It summarizes the difference you’re trying to make in the world and what drives you every day. The attitudes and beliefs at the core of your company. What’s truly important to your business, and should be reflected in all of your decisions and actions. STYLE VISION Traits representing your core characteristics and style of doing business. Used as a source of inspiration and guidance for branding, site design, messaging, and more. What the future will look like once your goals are achieved. It’s important for this to be clear so everyone is working towards a common goal.
  • 34. “We’re 80sTees.” “And our mission is to delight and amaze the kid in us all.”
  • 35. user journeys 1 1 2 1 Define your purpose and goals 3 1 v 4 1 5 Consider their behavioral context Know your audience Map their journey and attach to persona Iterate, test, refine, repeat!
  • 36. Take a look inside
  • 37. Personas should be grounded in research and elevated by empathy. They’re filters to help you to see through your users’ eyes. They speak to decision modes, preferences, concerns, motivations, and information needs. #CSAUSA @rebekahcancino
  • 38. You are not your target audience. Beware of biases. Don’t assume you know what your users want and why they choose to do business with you. Ask them. #CSAUSA @rebekahcancino
  • 39. Capture the richness of the human experience. Have conversations, follow a directed storytelling method, be curious, document everything. #CSAUSA @rebekahcancino
  • 40. Check it twice. Qualitative research is only as good as the questions you ask and the skill level of the interviewer. Use quantitative research to gather clues and validate hunches, but be wary of making broad assumptions. #CSAUSA @rebekahcancino
  • 41. logical methodical competitive slow fast humanistic spontaneous emotional
  • 42. user journeys 1 1 2 1 Define your purpose and goals 3 1 v 4 1 5 Consider their behavioral context Know your audience Map their journey and attach to persona Iterate, test, refine, repeat!
  • 43. Thinking. feeling. doing.
  • 44. Don’t be a heartless bastard. “The number one practical competency for success in life and work is empathy.” -  Peter Drucker #CSAUSA @rebekahcancino
  • 45. Personal-behavioral context Cognitive Learning ability, education, cognitive assumptions learning Environmental factors, physical activity, habits, disabilities, sensory stimuli Physical doing Emotional feeling Psychological state, stress, desires, needs By Daniel Eizans
  • 46. Remember this guy?
  • 47. He’s got a behavioral context too.
  • 48. user journeys 1 1 2 1 Define your purpose and goals 3 1 v 4 1 5 Consider their behavioral context Know your audience Map their journey and attach to persona Iterate, test, refine, repeat!
  • 49. User flows, ftw.
  • 50. A deep dive into data can be delightful. Google Analytics ü Entry pages ü Exit pages ü Devices ü User flow ü Traffic sources #CSAUSA @rebekahcancino
  • 51. Think it through together
  • 52. Invite everyone to the party. The more skill sets and perspectives represented, the better. ü Marketing ü Sales ü Customer Service ü Development ü Executives, etc. #CSAUSA @rebekahcancino
  • 53. A puppy story
  • 54. EXAMPLE - Susan: the browsing buyer Susan isn’t on a mission to buy a new puppy, she’s just browsing the internet and having fun looking at cuddly little animals. She switches modes when she finds a pup on your doggy matchmaking site she just can’t live without.
  • 55. Susan: the browsing buyer As a new user, Susan comes to the site through: As a return user, Susan comes to the site through: •  •  •  •  •  •  •  •  Image Search Facebook/Pinterest Individual dog listings YouTube Direct visit Facebook/Pinterest Breed hub page Breed available notification email
  • 56. Susan: the browsing buyer .
  • 57. Adaptive Path knows what’s up.
  • 58. Susan: the browsing buyer In charting out Susan’s journey we discover: •  •  •  •  Potential points of friction Gaps in information Opportunities for microconversions What metrics we’ll use to continuously improve her experience •  Content prioritization •  And more!
  • 59. These insights inform our considerations for small screens. •  COPE (Create once, publish everywhere) •  Interdigitation (Flexbox) •  Localized content •  CMS issues •  Metadata and markup •  And more!
  • 60. user journeys 1 1 2 1 Define your purpose and goals 3 1 v 4 1 5 Consider their behavioral context Know your audience Map their journey and attach to persona Iterate, test, refine, repeat!
  • 61. Look for patterns
  • 62. Good: Metrics are about measurement Better: Metrics are about learning
  • 63. Remember. There’s no such thing as “the most important metrics” for everyone or a plug-and-play measurement strategy. #CSAUSA @rebekahcancino
  • 64. Ask questions You see a high amount of page views per visit with a relatively low avg. time on site, and you wonder: Are they having a hard time finding what they need? You formulate a hypothesis: Maybe our navigation is unclear? Which leads to an experiment: Let’s clarify the navigation nomenclature and see if there’s an improvement
  • 65. This story never ends
  • 66. Remember. The digital work we do is never final. This is an iterative process. Plan for constant improvement, adjustment, and learning. #CSAUSA @rebekahcancino
  • 67. Don’t let your insight become an artifact. Find ways to keep the understanding you gained from charting user journeys alive as you iterate. Create accountability, buy-in, and a shared sense of ownership. #CSAUSA @rebekahcancino
  • 68. Questions? Let’s talk, preferably with cocktails. #CSAUSA @rebekahcancino