LEAN UX WORKSHOP“A guide to your first prototype”
BARCELONA JULY ‘16
@harriken
Jose Berengueres
Berengueres | 2
Outline
1. What is Lean UX?2. Prototype vs. MVP3. Types of Prototypes4. Examples of MVPs5. Further reading6. Workshop time!
Berengueres | 3
1. What is Lean UX?
THE IRON TRIANGLE
Berengueres | 4
1. What is Lean UX?
LEAN UX minimize time
not money
Berengueres | 5
1. What is Lean UX?
Quality/Success
Number of Iterations
Berengueres | 6
1. What is Lean UX?
LEAN UX minimize time by making iteration
cycle faster
Eric Ries @ http://theleanstartup.com/principles
Experiment/Feedback Loop
1. What is Lean UX?
Berengueres | 8
Outline
1. What is Lean UX?2. Prototype vs. MVP3. Types of Prototypes4. Examples of MVPs5. Further reading6. Workshop time!
2. Prototype vs. MVP
Prototype vs MVPA Prototype’s goal is to test
product design or technical hypotheses.
An MVP’s goal is to test business hypotheses as well as product design or technical hypotheses.
2. Prototype vs. MVP
HOW WOULD YOU BUILD A CAR?
A
B
2. Prototype vs. MVP
Work Work
feed-back point
Risk
Berengueres | 13
Outline
1. What is Lean UX?2. Prototype vs. MVP3. Types of Prototypes4. Examples of MVPs5. Further reading6. Workshop time!
Paper Prototypes
Tools often used:
● Paper● Pen● Markers
Example Here
3. Types of Prototypes
Paper prototypes are best for
• Producing tangible ideas from abstract ideas• Preliminary team discussions• Drafting layouts and flows
3. Types of Prototypes
Low Fidelity Prototypes
Tools often used:
● Balsamiq● Axure
3. Types of Prototypes
Low fidelity prototypes are best for
• Content driven• Focuses on layouts and flows • Free from arguments related to aesthetic values like
colors, typography, illustrations, images.
3. Types of Prototypes
High Fidelity Prototypes
Tools often used:
● Invision● Marvel● Sketch● Photoshop● Justinmind
Example Here
3. Types of Prototypes
High fidelity prototypes are best for:
• Content driven• Focuses on layouts and flows • Represents the look and feel of the real product• Can be used for user research
3. Types of Prototypes
Functional Prototypes
Tools often used:
● App Inventor● Origami● Framer● Twitter Bootstrap● HTML & CSS or more
3. Types of Prototypes
Functional prototypes are best for
• Content driven• Focuses on layouts and flows • Represents the look and feel as well as the actual
experience of the product• Best for user research
3. Types of Prototypes
Key Takeaways
• Different types of prototypes with their own usecase
• Prototypes are meant for iterations and progressions. for e.g. sketching to low fidelity prototype to high fidelity prototype to functional prototypes
• Testing technical hypotheses
3. Types of Prototypes
Berengueres | 23
Outline
1. What is Lean UX?2. Prototype vs. MVP3. Types of Prototypes4. Examples of MVPs5. Further reading6. Workshop time!
4. Examples of MVPs
4. Examples of MVPs – Blog first groupon
4. Examples of MVPs – Hackernews video
4. Examples of MVPs – Kickstarter first
4. Examples of MVPs – Craig’s List first
Key Takeaways• An MVP is the first version of your idea intended to communicate value to
your target users or customers
• Almost anything can be an MVP as long as it can prove your idea to be a viable business opportunity
• It’s absolutely normal for your MVP to suck
• The MVP should be a way to learn more about your users and the problem you’re trying to solve
4. Examples of MVPs
4. Examples of MVPs - Palm
4. Examples of MVPs - Palm
Jeff Hawkin’s Palm Pilot Prototype
4. Examples of MVPs - Honda
Iterations: Motorized bicycle for wife Motorcycle company Car company
4. Examples of (non) MVPs – Toyota type AA
First iteration: Luxury car “AA” (3 years to make the engine) epic fail
Berengueres | 34
1. What is Lean UX?
And now, the prototyping session
Get your hands dirty
6. Workshop time
Before the Prototype, there is the Business Model
https://github.com/rodw/paper-forms/blob/master/lean-canvas/lean-canvas.pdf?raw=true
Before the Prototype, there is the Business Model
Understand the Problems of Customer Segments
Problem
Revenue Streams
UVP Unfair Advantage
Customer Segments
Channels
Solution
Key Metrics
Cost Structure
Problem
Revenue Streams
UVP Unfair Advantage
Customer Segments
Channels
Solution
Key Metrics
Cost Structure
Define the Solution and Unique Value Proposition
• Bachelors who are university students and professionals
• Age 20 to 35• Primarily expatriates • Do not own cars
Customer Segment
• Don’t know who to call or where to find affordable places
• Difficulty in knowing whether a roommate is the right fit
• Don’t know if the neighborhood has all the necessary facilities nearby (including supermarkets, hospitals, public transport)
Problems
User PersonasJanet● 19 years old● International Student from South Africa● Lives on Campus● Prefers roommates who are clean, non party animals and ready
to give space during study hours Mike● 28 years old● Banking professional at EmiratesNBD● Lives in Discovery Gardens● Prefers roommates who do their share of the cleaning, cooking
as well as pays rents timely
Map the User Journey (number the steps, story)
& draw the UVP Group - 15 minutes
Sketch Your App Individual - 15
minutes
Critique each other’s sketches
10 minutes
Pool best ideas from sketches into one final version then use Marvel to
prototype
Group - 20 minutes
So what next? Depending on your level of confidence:• Start with a low fidelity prototype - useful if
you’re working with a team of developers and a designer who can convert to high fidelity
• Or skip to high fidelity prototype - useful if you’re skilled in Sketch or Photoshop to create a glimpse of the look and feel
• Or skip to functional prototype if you have mapped out all the use cases thoroughly.