Post on 11-Aug-2014
description
transcript
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Design a product in 3 hours
Designing with Lean UX
UX Lisbon | Wednesday, June 04, 2014Kate Rutter | @katerutter
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Hello!Principal, Intelleto.comCo-Founder, Luxr.coSketchnoter, graphic recorderEntrepreneurship + UX
@katerutterhttp://intelleto.com
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
@katerutter@luxrco
#uxlx
TWEET!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Around the room intros* name* role * your favorite superpower!
Hello!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Letʼs get warmed up
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{5 min Activity}
Users + problems + solution
Sketch it outWho are the users?
What problems do they have?What would be a proposed solution?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Users + Problem + Solution map
Working parents with with kids
Task-a-doodle
“the DNA of your idea”May 2014
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Users + Problem + Solution map
a mobile app for delegating tasks
Working parents with with kids
need to know when something’s done
Too much to do, not enough timeneed to share tasks on the go
Task-a-doodle
“the DNA of your idea”3 min
May 2014
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
A class on how to produce an awesome UI
This is not...
(how do you know itʼs awesome?)
A session on making production wireframes or photoshop comps
(how do you know these arenʼt a waste of valuable time?)
A “perfect approach” or a rigid point of view on Great UX.
(100s of participants have used these techniques to define their
own unique Great UX.)
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
• Design = solving problems • Lean Startup concepts & mindset• Hands-on } make a product MVP• Lo-fi MVP -> validate -> build
This is about making products.
Focus • Simplify • Decide • TestMove forward.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
I am not an expert on your idea. You are.
My goal is to help you identify one way you can innovate using lean
practices...
so you can experiment andlearn first-hand if itʼs helpful.
What to expect...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
We are going to be working really, really, really fast.
What to expect...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
There is a purpose to this.
I will push you to get something down rapidly. In 3 hours, you will
have product concept you can validate.
We are going to be working really, really, really fast.
What to expect...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
You will be working solo and as peer pairs.
Two brains arebetter than one.
And weʼll keep talking to a minimum.(There is a break where we can get all social!)
What to expect...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
You may not like the pace/process/pressure/perspective, etc. etc.
That is okay.
All I ask is that you keepan open mind and try it.
What to expect...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
“But the code validated!”
“The design was brilliant. It just never launched.”
“We made an amazing thing.But nobody wanted it.”
What I NEVER want you to experience...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
“But the code validated!”
“The design was brilliant. It just never launched.”
“We made an amazing thing.But nobody wanted it.”
What I NEVER want you to experience...
FAIL
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
“But the code validated!”
“The design was brilliant. It just never launched.”
“We made an amazing thing.But nobody wanted it.”
What I NEVER want you to experience...
waste
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
About the whole “Lean” thing
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Build.Measure.
Learn
Lean startup?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
From The Lean Entrepreneur. B. Cooper & P. Vlaskovits.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Lean StartupStartup: a human institution designed to create new products or services under conditions of extreme uncertainty.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
2 Big Ideas
Empathy.Design.
Products!
User Experience
Build. Measure.
Learn!
Lean Startup
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
3 Key Concepts
Build. Measure.
Learn!
Validated
Learning
Get out of the building!
Customer
DevelopmentAgile
Development
Collaborate.Release.Improve!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
The Agile Manifesto came about at a ski scrum in February 2001.
The big idea...
over over over over
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Steve Blank introduced “Customer Development” in...um...2006.
The big idea...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Eric Ries wrote a blog post on Sept 8, 2008 titled “The Lean Startup.”
+incremental
releasesmake products
customers want
+reduce waste
The big synthesis...
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
• Experiments• Validated learning• Reduce waste
Lean Startup
These change everything.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
risk
timeDefine
The old way
Design
Develop
Release
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
risk
timeDefine
Design
Develop
Release
a better old way
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
risk
time
A different way
MAKE
release
MEASURE
BUILD
LEARN
MEASURE
BUILD
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
BUILD
MEASURE
LEARN
More cycles in less timereduce the risk.
faster!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Okay, fine.But how does this relate to
User Experience
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
UX =• a mindset• focused on delivering value• inspires the right kinds of ideas• guides decisions
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
UX != UI* Your first project: Remove any reference to UX/UI from all of your work. Replace it with UX + UI. This directive holds for the duration of your UX career.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
via @luxrco
sketches, prototypes, wireframespixelsUI
UX as a stackBUILD
MEASURELEARN
Company Purpose
Your vision & ideas
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Letʼs make stuff
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Rapid Sketching
Star people!
7 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
You can draw a person in 4 simple steps....
sketch via @luxrco
Star people
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Use simple shapes to put a person in a place.
sketch via @luxrco
Add context
inside outside
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
People have faces and emotions.
Expressions Matrix
3 mouths
+ 2 eyebrows
= 9 emotions (so sneaky!)
smile frown
up brows
neutral
down brows
start with this� no
brows
add a
mouth...
add
eyebrows...
sketch via @luxrco; also see @austinkleon
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Picture your user as a human person.
(Insert provisional personas here)
Who is it for?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
UX Stack
Company Purpose
Your vision & ideas
via @luxrco
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Who: Make a Persona
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Make a personaPortrait
5 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Make a personaFacts
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Write down...3 min
• Age• City where s/he lives• Family (married? kids? single? divorced?)
• Job role• Annual incomeBe specific.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Make a personaBehaviors
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Brainstorm 10 behaviors3 min
• What do they do that indicates that they are a good customer for you?
• How are they solving the problem now?
• Behaviors are verbs.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
more important
less important
2 min{Activity}
Divide into 2 piles
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
2 min{Activity}
Pass & Peer-write
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Break!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Make a personaNeeds & Goals
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
3 min
• What do they need to accomplish that will solve their problem?
• Why do they do the behaviors?
• How are they solving the problem now?
{Activity}
Brainstorm 10 needs & goals
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Divide into 2 pilesmore
importantless
important
.5 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Pass & Peer-write1 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
* Could enough people like this exist? (And can you find them to talk to them?) If no, make adjustments.
* Is this a specific person you know? If yes, make adjustments.
* Is the persona respectful? If no, make adjustments or re-do. Contempt is not helpful.
{Activity}
3 Checks
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Persona
Who is our user and what are their needs & goals?
What you have now:
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
i <3 empathy.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Act on user needs by identifying value propositions.
Whatʼs the value?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
UX Stack
Company Purpose
Your vision & ideas
via @luxrco
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
An example from Foodspotting
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Envision 6 uses
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Sketch 6-up uses7 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Work with your peer
Pass your work1-minute “quiet read”
30 seconds toConfirm clarity
1 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Dot-vote top picksPeers } dot 2 top uses
2 min
Founders } dot 1 from within the 2
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Redraw the top pick3 min
Mary
Task-a-doodle
Know when
someone in her
family finishes
a shared task.
April 2013
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
UX Stack
Company Purpose
Your vision & ideas
via @luxrco
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Brainstorm 3 features3 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Make a feature list.05 min
5-item to-do list
Task sharer
Status tracker
April 2013
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Persona
Who is our user and what are their needs & goals?
What can a user do with our product?
How will they do that?
MaryTask-a-
Know when
someone in her family
April 2013
Value prop
What you have now:
Limited features to support the use
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Uses make me frisky!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Measure what mattersby tracking
actionable metrics.
How do you knowitʼs working?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Product(black box)
Conversion Funnel
TrafficMeasuring what?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Product(black box)
Conversion Funnel
TrafficMeasuring what?
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Metrics checklista good metric... a great metric...
...makes you look at all the other metrics and say “none of those other numbers matter if we donʼt get this right first.”
...measures the usage of your product by a person. The usage should be specific to features that deliver value to your user.
vanity
total number of registered
users
unhelpful
sign-ups
% of users who share a
task 3+ times a day,per week
awesomebetter% of users who sign in 3+ times a
day,per week
good% of new users per
week
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Brainstorm 1 metric2 min
Note: When working, you can (and should) use the full Dump & Sort method for this.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
{Activity}
Improve your metric!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
3. Is there an object basis?
• “per user” [ ___/user]• “per user per week” (fancy!)• Examples: per user, per session, or by interaction or item (messages per file, emails per thread)
* not required, but super-helpful
• “per week” [ ___/wk ]• “per month” [ ___/mo]2. Is there a time basis?
• “number of...” [ # ]• “average number of...” [avg ]• “percent of...” [ % ]
1. Does the metric begin with a number?
Metrics check 1 min
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
% of users who share a
task 3+ times a day,per week
April 2013
{Activity}
Make a Dashboard
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Persona
Who is our user and what are their needs & goals?
What can a user do with our product?
How will they do that?
MaryTask-a-
Know when
someone in her family
April 2013
Value prop
What you have now:
Limited features to support the use
What does success look like?
Actionable metric to measure progress
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
metrics. better than a
bubbling brook.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Pull it all together.
Tell the story.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
UX Stack
Company Purpose
Your vision & ideas
via @luxrco
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
This is [product name] .
Meet...
MVP
The idea...
* Minimum Viable Product
2 min
MVC
MVP Narrative
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Making the most of the team
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
2 min
Your pair peer readsyour story back to you.
(Simply read the words on the page.)
Story time.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
1 min
Come up and shareyour story!
Exciting prizes for 2UX-entrepreneurs
who volunteer!
Pitch Practice
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Features
Users
Uses
Product
Needs
UX Stack
Company Purpose
Your vision & ideas
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
1. Sketch (especially of people)
2. Timebox! (speed kills the censor and keeps you moving)
3. Generate independently, discuss as a team(3 people ideal)
4. Dump & Sort (one item per Post-It, use Sharpie)
5. 2x2 organizing framework (help decision-making when lots of items)
6. Work at the wall 7. Quick decision-making techniques
(dot-vote, roman vote, stack rank)
Patterns of work
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
This way of working is hard. But itʼs worth it.
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Resources & Next Steps
• Validate! Do 3 customer development interviews (Within the next week, or even sooner if your audience is at UX Lisbon!)
• Startup Weekends & hackathonsStartupweekend.org
• Founders Institutefi.co
• OʼReilly Lean Books & Luxr Core Curriculum
• Bootstrapping your idea
• Crowdfunding, Peerfunding, Enterprise Incubators
Resources & Next Steps
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Geek out & learn tons more
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
Kate Rutter@katerutterhttp://intelleto.com
Thanks!
Designing with Lean UX | UX Lisbon 2014 | June 04, 2014 | @katerutter | intelleto.com
HANDOUTS
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
Handouts
Design a product in 3 hours
Designing with Lean UX
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
• Experiments• Validated learning• Reduce waste
Lean Startup
Customer Development • make products customers wantAgile Development • Iteration & incremental releasesLean Manufacturing • Reduce waste
Startup: a human institution designed to create a new product or service under conditions of extreme uncertainty.
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
Features
Users
Uses
Product
NeedsCompany Purpose
sketches, prototypes, pixelsUI
BUILD
MEASURELEARN
UX Stack + Lean Startup
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
Use basic supplies: sharpies, stickynotes and white paper
Dump & sort & 2x2 organizing
Go wide, then decide
Generate independently, discuss as a team. (3 people ideal)
Work at the wall
Quiet read (before discussion)
Sketch (especially of people)
Share info with Information radiators
Timebox (speed kills the censor)
Quick decisionmaking (dot vote, stack-rank)
Techniques Checklist
The Molecule
people
problem solution
have
addressesuse
Product name date
/ /
Facts Needs & Goals
Behaviors
Personadate
/ /
With _________________ , _________________ can...
Value Proposition 6-up Sketchesdate
/ /
With
can...
!
Value Propositiondate
/ /
featurefeature
feature
MVP Featuresdate
/ /
To deliver on that, we will build these features:
metric
by
Goal
/ /
Notes
Metrics Dashboarddate
/ /
To assess progress, we will measure these metrics:
metric
by
Goal
/ /
Notes
metric
by
Goal
/ /
Notes
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
106
a great metric......makes you look at all the other metrics and say “none of those other numbers matter if we donʼt get this right first.”
a good metric......measures the usage of the product by a person. The usage should be specific to features that deliver value to the user.
Making metrics actionable
vanity good betterunhelpful
total number of registered
users
% of users who share a
task 3+ times a day,
per week
sign-ups
awesome% of users who sign in 3+ times a
day,per week
% of new users per
week
Does the metric begin with a number?• “number of...” [ # ]• “average number of...” [avg ]• “percent of...” [ % ]
Is there a time basis?Is it comparative? • “per week” [ ___/wk ]• “per month” [ ___/mo]
Is there an object basis?* not required, but super-helpful• “per user” [ ___/user] • “per user per week” (fancy!)
1Metrics Check
2 3
UX LIsbon : Designing with Lean UX Workshop : June 04, 2014 http://luxr.co @luxrco © 2014
Further Reading