The document provides an introduction to user-centered design (UCD). It discusses the key phases of the UCD process: research, ideation, prototyping, evaluation, and launch. Research involves understanding user needs and goals. Ideation focuses on generating ideas to solve user problems. Prototyping creates tangible designs to test. Evaluation assesses prototype usability and performance. Launch involves building the final product and measuring real-world usage through analytics and testing. The overall process emphasizes iterative design where learnings are used to continuously refine solutions based on user feedback.
3. User-centered design?
“Merely being the victim of a
particular problem does not
automatically bestow on one
the power to see its solution.
Alan Cooper
“The Inmates Are Running the Asylum” p123
User-centered design | @rebeccadestello
4. User-centered design?
Much less funny when you think about
how much this can cost.
User-centered design | @rebeccadestello
5. User-centered design !
?
Business
idea
Try
it out
Launch!
Research
problem
Ideate
Evaluate
goal
Prototype
Iterate
User-centered design | @rebeccadestello
6. II. Ideate
Generate ideas
User-centered design
V. Launch
Build, Measure, Learn
I. Research
Discover goals & needs
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
IV. Evaluate
Determine ease
of use
User-centered design | @rebeccadestello
7. Why have a process for
design?
User-centered design | @rebeccadestello
8. A designer’s expertise lies not in the thing he or she is designing.
You do not have to be a widget expert to be a designer of a widget-manufacturing
interface. Instead, you must
be an expert in the process of design.
9. Why follow a design process?
• It helps us know where to begin
• It helps us keep the user first
• It prevents us from omitting important steps
• It's more reliable than intuition
• It reminds us to iterate
User-centered design | @rebeccadestello
10. Good design requires iteration High fidelity
Wireframe
Ideate
Sketch
Paper Prototype
User-centered design | @rebeccadestello
11. Phase I: Research
Discover the user’s goals and needs
User-centered design | @rebeccadestello
12. II. Ideate
Generate ideas
I. Research
V. Launch
Build, Measure, Learn
I. Research
Discover goals & needs
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
IV. Evaluate
Determine ease
of use
User-centered design | @rebeccadestello
13. Why start with research?
You cannot design apart from the world in which
your users live.
User-centered design | @rebeccadestello
14. How do we learn what we want to know?
First, identify users and their needs
• Who is the target audience?
• Who are the stakeholders?
• What are the user and business requirements?
User-centered design | @rebeccadestello
15. How do we learn what we want to know?
Then develop a research question
• How do users do it now?
• What do users want?
• What do users need?
• What else have they tried?
• Is there already another solution?
User-centered design | @rebeccadestello
16. Qualitative
(insights)
landscape of
Contextual inquiry Field studies
research
methodologies
Quantitative
(validation)
Goals & Attitudes
(what people say)
Behaviors
(what people do)
Diary studies
User interviews
Participatory design
Card sorting
Usability testing
Site traffic
A/B testing
User surveys
User-centered design | @rebeccadestello
17. for best results,
use triangulation
to learn about
your user
Qualitative
research
A/B test results Survey data
APPARENT
TRUTH
User-centered design | @rebeccadestello
18. Qualitative
(insights)
Field studies
Quantitative
(validation)
Goals & Attitudes
(what people say)
Behaviors
(what people do)
Diary studies
User interviews
Participatory design
Card sorting
Usability testing
Site traffic
A/B testing
User surveys
Contextual inquiry
For example: Your
business goal is to…
Attract prospective
students who look at
the UW website to
register for the
master’s program.
Where would
you begin?
1
2
3
4
5
Focus groups
User-centered design | @rebeccadestello
19. Phase II: Ideate
Generate lots, and lots, and lots of ideas
User-centered design | @rebeccadestello
20. II. Ideate
Generate ideas
V. Launch
Build, Measure, Learn
I. Research
Discover goals & needs
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
IV. Evaluate
Determine ease
of use
II. Ideate
User-centered design | @rebeccadestello
21. Ideate to increase the chances for success by considering a huge
volume of ideas in a systematic way. One of the worst things you can
do is go with the first idea that you get. Remember:
You can always come back to it later.
User-centered design | @rebeccadestello
2013 | Rebecca Destello
22. a few
ideation methods…
User-centered design | @rebeccadestello
23. Design mapping
Cardboard mockups
Sketching
Story telling w/props
Affinity diagramming
Intro to the UCD Process | R. Destello, T. Zeiler | UX Research, Nordstrom User-centered design | @rebeccadestello Direct, 2014
24. Phase III: Prototype
Create something tangible to test
User-centered design | @rebeccadestello
25. II. Ideate
Generate ideas
III. Prototype
V. Launch
Build, Measure, Learn
I. Research
Discover goals & needs
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
IV. Evaluate
Determine ease
of use
User-centered design | @rebeccadestello
26. first...
a note about
sketch vs. prototype
User-centered design | @rebeccadestello
28. Why prototype?
• You can test ideas
• It brings the user into the design process
early on
• Prototyping brings subtleties and nuances
into the light
• Begin to wrestle with the technical
constraints
User-centered design | @rebeccadestello
29. Prototyping techniques
• Body storming
• Cardboard / foam core mockups
• Paper prototypes
• Wizard of Oz
• Screenshots
• Video mock-ups
• Digital prototypes
Lo-fidelity
Hi-fidelity
User-centered design | @rebeccadestello
30. fun / cheap
prototyping technique:
paper prototype
User-centered design | @rebeccadestello
31. fun / unusual
prototyping technique:
body storming
User-centered design | @rebeccadestello
32. fun / unusual
prototyping technique:
wizard of oz
http://youtu.be/DL9cAcQ-gKQ
User-centered design | @rebeccadestello
33. Phase IV: Evaluate
Determine ease of use
User-centered design | @rebeccadestello
34. I. Research
Discover goals & needs
II. Ideate
Generate ideas
V. Launch
Build, Measure, Learn
Design → Evaluate → Iterate
III.
PrototypeProduce
something tangible
IV. Evaluate
Determine ease
of use
Prototype
Produce something
tangible
IV. Evaluate
User-centered design | @rebeccadestello
35. Why evaluate?
Evaluation helps answer..
• If a product is learnable, efficient, memorable,
error tolerant, and satisfying
• If there is a problem, “why” it might exist
• If we built it right
It also helps drive iterations :-)
User-centered design | @rebeccadestello
37. Heuristic evaluation
Expert review of an interface against a set of guidelines or
principles. For example, Jakob Nielsen’s 10 Heuristics:
User-centered design | @rebeccadestello
38. Cognitive walkthrough (streamlined)
For each action a user has to take to complete a task, the
reviewer needs to describe the user's immediate goal and
answer 2 questions:
1. Will the user know what to do at this step?
2. If the user does the right thing, will they know that they
did the right thing, and are making progress towards
their goal?
User-centered design | @rebeccadestello
39. Usability testing
Usability assesses how easy user interfaces are to use.
Usability is defined by 5 quality components:
• Learnability
• Efficiency
• Memorability
• Errors
• Satisfaction
User-centered design | @rebeccadestello
41. II. Ideate
Generate ideas
V. Launch
V. Launch
Build, Measure, Learn
I. Research
Discover goals & needs
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
IV. Evaluate
Determine ease
of use
User-centered design | @rebeccadestello
42. Why measure at launch?
• Product is fully developed and in actual
environment
• Assess in a quantitative way which design
performs better
• Helps answer “Did we get it right?”
User-centered design | @rebeccadestello
43. Some measurement methods
• Site analytics
• Surveys
• A/B or multivariate testing
• Benchmark testing
User-centered design | @rebeccadestello
46. If problems are in . . .
I. Research
Discover goals & needs
II. Ideate
Generate ideas
User’s
performance
User’s
understanding
Usefulness /
Appropriateness
V. Launch
Build, Measure, Learn
IV. Evaluate
Determine ease
of use
Design → Evaluate → Iterate
III. Prototype
Produce something
tangible
Evaluation drives iteration
User-centered design | @rebeccadestello
47. In summary
Research, ideate, prototype, evaluate, launch
User-centered design | @rebeccadestello
Intro to the UCD Process | R. Destello | UX Research, Nordstrom, 2014
48. Summary of the UCD process
• Research to understand the user’s problem space,
goals, and needs
• Ideate to generate ideas for solving the user’s needs,
and problem space
• Prototype to create something tangible to test
• Evaluate the prototype to assess performance
• Iterate! Iterate! Iterate!
• Launch, build, measure, learn…. repeat
User-centered design | @rebeccadestello