Context, baby! Context!

User journeys
for

Responsive design
CS Applied USA 2013

@rebekahcancino
Surprise!
Context, baby! Context!

User journeys
for

design
That’s me, in the back there!
@rebekahcancino
It’s responsive!
It’s adaptive?
You keep using that word.

I don’t think it means what you think
it means.
We have to think beyond
breakpoints
We have to plan from
the smallest canvas-out
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 ...
Why user journeys?
User journeys are really people journeys.
CONTEXT.
CONTEXT is not tied to
devices
CONTEXT is tied To
people
Every content experience we design is
for people.
To design delightful experiences, we
must let our users decide what work...
Sup, JSpool!
"Search is only for the site’s content. The
refund policy is not content."
-  A Client
Everything is content.

“Content is what the user needs
or wants right now.”
- Jared Spool
Good for grain,
bad for user experiences
Brands are not experienced in one
channel or touchpoint.
A lack of interconnectedness is a
major competitive risk.

#CSAUS...
The experience we create digitally is just
one very small slice of the overall customer
experience.
Customer journeys are ...
A bit of distinction.
Customer Journey vs. User Journey.
Today, we’re bringing in our focus to the
User Journey in relatio...
Your context is not my
context
What about the “mobile context?”

“I love fiction. UFOs, unicorns, faith
healing, the Mobile Web, the Mobile
Context, psyc...
We live in a cross-platform culture.
People don’t think, “Is this task
appropriate for this device?”
We often use multiple...
A mobile device may be someone’s only
access to your site.
People with lower incomes deserve equal
access to the internet....
Surprise!
“He found his last three sports cars on
his phone. When he arrived at the
dealership, he was ready to buy.”
user journeys
1
1
2
1

Define your purpose and goals

3
1
v
4
1
5

Consider their behavioral context

Know your audience

...
Why are you in business?
Every journey has a
destination
Where a person is going says a lot about
their journey.
The person on the journey does not
decide what the destination is ...
Defining your purpose, values, style,
and vision is the foundation for
everything else.
You can’t understand your users’
j...
PURPOSE

VALUES

Why you’re in business.
It summarizes the difference
you’re trying to make in the
world and what drives y...
“We’re 80sTees.”
“And our mission is to delight and
amaze the kid in us all.”
user journeys
1
1
2
1

Define your purpose and goals

3
1
v
4
1
5

Consider their behavioral context

Know your audience

...
Take a look inside
Personas should be grounded in
research and elevated by empathy.
They’re filters to help you to see through
your users’ ey...
You are not your target audience.
Beware of biases.
Don’t assume you know what your users
want and why they choose to do
b...
Capture the richness of the human
experience.
Have conversations, follow a directed
storytelling method, be curious,
docum...
Check it twice.
Qualitative research is only as good as
the questions you ask and the skill level
of the interviewer.
Use ...
logical
methodical

competitive

slow

fast
humanistic

spontaneous

emotional
user journeys
1
1
2
1

Define your purpose and goals

3
1
v
4
1
5

Consider their behavioral context

Know your audience

...
Thinking. feeling. doing.
Don’t be a heartless bastard.

“The number one practical competency
for success in life and work is empathy.”
-  Peter Dru...
Personal-behavioral context

Cognitive

Learning ability,
education, cognitive
assumptions

learning

Environmental factor...
Remember this guy?
He’s got a behavioral
context too.
user journeys
1
1
2
1

Define your purpose and goals

3
1
v
4
1
5

Consider their behavioral context

Know your audience

...
User flows, ftw.
A deep dive into data can be delightful.
Google Analytics
ü Entry pages
ü Exit pages
ü Devices
ü User flow
ü Traffic ...
Think it through
together
Invite everyone to the party.
The more skill sets and perspectives
represented, the better.
ü Marketing
ü Sales
ü Custo...
A puppy story
EXAMPLE - Susan: the browsing buyer
Susan isn’t on a mission to buy a new
puppy, she’s just browsing the internet
and havi...
Susan: the browsing buyer
As a new user, Susan
comes to the site
through:

As a return user,
Susan comes to the
site throu...
Susan: the browsing buyer
.
Adaptive Path knows what’s up.
Susan: the browsing buyer
In charting out Susan’s journey we discover:
• 
• 
• 
• 

