In this module you will start building a high-fidelity prototype. We will use Google Material Design’s library of mobile interface elements to jump start our mobile interface design, selecting suitable interface elements and designing their behavior. We review other design systems, and discuss their role in the design workflow.
Learning outcome
- Implement lessons from user testing to improve app flow design.
- Design a mobile interface, utilizing existing suitable design patterns.
- Design a high-fidelity prototype that demonstrates the primary functionality of the app.
Read/Watch
Journal 9
Write about your experience testing your low-fidelity prototype. What feedback did you receive? What worked? Where did your user(s) stumble? and how you changed your design in response to the feedback.
Assignment: Final Project
First complete your low-fidelity prototype with for at least 2-3 user tasks. Test it yourself first and then ask your teammate for feedback. Document the testing of the low fidelity prototype in Journal 8.
After you sorted out some of the bigger flow issues with the help of the low-fidelity prototype it is time to step it up a notch and create a higher fidelity prototype that will look closer to the actual app. To shorten production time use interface elements from the Material Design Theming kit.
- Create a second prototype in Figma, (create a new file, or duplicate the low-fidelity prototype file. Keep the low-fidelity prototype for submission and documentation).
- Use interface elements from the Material Design Theming kit accessible from the Libraries. You will be customizing them in the next module.
- Implement lessons learned in the testing of the first prototype.
- Include the tasks you prototyped before and add the rest of the tasks identified in the creative brief.
Submission: Figma Prototype
