Prototyping is the process where you produce an initial model of your website, app or other product to test the principles and concepts upon which it is based.
This can be a very basic representation of the idea or quite a sophisticated, functional mock-up depending on what you are seeking to achieve with the prototype and what you are likely to use it for.
This can range from testing out your concept on actual potential users to getting buy-in from management or owners to providing a link between designers and developers. These are all valid reasons to prototype but they might require different degrees of realisation to be useful in achieving the objective.
There are three levels of prototype that you can use:
- Rapid, sketched paper prototypes;
- Lo-fi, monochromatic wireframes;
- High-fidelity, clickable mockups.
1. Rapid, sketched paper prototypes
These are a rough schematic of a site produced on paper showing the relationships between the various elements. These are typically used early on in the design and development for validating the fundamental, underlying concepts and testing the logic of the design. Basic flaws in reasoning, layout, comprehension and structure can be flushed out using this method.
2. Lo-fi, monochromatic wireframes
When you are satisfied that the fundamentals and basics of the concept are sound you can progress onto more sophisticated prototyping models such as lo-fi monochromatic wireframes. These are computer-based models but very stripped down, almost skeletal in their lack of detail so there is nothing to distract from the primary purpose which is to test out the working structure, architecture and functionality. Having this laid out barely without any real design or content helps to understand the working relationships within the elements and whether they work logically – and practically – to deliver outcomes to the user.
3. High-fidelity, clickable mockups
This is the more advanced phase of the prototyping process. It will require some effort and expense so you need to have made sure that any major wrinkles have been located and removed before getting to this stage (one of the main points of prototyping being to avoid making expensive mistakes, especially late in the development process).
This mock-up will probably contain most, if not all, of the features of the actual site – though not worked up to the level of detail or design of the final version. It will be an interactive, clickable model that emulates the site in its most important elements and allows users to test functionality and features in a real environment. Any issues or comments that are derived from this activity can be taken as direct and pertinent to the finished product itself so it is a useful process both in terms of accuracy and relevance when it comes to incorporating the feedback into the final product model.
Developing websites, apps and other electronic products can be a very expensive exercise, so it is important that this type of testing is incorporated throughout the development process. Prototyping is an important tool in ensuring a smooth transition from concept to final product. If you would like to know more about this technique, why not ring us on +44(0)800 024624 or email us at firstname.lastname@example.org