Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
thinkLA // 24 March 2015
USER EXPERIENCE DESIGN:
A PRIMER FOR MARKETERS
JASON BRUSH
IN THE PAST…
≠ADVERTISING

CREATIVE
PRODUCT

DESIGN
advertise (v.)
from Latin advertere : “turn toward”
design (v.)
from Latin designare : “mark out, devise,
choose, designate, appoint”
Meeting
People’s
Needs
Long-term
Impact
Shaping
Culture &
Opinion
Short Term
Impact
DESIGN’S RELATIONSHIP TO CLIENT INTERE...
UBER is worth $40B Doesn’t Own Vehicles
Facebook is worth $236B Doesn’t Make Content
airbnb is worth $10B Doesn’t Own Real...
Over the last 10 years design-led companies
have maintained significant stock market
advantage, outperforming the S&P by a...
CREATIVE AGENCIES’ DIFFERING AREAS OF PRACTICE
Communication
Product Design
PhysicalDigital
BRANDING
TV, OOH, PRINT
ADVERT...
DIGITAL IS CHANGING THE CREATIVE AGENCY’S PURVIEW
Communication
Product Design
PhysicalDigital
BRANDING
TV, OOH, PRINT
ADV...
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
USER
EXPERIENCE
DESIGN
Human
Computer
Interaction
Interaction Design
Human
Factors
Visual
Design
Information
Architecture
...
USER
EXPERIENCE
DESIGN
Human
Computer
Interaction
INTERACTION DESIGN
Human
Factors
Visual
Design
Information
Architecture
...
Interaction Design (IxD) defines the
structure and behavior of interactive
systems. Interaction Designers strive to
create...
Interaction design is about shaping digital
things for people’s use.
— Jonas Löwgren
Behavior is our medium.
— Robert Fabricant
EMPATHIZE EXPLORE EXECUTE
(POOR)

PROBLEM
ARTICULATION
We need a new website.
We need to improve our product detail page.
We need a mobile app.
We n...
HOW MIGHT WE…?
EMPATHIZE EXPLORE EXECUTE
EMPATHIZE EXPLORE EXECUTE
We need a [solution(s)]

for [person/people] 

to [achieve a particular goal].
ARTICULATE
PROBLE...
- Competitive research
- Market research
- User research
- Engineering capabilities &
constraints
- Strategic insights
- T...
UNDERSTAND & SYNTHESIZE
WHEN PLANNING RESEARCH, DEFINE:
OBJECTIVES
What do you want to learn?
ASSUMPTIONS
What do you believe to be true?
METHODS
...
WHEN PLANNING RESEARCH, ASK:
Who are your users?
What makes them unique?
If you’re targeting multiple groups of users, wha...
POOR QUESTION
How do people buy video games?
BETTER QUESTION
How do moms buy video games for their kids in a store?
WHEN PLANNING RESEARCH, DON’T MAKE IT MORE
COMPLICATED THAN IT NEEDS TO BE:
What research do you currently have? What data...
WHEN PLANNING RESEARCH, TAILOR YOUR PLAN TO
YOUR RESOURCES
How much time do you have? What is the minimum
amount of resear...
EXAMPLE RESEARCH TACTICS
SURVEYS
CONTEXTUAL INQUIRY (E.G., IN-HOME INTERVIEWS)
JOURNEY MAPPING / TASK ANALYSIS
USER DIARIE...
If you want to find out what people really
need, you have to forget about your
problems and worry about their lives.
— Dal...
INQUIRY
Ask people what
they do.
PARTICIPATION
Try what people
experience.
OBSERVATION
Look at what
people do.
METHODS FOR...
The only way to experience an experience is
to experience it.
— Bill Moggridge
BAD RECRUITING = BAD INFORMATION
Define the precise criteria for the people to
whom you want to speak — and to whom
you do...
WHEN TALKING TO PEOPLE, ASK:
Who…?
What…?
Where…?
When…?
Why…?
How…?
TALKING TO PEOPLE DOESN’T HAVE 

TO BE COMPLEX OR EXPENSIVE
Use internal resources not on the project.
Use Facebook, Twitt...
People
Context
Tasks
Technologies
WHAT TO OBSERVE
AFFORDANCES OBSTACLES
BOOKS TO READ
Designing for the
Digital Age
by Kim Goodwin
The User is Always
Right
by Steve Mulder
About Face: The
Essent...
IDEATE
DIVERGENCE / CONVERGENCE
Objective SolutionCreate Choices Make Choices
DIAGRAM AFTER TIM BROWN
@TCEB62
A building must be considered “with due reference to
function, structure, and beauty”
— Vitruvius, 80 – 15 BCE
TECHNICAL 

