## Second prototyping

### Instructions

Give another dimension to your user flow and turn it into a paper prototype (6 to 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](https://www.youtube.com/watch?v=U9ZG19XTbd4)
- Then, draw your mid-fidelity screens on Figma with simple shapes, in black and white.
- 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”.

### Deliverables

- Pictures of a paper prototype.
- Figma file with the Wireframes (mid-fi).

**Tips:**

- Low-Fidelity: Paper Prototypes - [Example here](https://miro.medium.com/max/1400/1*5nUfqqA2gjdAYHagjbHA5w.jpeg)
- Mid-Fidelity: Wireframes - black and white, only the main elements, on digital prototype tools - [Example here](https://miro.medium.com/max/1400/1*eGSfaxwYbxUFomYbyO6GWw.png)
- High-Fidelity: Wireframes with color, styles, graphical details, and micro-interactions - [Example here](https://miro.medium.com/max/1400/1*Xn0HSKAvhr4TZzC9lN5udw.gif)

**Resources:**

- Google Ventures - Design Sprint: The Five-Act interview
- Example: [Paper Prototyping - The Practical Beginners guide](https://www.uxpin.com/studio/blog/paper-prototyping-the-practical-beginners-guide/)
- Example: [Wellness App](https://medium.com/@ebtaskin/story-of-my-very-first-ux-ui-design-project-at-ironhack-bootcamp-955addeb760e)
- [Android Mobile Template](https://i.pinimg.com/originals/43/8e/de/438ede24264eb9552b635d34142eac29.png)
- [iPhone Template](https://www.cssauthor.com/wp-content/uploads/2014/01/iPhone-5S-Template-PSD.jpg)
- Figma

**Quote:**

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