20% Of The Semester
Assignment 3 - Interactive Prototype
High Fidelity Interactive prototype
For the third assignment, students will combine high fidelity mocks with an interactive prototype link. This project will focus on two components: visual design and interface workflow interaction.
High Fidelity
The goal of high fidelity mocks is to clarify the visual look and feel of your digital projects. At this stage, students should execute a pixel-perfect approach on every page.
Specifically, students will focus on various design elements such as:
- Colour
- Fonts
- Hierarchy
- Visual system
- White spacing division
- Imageries integration
You also need to establish best practices for:
- Input form
- Validation system
- Error messages
As mentioned last week, it's your responsibility to bring multiple pages done in class to represent your project. As course director, I will not establish a minimum number of pages to do.
Artboards should be done in your favourite digital tools such as Illustrator, Sketch, Adobe XD, etc.
Interactive prototype
As mentioned by John Madea, "If a picture is worth 1,000 words, a prototype is worth 1,000 meetings."

The goal of the prototype is to clarify and validate interaction workflow. Thus, from your artboards, the student will create a full prototype project where potential users can interact with feedback.
At this stage, students must know the core components of their digital projects. Thus, inside your prototype, it's important that all of the main features are well defined and clear to interact with.
You also need to elaborate all of the user experiences that generate a good digital product, such as:
- Account creation (if relevant)
- Onboarding strategy
- Creation
- Editing
- Notifications system
Your prototype should be done in your favourite digital tools, such as InVision, Flinto, Marvel, etc.
Due October 23 - Beginning of the class
Assignment 3 - Interactive Prototype (High Fidelity Mocks)