Potential points of friction
Gaps in i...
These insights inform our
considerations for small screens.
•  COPE (Create once, publish
everywhere)
•  Interdigitation (...
user journeys
1
1
2
1

Define your purpose and goals

3
1
v
4
1
5

Consider their behavioral context

Know your audience

...
Look for patterns
Good: Metrics are about measurement

Better: Metrics are
about learning
Remember.
There’s no such thing as “the most
important metrics” for everyone or a
plug-and-play measurement strategy.

#CS...
Ask questions
You see a high amount of page views per visit with
a relatively low avg. time on site, and you wonder:
Are t...
This story never ends
Remember.
The digital work we do is never final. This
is an iterative process.
Plan for constant improvement,
adjustment, ...
Don’t let your insight become an artifact.
Find ways to keep the understanding
you gained from charting user journeys
aliv...
Questions?
Let’s talk, preferably with cocktails.

#CSAUSA

@rebekahcancino
Context, Baby! Context! User Journeys for Responsive Design
Context, Baby! Context! User Journeys for Responsive Design
Context, Baby! Context! User Journeys for Responsive Design
Upcoming SlideShare
Loading in...5
×

Context, Baby! Context! User Journeys for Responsive Design

25,730

Published 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 canvas-out, and create content that's right for our organizations and our users regardless of the device.

Published in: Technology
7 Comments
80 Likes
Statistics
Notes
No Downloads
Views
Total Views
25,730
On Slideshare
0
From Embeds
0
Number of Embeds
14
Actions
Shares
0
Downloads
1
Comments
7
Likes
80
Embeds 0
No embeds

No notes for slide

Transcript of "Context, Baby! Context! User Journeys for Responsive Design"

  1. 1. Context, baby! Context! User journeys for Responsive design CS Applied USA 2013 @rebekahcancino
  2. 2. Surprise!
  3. 3. Context, baby! Context! User journeys for design
  4. 4. That’s me, in the back there! @rebekahcancino
  5. 5. It’s responsive! It’s adaptive?
  6. 6. You keep using that word. I don’t think it means what you think it means.
  7. 7. We have to think beyond breakpoints
  8. 8. We have to plan from the smallest canvas-out
  9. 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. 10. Why user journeys? User journeys are really people journeys.
  11. 11. CONTEXT.
  12. 12. CONTEXT is not tied to devices
  13. 13. CONTEXT is tied To people
  14. 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. 15. Sup, JSpool!
  16. 16. "Search is only for the site’s content. The refund policy is not content." -  A Client
  17. 17. Everything is content. “Content is what the user needs or wants right now.” - Jared Spool
  18. 18. Good for grain, bad for user experiences
  19. 19. Brands are not experienced in one channel or touchpoint. A lack of interconnectedness is a major competitive risk. #CSAUSA @rebekahcancino
  20. 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. 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. 22. Your context is not my context
  23. 23. What about the “mobile context?” “I love fiction. UFOs, unicorns, faith healing, the Mobile Web, the Mobile Context, psychics.” - Stephen Hay
  24. 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. 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. 26. Surprise!
  27. 27. “He found his last three sports cars on his phone. When he arrived at the dealership, he was ready to buy.”
  28. 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. 29. Why are you in business?
  30. 30. Every journey has a destination
  31. 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. 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. 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. 34. “We’re 80sTees.” “And our mission is to delight and amaze the kid in us all.”
  35. 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. 36. Take a look inside
  37. 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. 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. 39. Capture the richness of the human experience. Have conversations, follow a directed storytelling method, be curious, document everything. #CSAUSA @rebekahcancino
  40. 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. 41. logical methodical competitive slow fast humanistic spontaneous emotional
  42. 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. 43. Thinking. feeling. doing.
  44. 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. 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. 46. Remember this guy?
  47. 47. He’s got a behavioral context too.
  48. 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. 49. User flows, ftw.
  50. 50. A deep dive into data can be delightful. Google Analytics ü Entry pages ü Exit pages ü Devices ü User flow ü Traffic sources #CSAUSA @rebekahcancino
  51. 51. Think it through together
  52. 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. 53. A puppy story
  54. 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. 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. 56. Susan: the browsing buyer .
  57. 57. Adaptive Path knows what’s up.
  58. 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. 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. 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. 61. Look for patterns
  62. 62. Good: Metrics are about measurement Better: Metrics are about learning
  63. 63. Remember. There’s no such thing as “the most important metrics” for everyone or a plug-and-play measurement strategy. #CSAUSA @rebekahcancino
  64. 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. 65. This story never ends
  66. 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. 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. 68. Questions? Let’s talk, preferably with cocktails. #CSAUSA @rebekahcancino

×