FEASIBILITY
FINANCIAL

VIABILITY
DESIRABILITY
Solution
DIAGRAM PER IDEO
@IDEO
WHAT IS THE STORY OF PEOPLE’S
INTERACTION WITH YOUR EXPERIENCE?
USE PIXAR’S FORMULA TO DESCRIBE 

YOUR EXPERIENCE
1. Once upon a time there was …
2. Every day …
3. One day …
4. Because o...
USE PIXAR’S FORMULA TO DESCRIBE 

YOUR EXPERIENCE
1. Once upon a time there was …
2. Every day …
3. One day …
4. Because o...
START BY WRITING SCENARIOS
[A person] needs to [accomplish a task]

so that she or he can [achieve some benefit].
CORE UX DESIGN ACTIVITIES
INFORMATION ARCHITECTURE
Describing the organization of systems so that people can
easily naviga...
Mental models are what people really have
in their heads and what guides their use of
things.
— Don Norman
A A
A
A
Designer UsersSystem
Ready-to-hand Present-to-handVS
PROTOTYPE
A model of a system used to demonstrate
and evaluate its behavior.
PROOF OF CONCEPT
A demonstration that a parti...
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
What does the user
need ...
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
How does your
interactio...
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
How do you know the
syst...
Designing in the absence of content is not
design. It’s decoration.
— Jeffery Zeldman
Time
Pixel-Perfect
Visual Design
Handdrawn
Sketch
TIME COST OF
MAKING DESIGNS
Low-fidelity
Storyboards
High-fidelity
Wiref...
Context
Fidelity
FULL EXPERIENCELIMITED USE CASES
PAPER PROTOTYPE
WIZARD OF OZ
CLICK-THROUGH
MOTION STUDY
CODE
Number of Variations
Needed to Evaluate Design
MICROINTERACTIONS
SYSTEM DESIGN
Fidelity
Needed
to
Evaluate
Design
“details...
Always
Be
Capturing
BOOKS TO READ
Designing 

For Interaction
The Design of
Everyday Things
by Don Norman
Sketching User
Experiences
by Bill B...
IMPLIMENT
If you cannot measure it you cannot
improve it.
— Lord Kelvin
A VS B
100,000 users get
option A
100,000 users get
option B
A B
A
A CVS
B
A
A C
B
A
A C
B
A B C
TESTING DIFFERENT MICROINTERACTIONS…
BUSINESS
TRAVELERS
LEISURE
TRAVELERS
CALIFORNIANS
DIFFERENT DESIGNS CAN PROVE TO BE MORE
EFFECTIVE FOR DIFFERENT AUDIENCES
IN CONCLUSION…
Less, but better.
— Dieter Rams
THANKS
User Experience Design: A Primer for Marketers
User Experience Design: A Primer for Marketers
User Experience Design: A Primer for Marketers
Upcoming SlideShare
Loading in …5
×

User Experience Design: A Primer for Marketers

26,580 views

Published on

A high-level overview of the creative process of user experience design.

Published in: Design

