Why Prototype?

A prototype is a representation of a design for review before it goes into production. It allows you to understand and interact with the website or app and provide feedback at a stage where it’s relatively easy to make adjustments before full production begins. Like paper mock-up prototypes in the offline world, prototypes built for digital web and mobile properties are even more important.

In the past website and app creative was presented in PDF format or even – gasp – on a print out! It’s important to review website work at actual scale and in the final environment that it will be produced on. So while a PDF can be viewed on a screen, often they scale up and down and still do not provide an accurate representation of what will finally be produced. Digital prototyping tools like InVision and Marvel make it easy.

At the most basic level, website prototypes allow the creative to not only be viewed on a laptop or handheld, but also to be interacted with, such as tap, swipe, navigate, and even show persistent elements. This all happens during the design phase so the creative team can receive feedback and update the UI and UX begins. More advanced prototypes are produced with static HTML to show the responsive nature of design as well.

Prototyping allows you to:

• Test various design features
• Verify basic functionality
• Review creative in a more natural environment (e.g. a browser or handheld device vs a PDF or print out)
• Elicit feedback and refinements
• Identify issues as early as possible before going to production

Additionally, having a prototype will allow the development team to understand better how the site should function allowing them to build a website or app that is not only fit for purpose, but also so that it can be produced and maintained as easily and as cost effectively as possible.

You almost always need to show a working model of your design or idea to someone at some point. Tools like InVision and Marvel make it easy to prototype and collect feedback in a natural digital environment.