A very basic and practical talk about supersimple methods that can dramatically increase the speed of your design practice. Applicable to both your personal design practice and for team practices. And based on the work of many amazing practitioners in the field. 45-min talk.
Rapid Design & Experimentation for User-Centered Products :: UX Days Tokyo [April 2015}
1. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Rapid Design &
Experimentation for
User-Centered Products
April 2015 | Kate Rutter | @katerutter
2. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Hello!
@katerutter
tweet-friendly
3. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
4. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
3 big trends
✓Cycle time is getting faster
✓UX design moving from
implementation to envisioning
new value
✓UX design is a team sport
5. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Trend 1
✓Cycle time is getting faster
6. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
risk
timeDefine
The old way
Design
Develop
Release
via @seriouslynow
7. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
risk
timeDefine
a better old way
Design
Develop
Release
via @seriouslynow
8. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
risk
time
A different way
via @seriouslynow
9. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
BUILD
MEASURE
LEARN
More cycles in less time
reduces risk.
faster!
10. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Trend 2
✓UX design moving from
implementation to envisioning
new value
11. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
12. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Features
Users
Uses
Product
Needs
via @luxrco
sketches,
prototypes,
wireframes
pixels
UI
Company
Purpose
Your vision & ideas
UX is a stack
13. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Trend 3
✓UX design is a team sport.
what we
say blah
blah blah
blah blah blah
blah blah
what they hear
14. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
UX designers invent a lot...
wireframes
design studio
sketchboards
sprints
task flows
UI sketches
prototypes
task models
personas
affinity diagrams
content strategy
content strategy journey maps
storyboardscluster diagrams
conceptual models
Content models
Empathy maps
Experience maps
Mental models
Process diagrams
Scenario maps
Scenarios
Sitemaps
Style guides
System maps
Task grids
Usability reports
User journeys
User story maps
user stories
metadata schema
design stories
* and much, much more...
15. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
UX designers invent a lot...
wireframes
design studio
sketchboards
sprints
task flows
UI sketches
prototypes
task models
personas
affinity diagrams
content strategy
content strategy journey maps
storyboardscluster diagrams
conceptual models
Content models
Empathy maps
Experience maps
Mental models
Process diagrams
Scenario maps
Scenarios
Sitemaps
Style guides
System maps
Task grids
Usability reports
User journeys
User story maps
user stories
metadata schema
design stories
* and much, much more...
16. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
What this means
✓Design & ship smaller & faster
✓Explore new ideas faster
✓Collaborate across many
roles & disciplines faster
17. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How can we work...
✓faster
✓simpler
✓together
18. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Ways to
Design Faster512
19. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
9
simple
methods
Sketch people
Flows
Dump 2x2 sort
Dot-vote
Timebox
Quiet read
Work at the wall
Sketch UI
20. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
5
simple
tools
21. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
22. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
Simple materials
23. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
✓ You can draw a picture of a person in
4 simple steps...
Star people
1 2 3 4
24. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
✓ Use simple shapes show context.
25. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
✓ With only 2 parts of the face, you can
get a range of emotions.
Expressions Matrix
9 circles
add eyes
3 mouths
2 kinds of
eyebrows
9 emotions!
26. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
✓ A talk bubble makes the picture clear.
27. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs funvia @glaves
28. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs funVia Alexa Andrzejewski
Foodspotting
29. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs fun
30. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
✓Stay focused on
the human
experience
✓Generate many
ideas quickly
✓Itʼs funhttp://bit.ly/sketchingpeople
Video examples here:
31. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
How...
By sketching a quick
picture and describing
it with just a short
phrase, you can come
up with many human-
centered ideas quickly.
Why...
Use when...
✓ Get a sharpie and white
paper.
✓ Use the 4-step Star
Person technique to
quickly sketch a person.
✓ Use the Expressions
Matrix to show the
emotion they are having.
✓ Use basic shapes (to put
the person in a context or
environment.
✓ Add a text or thought
bubble to show their
words or thinking.
✓ Add a 1-line sentence
describing the scenario.
Sketching is fast. It
activates many parts of
the brain: pictures, words,
hand-eye coordination.
You get more and better
ideas from you and your
team.
You need to show the
human experience of
your product.
With some simple tips,
anyone can sketch a
picture of a person in an
experience.
32. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
33. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
Via Adaptive Path
34. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
Via Adaptive Path
35. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
Via Adaptive Path
36. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
37. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
✓Rapidly work out
an idea
✓Generate many
ideas quickly
✓Validate ideas
with others
38. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...Sketch UI
By sketching multiple
UI ideas fast, you force
ideas out of your head
so that you can get
feedback on them
quickly.
Sketching is fast. You can
explore many more ideas
quickly.
Keeping it low-fidelity puts
the focus on the idea, not
on the “polished” details.
Exploring ideas for
interface and interactions.
Annotations provide
clarity and reduce the
time spent explaining the
ideas.
✓ Get a sharpie and white
paper and draw an outline of
a screen (web or mobile.)
✓ Add items that could be on
the interface: Text, buttons,
image boxes, navigation.
✓ Make notes in the margins
to describe the item or how
it functions.
✓ Use heavier lines for more
focus (contrast draws the
eye).
✓ Add yellow highlights to
identify the most important
parts.
39. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
40. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
Storyboards
Via Brandon Schauer
41. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
Via Adaptive Path
Storyboards
42. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
Via https://wordsofasuperheroine.wordpress.com/tag/airbnb/
Storyboards
43. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
UI flows
Via Adaptive Path
44. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
UI flows
Via Adaptive Path
45. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
UI flows
Via @glaves
46. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
✓Quickly connect
ideas into a story
✓Prototype
interactions
✓Identify & fill gaps
Showing action
Via @glaves
47. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...Why...
Use when...
✓ Arrange items (people
sketches, UI sketches,
stickynotes) in a sequence.
✓ Connect the parts with
arrows if needed.
✓ Rearrange the order of
items to identify new and
different stories.
✓ Identify and fill any gaps in
the sequence.
✓ Document the flow with a
photo or revised digital
image.
Flows
Putting multiple
pictures together can
tell a very detailed story
very quickly.
Seeing how things
connect helps you
optimize a sequence of
events, shows
dependencies, and
prevents isolated ideas.
Communicating a series
of things that happen in
order or over time.
Helps identify logic gaps,
and shows how multiple
ideas form a coherent
narrative.
48. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Externalize thinking
✓Quickly generate
many different
ideas
✓Push past the
basics
Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
49. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Externalize thinking
✓Quickly generate
many different
ideas
✓Push past the
basics
Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
~ Linus Pauling
Nobel Prize-winning Biochemist
If you want to have
good ideas you must
have many ideas.
50. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Externalize thinking
✓Quickly generate
many different
ideas
✓Push past the
basics
Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
Storyboards
51. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Externalize thinking
✓Quickly generate
many different
ideas
✓Push past the
basics
Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
Storyboards
52. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Externalize thinking
✓Quickly generate
many different
ideas
✓Push past the
basics
Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
Via Adaptive Path
53. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...Dump
This is an all-purpose
way to get information
out of your head, so
that you can organize it
and make decisions.
✓ “Dump” the items by writing
one item per stickynote, or
making one sketch per idea.
✓ If youʼre doing this as a
team, each person makes
their own set of ideas.
✓ Keep generating ideas until
you have at least 10. Force
yourself to get to 10+ ideas.
✓ Donʼt overthink it; if you have
an idea, write it down. Donʼt
judge it (that comes later.)
✓ Use Sharpies so that the
ideas are easy to see at an
arms length, and stay
concise & simple.
Gets all the ideas out of
your head very quickly.
Kills the censor! Opens
up the generative part
of your brain.
Coming up with ideas,
exploring many options,
or when the ideas in
your head are messy
and freaking you out.
Works great in a team.
54. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
55. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Simple materials
56. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
StoryboardsSet up your 2x2
✓ Decide on 2 sets of parameters
Common pairs:
Important Less important
Urgent!! ! ! ! Less urgent
Easy!! ! ! ! ! Hard
High value!! ! ! Low value
Self! ! ! ! ! ! ! Delegate
57. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards✓ Make a big + on the wall with tape
58. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards✓ Label the end points. Put the optimal
ones on the top and right.
Easy
Hard
UrgentLess
Urgent
59. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards✓ Place your items (stickies, sketches)
Easy
Hard
UrgentLess
Urgent
60. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards✓ Step back and review
Easy
Hard
UrgentLess
Urgent
Do these first
Donʼt do
these at all!
Prioritize or
reconsider
Prioritize or
reconsider
61. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards✓ Bonus: stack-rank!
Easy
Urgent
62. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
Storyboards
63. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Set simple criteria
for decision-making
✓Organize lots of
ideas quickly
✓Easily find top
picks
2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
64. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...2x2 sort
A quick technique for
sorting many items
based on simple
criteria.
✓ Make a + on the wall or table
with tape (blue tape works
great.)
✓ Decide on 2 sets of parameters
and label the axes: each end
point should be two related
opposites. Put the most
optimal quadrant on the upper-
right.
✓ Plot all the ideas (sketches,
stickies), placing them in the
appropriate quadrant. Stack
duplicates.
✓ Force decisions: at least 1/2
the ideas should be below the
horizontal axis.
✓ Focus on the optimal quadrant,
and order the ideas (stack-
rank.)
Each quadrant allows
you to make batch
decisions about which
items to pursue.
Focuses the discussion
on the important ideas.
There are lots of ideas
to prioritize and decide
on.
Use as a team when
there is agreement on
the important
parameters.
65. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Everyone gets a
voice
✓Clearly shows items
with most support
✓Make decisions very
quickly
Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
66. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Everyone gets a
voice
✓Clearly shows items
with most support
✓Make decisions very
quickly
Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
Simple materials
+ a bunch of ideas
67. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Everyone gets a
voice
✓Clearly shows items
with most support
✓Make decisions very
quickly
Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
StoryboardsHow it works
68. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Everyone gets a
voice
✓Clearly shows items
with most support
✓Make decisions very
quickly
Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
Storyboards
69. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓Everyone gets a
voice
✓Clearly shows items
with most support
✓Make decisions very
quickly
Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
Via http://www.gamestorming.com/core-games/dot-voting/
70. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...Dot-vote
A technique that allows
you to pick top options
and quickly see
(without discussion)
which ideas have the
most agreement.
✓ Everyone gets a set
number of dots (3-4 is
usually sufficient.)
✓ Each person places their
dots on the items they feel
have the most merit. You
can put more than one dot
on an item.
✓ After voting, everyone can
clearly see the items with
the most dots; these are
the top items.
✓ If you donʼt have dots
handy, use colored
markers to make the dots.
Having multiple votes
relieves the anxiety of
picking only one choice.
Helps everyone see
natural agreement.
There are multiple
options and you need to
pick the best ones to
pursue.
This method can be used
solo, but works best in a
group.
71. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Break down complex
tasks into small chunks
✓ Deadlines =
hyperfocus!
✓ Immediate feedback
improves your time
management skills
Timebox
A short, set period of
time for fast-focused
work.
72. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Break down complex
tasks into small chunks
✓ Deadlines =
hyperfocus!
✓ Immediate feedback
improves your time
management skills
Timebox
A short, set period of
time for fast-focused
work.
focus
Focus
FOCUS!
(with short,
task-oriented
outcomes)
73. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Break down complex
tasks into small chunks
✓ Deadlines =
hyperfocus!
✓ Immediate feedback
improves your time
management skills
Timebox
A short, set period of
time for fast-focused
work.
Storyboards
✓ 25 minute focus time
✓ 5 minute break
✓ longer break every 4 pomodoros
Via http://pomodorotechnique.com/
74. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Break down complex
tasks into small chunks
✓ Deadlines =
hyperfocus!
✓ Immediate feedback
improves your time
management skills
Timebox
A short, set period of
time for fast-focused
work.
✓ Write down one simple thing to get done
✓ 10 minute focus time
✓ 2 minute check-in: did you finish?
✓ Set the next goal & repeat
1 small
thing
Personal version
75. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...Why...
Use when...Timebox
A short, set period of
time for fast-focused
work.
✓ Pick a task to accomplish.
✓ Pick a time span. For
generating ideas, 10-20
minutes is a good amount.
Shorter is better.
✓ Jot down a specific,
discrete item you want to
complete during the
timebox.
✓ Set a timer and focus on
completing the task.
✓ When the timer rings...did
you finish the item? If so,
move to the next one. If not,
take a moment to reflect on
why, then set a new task
and repeat.
Timeboxing provides an
artificial forcing function
that helps focus your
work and gives
immediate feedback on
small chunks of
progress.
Anytime you need to
get things done.
Use in team sessions
to keep on track and
use time effectively.
76. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Forces externalization
of ideas
✓ Reduces prep time
✓ Keeps the conversation
focused on questions
and decisions
Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
77. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Forces externalization
of ideas
✓ Reduces prep time
✓ Keeps the conversation
focused on questions
and decisions
Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
http://www.keepcalm-o-matic.co.uk/p/keep-quiet-and-read/
78. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Forces externalization
of ideas
✓ Reduces prep time
✓ Keeps the conversation
focused on questions
and decisions
Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
79. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Forces externalization
of ideas
✓ Reduces prep time
✓ Keeps the conversation
focused on questions
and decisions
Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
Bezos Narratives
Via http://fortune.com/2012/11/16/amazons-jeff-bezos-the-ultimate-disrupter/
80. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ Forces externalization
of ideas
✓ Reduces prep time
✓ Keeps the conversation
focused on questions
and decisions
Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
81. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...Quiet read
A collaboration method
that helps your team
stay focused on asking
questions and making
decisions, not on
pitching ideas.
✓ Post all the work in a
visible place.
✓ Without talking, spend
2-10 minutes reading all
the material to get
familiar with what others
have created.
✓ After the quiet read,
people can pose
questions or prompt
discussion.
Keeps teams from
presenting ideas too
early, and helps people
practice externalizing
ideas so that others can
understand without
explanation.
You have a lot of
detailed information
coming from many
contributors.
Use as a team when you
have very talkative
people involved.
82. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ See many ideas at
once, see the big
picture
✓ Makes comparisons
faster
✓ Focus on ideas instead
of persuasion
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
83. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ See many ideas at
once, see the big
picture
✓ Makes comparisons
faster
✓ Focus on ideas instead
of persuasion
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
84. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ See many ideas at
once, see the big
picture
✓ Makes comparisons
faster
✓ Focus on ideas instead
of persuasion
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
Via Adaptive Path
85. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ See many ideas at
once, see the big
picture
✓ Makes comparisons
faster
✓ Focus on ideas instead
of persuasion
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
86. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
✓ See many ideas at
once, see the big
picture
✓ Makes comparisons
faster
✓ Focus on ideas instead
of persuasion
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
87. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How...
Why...
Use when...
Work at the wall
Working at the wall
changes the dynamics
of collaboration and
allows discussion to
focus on ideas instead
of persuasion.
✓ Post all your work on a wall
(sketches, printouts,
stickynotes.)
✓ Step back: assess the big
picture & the details.
✓ Host discussions, annotate
and add/remove items.
✓ Make decisions at the wall
& arrange the information
to show what was decided.
✓ Take a photo and send it to
all participants to document
the discussion and
decisions.
Decision-making gets
easier when everyone
can see the ideas and
information all at once
in a physical place.
Information is complex
and there are many
variables.
Use as a team when
there are diverse
perspectives and
decision-makers.
88. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How can we work...
✓ faster
✓ simpler
✓ together
Sketch people
Flows
Dump 2x2 sort
Dot-vote
Timebox
Quiet read
Work at the wall
Sketch UI
89. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
512
90. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
the
magic of
remixing
Sketch people
Flows
Dump 2x2 sort
Dot-vote
Timebox
Quiet read
Work at the wall
Sketch UI
91. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Personal
productivity
=Dump
+ 2x2 sort
+ Timebox
92. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Dump
Feature
prioritization
=
+ 2x2 sort
+
Work at the wall
+ Quiet read
Dot-vote+
93. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI Flows
+
Work at the wall
+
Sketchboards
=
94. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch UI Flows
+
Work at the wall
+
Sketchboards
=
95. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Rapid lo-fi
prototyping
=+ Flows
Sketch UI
Timebox
+
96. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
Sketch UI
+ Flows
+
Dot-vote
+
Design
sprints
=+ Work at the wall
Timebox
+
97. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
Sketch UI
+ Flows
+
Dot-vote
+
Design
sprints
=+ Work at the wall
Timebox
+
98. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Where to go
to lunch
=Dot-vote
+Dump
99. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
Flows
Dump 2x2 sort Dot-vote
Timebox
Quiet read
Work at the wall
Sketch UI
2=
9
+
+ + +
+ +
+
+
+
+
+
+
100. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
512Ways to work
faster + simpler + together
101. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
How will YOU
work fast?
102. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Sketch people
Flows
Dump 2x2 sort
Dot-vote
Timebox
Quiet read
Work at the wall
Sketch UI
✓ Pick 3 new ways to work.
✓ Write them down.
✓ Commit to doing these in
the next week.
✓ Timeboxed at 1 minute!
103. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
When it all works...
We rapidly deliver products that
delight, that inspire and that
improve the lives
of the people
who use them.
104. UX Days Tokyo | 512 Ways to Design Faster | @katerutter | APRIL 2015
Thanks!
Slides (with details about each
technique) will be available at:
www.slideshare.net/intelleto
Kate Rutter
katerutter@gmail.com
www.intelleto.com
@katerutter
Thanks & credits to:
Adaptive Path [http://adaptivepath.com]
Alexa Andrzejewski [http://flavors.me/ladylexy]
Brandon Schauer [http://brandonschauer.com/]
Gamestorming [http://gamestorming.com]
Janice Fraser [http://clevergirl.com]
Luxr [http://luxr.co]
Leah Buley [http://ugleah.tumblr.com/]
Luke Wroblewski - tweet [http://lukew.com]
Pomodoro [http://pomodorotechnique.com/]
Rachel Glaves [http://about.me/rachelglaves]
Tim McCoy - risk model [@seriouslynow]
Tradecraft [http://tradecrafted.com]
https://wordsofasuperheroine.wordpress.com/tag/airbnb/