User Experience Design: A Primer for Marketers

  1. thinkLA // 24 March 2015 USER EXPERIENCE DESIGN: A PRIMER FOR MARKETERS JASON BRUSH
  2. IN THE PAST…
  3. ≠ADVERTISING
 CREATIVE PRODUCT
 DESIGN
  4. advertise (v.) from Latin advertere : “turn toward”
  5. design (v.) from Latin designare : “mark out, devise, choose, designate, appoint”
  6. Meeting People’s Needs Long-term Impact Shaping Culture & Opinion Short Term Impact DESIGN’S RELATIONSHIP TO CLIENT INTERESTS USER-CENTERED DESIGN CAMPAIGN CREATIVE BRAND DEVELOPMENT VISUALIZATION
  7. UBER is worth $40B Doesn’t Own Vehicles Facebook is worth $236B Doesn’t Make Content airbnb is worth $10B Doesn’t Own Real Estate WHAT IS THE VALUE OF GREAT USER EXPERIENCE?
  8. Over the last 10 years design-led companies have maintained significant stock market advantage, outperforming the S&P by an extraordinary 228%. — DMI Design Value Index
  9. CREATIVE AGENCIES’ DIFFERING AREAS OF PRACTICE Communication Product Design PhysicalDigital BRANDING TV, OOH, PRINT ADVERTISING PACKAGING DIGITAL CONTENT WEBSITES CRM ECOMMERCE USER INTERFACE STORE EXPERIENCES INDUSTRIAL DESIGN
  10. DIGITAL IS CHANGING THE CREATIVE AGENCY’S PURVIEW Communication Product Design PhysicalDigital BRANDING TV, OOH, PRINT ADVERTISING PACKAGING DIGITAL CONTENT WEBSITES CRM ECOMMERCE USER INTERFACE STORE EXPERIENCES INDUSTRIAL DESIGN
  11. COMMUNICATION PRODUCT DESIGN PHYSICALDIGITAL
  12. COMMUNICATION PRODUCT DESIGN PHYSICALDIGITAL
  13. COMMUNICATION PRODUCT DESIGN PHYSICALDIGITAL
  14. COMMUNICATION PRODUCT DESIGN PHYSICALDIGITAL
  15. USER EXPERIENCE DESIGN Human Computer Interaction Interaction Design Human Factors Visual Design Information Architecture Architecture Content Industrial Design Sound Design DAN SAFFER @ODANNYBOY
  16. USER EXPERIENCE DESIGN Human Computer Interaction INTERACTION DESIGN Human Factors Visual Design Information Architecture Architecture Content Industrial Design Sound Design DAN SAFFER @ODANNYBOY
  17. Interaction Design (IxD) defines the structure and behavior of interactive systems. Interaction Designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond. — Interaction Design Association
  18. Interaction design is about shaping digital things for people’s use. — Jonas Löwgren
  19. Behavior is our medium. — Robert Fabricant
  20. EMPATHIZE EXPLORE EXECUTE
  21. (POOR)
 PROBLEM ARTICULATION We need a new website. We need to improve our product detail page. We need a mobile app. We need a new social campaign. EMPATHIZE EXPLORE EXECUTE
  22. HOW MIGHT WE…? EMPATHIZE EXPLORE EXECUTE
  23. EMPATHIZE EXPLORE EXECUTE We need a [solution(s)]
 for [person/people] 
 to [achieve a particular goal]. ARTICULATE PROBLEM HOW MIGHT WE…?
  24. - Competitive research - Market research - User research - Engineering capabilities & constraints - Strategic insights - Target users - User needs - KPIs - Platform(s) - Creative Brief UNDERSTAND SYNTHESIZE IMPLEMENT IDEATE - Low Fidelity visualizations - Technology proofs-of-concept - User testing - Engineering feasibility analysis PROTOTYPEEVALUATE - Interaction - Visual design VISUALIZE - Collaborate with engineering to execute - Validate & optimize at scale
  25. UNDERSTAND & SYNTHESIZE
  26. WHEN PLANNING RESEARCH, DEFINE: OBJECTIVES What do you want to learn? ASSUMPTIONS What do you believe to be true? METHODS How are you going to gain insight?
  27. WHEN PLANNING RESEARCH, ASK: Who are your users? What makes them unique? If you’re targeting multiple groups of users, what are your priorities? Why? What will success look like for different users?
  28. POOR QUESTION How do people buy video games?
  29. BETTER QUESTION How do moms buy video games for their kids in a store?
  30. WHEN PLANNING RESEARCH, DON’T MAKE IT MORE COMPLICATED THAN IT NEEDS TO BE: What research do you currently have? What data do you currently collect? What data out in the world already? What third-party reports exist?
  31. WHEN PLANNING RESEARCH, TAILOR YOUR PLAN TO YOUR RESOURCES How much time do you have? What is the minimum amount of research you can do and still gain some insight?
  32. EXAMPLE RESEARCH TACTICS SURVEYS CONTEXTUAL INQUIRY (E.G., IN-HOME INTERVIEWS) JOURNEY MAPPING / TASK ANALYSIS USER DIARIES FOLLOW-AROUNDS / SHOP-ALONGS CARD SORTING CONCEPT RANKING GENERATIVE EVALUATIVE
  33. If you want to find out what people really need, you have to forget about your problems and worry about their lives. — Dale Carnegie
  34. INQUIRY Ask people what they do. PARTICIPATION Try what people experience. OBSERVATION Look at what people do. METHODS FOR EMPATHY
  35. The only way to experience an experience is to experience it. — Bill Moggridge
  36. BAD RECRUITING = BAD INFORMATION Define the precise criteria for the people to whom you want to speak — and to whom you don’t want to speak.
  37. WHEN TALKING TO PEOPLE, ASK: Who…? What…? Where…? When…? Why…? How…?
  38. TALKING TO PEOPLE DOESN’T HAVE 
 TO BE COMPLEX OR EXPENSIVE Use internal resources not on the project. Use Facebook, Twitter, etc. to recruit Web surveys Do Interviews over Skype, Hangouts, etc. Use Lync, Adobe Connect, etc. to get users input on existing products. …and more. Be inventive!
  39. People Context Tasks Technologies WHAT TO OBSERVE AFFORDANCES OBSTACLES
  40. BOOKS TO READ Designing for the Digital Age by Kim Goodwin The User is Always Right by Steve Mulder About Face: The Essentials of Interaction Design by Alan Cooper
  41. IDEATE
  42. DIVERGENCE / CONVERGENCE Objective SolutionCreate Choices Make Choices DIAGRAM AFTER TIM BROWN @TCEB62
  43. A building must be considered “with due reference to function, structure, and beauty” — Vitruvius, 80 – 15 BCE
  44. TECHNICAL 
 FEASIBILITY FINANCIAL
 VIABILITY DESIRABILITY Solution DIAGRAM PER IDEO @IDEO
  45. WHAT IS THE STORY OF PEOPLE’S INTERACTION WITH YOUR EXPERIENCE?
  46. USE PIXAR’S FORMULA TO DESCRIBE 
 YOUR EXPERIENCE 1. Once upon a time there was … 2. Every day … 3. One day … 4. Because of that … 5. Because of that … 6. Until finally …
  47. USE PIXAR’S FORMULA TO DESCRIBE 
 YOUR EXPERIENCE 1. Once upon a time there was … 2. Every day … 3. One day … 4. Because of that … 5. Because of that … 6. Until finally … BEFORE YOUR EXPERIENCE AFTER YOUR EXPERIENCE
  48. START BY WRITING SCENARIOS [A person] needs to [accomplish a task]
 so that she or he can [achieve some benefit].
  49. CORE UX DESIGN ACTIVITIES INFORMATION ARCHITECTURE Describing the organization of systems so that people can easily navigate them. MENTAL MODELS Describing what people understand about how a system works. INTERACTION MODELS Describing the specific behavior of interactions.
  50. Mental models are what people really have in their heads and what guides their use of things. — Don Norman
  51. A A A A Designer UsersSystem
  52. Ready-to-hand Present-to-handVS
  53. PROTOTYPE A model of a system used to demonstrate and evaluate its behavior. PROOF OF CONCEPT A demonstration that a particular technology can produce a desired effect.
  54. DESIGNING INTERACTIONS (PER BILL VERPLANK) “HOW DO YOU DO?” “HOW DO YOU FEEL?” “HOW DO YOU KNOW?” What does the user need for interaction?
  55. DESIGNING INTERACTIONS (PER BILL VERPLANK) “HOW DO YOU DO?” “HOW DO YOU FEEL?” “HOW DO YOU KNOW?” How does your interaction with the system make you feel?
  56. DESIGNING INTERACTIONS (PER BILL VERPLANK) “HOW DO YOU DO?” “HOW DO YOU FEEL?” “HOW DO YOU KNOW?” How do you know the system has done what you want it to do?
  57. Designing in the absence of content is not design. It’s decoration. — Jeffery Zeldman
  58. Time Pixel-Perfect Visual Design Handdrawn Sketch TIME COST OF MAKING DESIGNS Low-fidelity Storyboards High-fidelity Wireframes TIME COST OF EXPLAINING DESIGNS FINDING THE RIGHT BALANCE OF FIDELITY FOR YOUR PROJECT DIAGRAM AFTER DAVID SHERWIN @CHANGEORDER
  59. Context Fidelity FULL EXPERIENCELIMITED USE CASES PAPER PROTOTYPE WIZARD OF OZ CLICK-THROUGH MOTION STUDY CODE
  60. Number of Variations Needed to Evaluate Design MICROINTERACTIONS SYSTEM DESIGN Fidelity Needed to Evaluate Design “details that make the experience delightful, humane, and effective” 
 — Dan Saffer
  61. Always Be Capturing
  62. BOOKS TO READ Designing 
 For Interaction The Design of Everyday Things by Don Norman Sketching User Experiences by Bill Buxton Microinteractions by Dan Saffer
  63. IMPLIMENT
  64. If you cannot measure it you cannot improve it. — Lord Kelvin
  65. A VS B 100,000 users get option A 100,000 users get option B
  66. A B
  67. A A CVS B
  68. A A C B
  69. A A C B
  70. A B C TESTING DIFFERENT MICROINTERACTIONS…
  71. BUSINESS TRAVELERS LEISURE TRAVELERS CALIFORNIANS DIFFERENT DESIGNS CAN PROVE TO BE MORE EFFECTIVE FOR DIFFERENT AUDIENCES
  72. IN CONCLUSION…
  73. Less, but better. — Dieter Rams
  74. THANKS

×