prototype it!
TRANSCRIPT
First step in creating your app :Prototype it!
Elina Kim, Rocio Montes
Rocio Montes
Senior Software Engineer in Quality @ Intuit
Elina Kim
Senior XD Prototyper @ Intuit
Iterative Design Process
Adapted from “The Design Process”
Iterative Design Process
Adapted from “The Design Process”
“A prototype is an imperfect, rudimentary version of something designed to exhibit both form and function in a realistic way.”
Low-FidelityPrototypesLow-fidelity prototypes are about understanding users’ needs.
Mid-FidelityPrototypes
High-FidelityPrototypesHigh-fidelity prototypes are about delivering delightful experiences.
“The fidelity of your prototype should match the fidelity of your questions.”
Heather Daggett
Be Practical
Slide courtesy of Heather Daggett
Can we use a brighter image?
Beautiful!I love those icons
I really hate red
Can we make the photos bigger?
Slide courtesy of Heather Daggett
Slide courtesy of Heather Daggett
Slide courtesy of Heather Daggett
Can I save my changes?
This flow doesn’t make sense
How can I delete an item?
Why Should We Prototype?● “A picture is worth 1000 words. A
prototype is worth 1000 meetings.” (IDEO)
● Best way to explore, validate and refine ideas
● Makes the cost of mistakes cheap
Prototyping tools
Time to prototype!
ScenarioYour job here is to (very quickly) design an app that can be used to place an order at a Cafe. Then you will (very quickly) construct a prototype that can be used to test your design.
The app has to support the following:
● multiple drinks options in multiple sizes
● a confirmation of each drink before adding to the current order● calculation and display the price of each drink combination & total order● issue a confirmation of the total order before finally sending it to the barista
Thank you!
Rocio Montes
Senior Software Engineer in Quality @ Intuit
Elina Kim
Senior XD Prototyper @ Intuit