Simulates the interactive experience of the final product and allowing it to be tested before it goes to build. Prototypes are a work in progress, helping to validate and share ideas with the wider team and user.
There are three types: low, medium and high fidelity. Depending on what needs to be tested will determine which prototype is relevant.
Low fidelity prototypes
Sketching screen states helps to quickly produce the prototype and test broad concepts. It quickly highlights if users understand the website, how efficient the flow is and if it could be optimised in any way. The benefits of low fidelity prototyping are:
- Quick
- Cheap
- Catches any problems early
Tools needed: paper, pen and post-it notes.
Medium fidelity prototypes
Closer to the real thing, providing simulated interactive functionality and full navigation. Medium fidelity prototypes show more detailed concepts and flow, screen layout and hierarchy, basic interactions, copy and labelling, navigation and structure. The benefits are:
- Better and easier to test with users
- Low cost
- Provides rich data and insights
Tools needed: sketch screen and flow, build screens in Sketch and add to InVison for interactivity.
High fidelity prototypes
Much richer interactions built with real front-end code to mimic the look and feel of the final product. High fidelity prototypes test flow and concepts, screen design and layout, workflow data in and out and testing rich interactions such as mapping. The benefits are:
- Ability to convey rich interactions
- Richer data and insights
Tools needed: sketch screen and flow, use Axure (or other prototyping tool), build the screen and incorporate text, labels and interactions.