Design Process — Designing
Part IV — Greyscale, High-Fidelity, Early UI Kit, & Prototype
We’ve finally arrived at the module the majority of the world is familiar with: the mockup module. While the previous modules contained deliverables that aren’t as well-known outside of design circles, the deliverables included here align with the core of everyone’s expectation. The goal this time around is quite simple: design the darn thing!
No blank-page syndrome here — through three modules we’ve armed ourselves with a total of six documents for guidelines. We know exactly what to design. Refer back to the UX Wireframes for a second, & if you haven’t already, make a quick check-list of all the views in the final version. With this checklist in hand, it’s time to move through this module’s four deliverables:
Deliverables
- Greyscale Mockups
- Early UI Kit
- High-Fidelity Mockups
- InVision/Sketch/Marvel/Adobe XD Prototype
We’ll start by piecing together realistic mockups, however, we’ll limit the decisions made on UI & branding elements by delivering strictly black & white (greyscale) mockups. Next, we’ll compile the decisions made in the grey scale mockup — UX elements such ascards, rows, & shadows. After that, we’ll swing…