EXAMPLES OF PRODUCT SPECS
Showcased here is a sampling of the detailed specs for some UI components and features of the MG TMS. All of these were done to explore and document the user experience, and used by the developers to build the product. The specs aim to cover all scenarios, from rollover stats to errors, active/inactive stats etc…
User Flows, Sketches, Wireframes, Mockups, Interactive Prototypes
Whiteboard, Pen and Paper, Sketch App, InVision App, Principle App
It always starts with sketching ideas
Writing and sketching really helps me to focus, and ideas flow from there. Sometimes I’ll sketch a feature, or a small UI detail, or a new approach to the UI entirely. It’s a quick way of purely and simply just designing and exploring ideas. Perhaps most importantly, you don’t get distracted by pixel perfection, fonts, colour, grids, guides etc… like you do while using computer software.
Detail in design
In addition to the walkthroughs, user flows and prototypes, I also like to create detailed specs for all the UI components and features. I feel these are important when you have a large team, so everyone is on the same page, with one central point of reference.