UX-UI/subjects/ux/going-on-holidays-with-friends/prototyping

UX II - Ex 7 - Prototyping

Instructions:

Give another dimension to your user flow and turn your user flow into a paper prototype (12 screens max).

• First, draw low-fidelity prototypes on paper. One main screen = 1 mobile frame. No micro-interactions nor multistate are needed for this exercise.
• Test the prototype with 3 people. To do so, prepare a usability testing guide following the Design Sprint Five-Act interview
• Then, draw your mid-fidelity screens on Figma with simple shapes, in black and white.

Deliverables:

• Pictures of a paper prototype
• Wireframes (mid-fi) to upload on the Figma file
• Upload the documents on Github, in a zip folder named “ProjectTitle_Name_FirstName”, with all project deliverables as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, the first deliverable can be named as “Doe_John_MidFiPrototype_05242024_V1”.

Tips: Vocabulary

• Low-Fidelity: Paper Prototypes - Example here
• Mid-Fidelity: Wireframes - black and white, only the main elements, on digital prototype tools - Example here
• High-Fidelity: Wireframes with color, styles, graphical details, and micro-interactions - Example here

Resources:

• Google Ventures - Design Sprint: The Five-Act interview
• Example: Paper Prototyping - The Practical Beginners guide
• Example: Wellness App
• Android Mobile Template
• iPhone Template
• Figma

Quote:

Any design is like a joke …if you have to explain it, it’s bad.