This document provides an overview of Lean UX and prototyping. It defines Lean UX as minimizing time rather than money through rapid iteration. Prototypes test design or technical hypotheses, while MVPs test business hypotheses. Paper, low-fidelity, high-fidelity, and functional prototypes are described for testing at different stages. Examples of successful MVPs like Groupon, Kickstarter, and the Palm Pilot are given. The workshop portion guides participants through sketching app ideas, critiquing, and prototyping the best concept in Marvel. Next steps depend on confidence levels and may involve a low or high fidelity prototype or functional prototype.

1. LEAN UX WORKSHOP
“A guide to your first prototype”
BARCELONA JULY ‘16
@harriken
Jose Berengueres

2. Berengueres | 2
Outline
1. What is Lean UX?
2. Prototype vs. MVP
3. Types of Prototypes
4. Examples of MVPs
5. Further reading
6. Workshop time!

3. Berengueres | 3
1. What is Lean UX?
THE IRON TRIANGLE

4. Berengueres | 4
1. What is Lean UX?
LEAN UX minimize
time not money

5. Berengueres | 5
1. What is Lean UX?
Quality/Success
Number of Iterations

6. Berengueres | 6
1. What is Lean UX?
LEAN UX minimize
time by making
iteration cycle faster

7. Eric Ries @ http://theleanstartup.com/principles
Experiment/Feedback Loop
1. What is Lean UX?

8. Berengueres | 8
Outline
1. What is Lean UX?
2. Prototype vs. MVP
3. Types of Prototypes
4. Examples of MVPs
5. Further reading
6. Workshop time!

9. 2. Prototype vs. MVP
Prototype vs MVP
A 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.

10. Berengueres | 10
2. Prototype vs. MVP
@boagworld

11. 2. Prototype vs. MVP
HOW WOULD YOU BUILD A CAR?
A
B

12. 2. Prototype vs. MVP
Work Work
feed-back point
Risk

13. Berengueres | 13
Outline
1. What is Lean UX?
2. Prototype vs. MVP
3. Types of Prototypes
4. Examples of MVPs
5. Further reading
6. Workshop time!

14. Paper
Prototypes
Tools often used:
● Paper
● Pen
● Markers
Example Here
3. Types of Prototypes

15. Paper prototypes are best for
• Producing tangible ideas from abstract ideas
• Preliminary team discussions
• Drafting layouts and flows
3. Types of Prototypes

16. Low Fidelity
Prototypes
Tools often used:
● Balsamiq
● Axure
3. Types of Prototypes

17. 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

18. High Fidelity
Prototypes
Tools often used:
● Invision
● Marvel
● Sketch
● Photoshop
● Justinmind
Example Here
3. Types of Prototypes

19. 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

20. Functional Prototypes
Tools often used:
● App Inventor
● Origami
● Framer
● Twitter Bootstrap
● HTML & CSS or more
3. Types of Prototypes

21. 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

22. 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

23. Berengueres | 23
Outline
1. What is Lean UX?
2. Prototype vs. MVP
3. Types of Prototypes
4. Examples of MVPs
5. Further reading
6. Workshop time!

24. 4. Examples of MVPs

25. 4. Examples of MVPs – Blog first groupon

26. 4. Examples of MVPs – Hackernews video

27. 4. Examples of MVPs – Kickstarter first

28. 4. Examples of MVPs – Craig’s List first

29. 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

30. 4. Examples of MVPs - Palm

31. 4. Examples of MVPs - Palm
eff Hawkin’s Palm Pilot Prototype

32. 4. Examples of MVPs - Honda
Iterations: Motorized bicycle for wife  Motorcycle company  Car company

33. 4. Examples of (non) MVPs – Toyota type AA
First iteration: Luxury car “AA” (3 years to make the engine)  epic fail

34. Berengueres | 34
1. What is Lean UX?

35. And now, the prototyping
session
Get your hands dirty
6. Workshop time

36. Before the Prototype, there is the Business Model
https://github.com/rodw/paper-forms/blob/master/lean-canvas/lean-canvas.pdf?raw=true

37. Before the Prototype, there is the Business Model

38. Understand the Problems of Customer Segments
Problem
Revenue Streams
UVP Unfair
Advantage
Customer
Segments
Channels
Solution
Key Metrics
Cost Structure

39. Problem
Revenue Streams
UVP Unfair
Advantage
Customer
Segments
Channels
Solution
Key Metrics
Cost Structure
Define the Solution and Unique Value Proposition

40. • Bachelors who are university students and
professionals
• Age 20 to 35
• Primarily expatriates
• Do not own cars
Customer Segment

41. • 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

42. User Personas
Janet
● 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

43. Map the User Journey (number the steps, story)
& draw the UVP
Group - 15 minutes

44. Sketch Your App
Individual - 15
minutes

45. Critique each other’s
sketches
10 minutes

46. Pool best ideas from sketches into
one final version then use Marvel to prototype
Group - 20 minutes

47. 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.

48. Berengueres | 48
8. Acknowledgement (original presentation adapted from)
Ashiqur Rahman
ar@inov.io