What Is A Website Prototype?

Matthew Smith avatar



A striking number of companies do not complete any prototyping when building a website or app. For some companies, they even go straight from idea to code/development – without any design, user testing, or prototyping. So, if you’re planning a new website and want to know what prototyping is you’ve come to the right place!

What Is A Website Prototype?

When we say the word “prototype”, we mean a mockup or demo of what your website (or part of it) will potentially look like when it goes live. Typically, when people talk about prototypes they are referring to the interactivity. Allowing the user to navigate from page to page and test out functionality that may be on the live website such as drop-down menus, buttons and carousels.

On the other hand, a “wireframe” is not interactive and is typically a low-fidelity sketch. They are used for layouts and to give rough sizes of specific page elements and site features.

Should I Prototype?

YES, everybody should prototype! Web designer, developers, business owners, UI/UX designers – everybody! However, some people are more creative and skilled than others in this process – but it’s more about understanding what you want to achieve from the website rather than the design. There is a lot to be gained from prototyping, and many of the tools used today such as InVision, Figma and Adobe XD are easy to use and have free plans.

Why Are Prototypes So Important?

Prototypes are important for many reasons. Essentially, a website prototype allows stakeholders in the project to visualise the website from an early stage. Visualising the website allows for stakeholders to give feedback on the prototype and highlight areas that they like or more importantly do not like. Saving the company both time and money later down the line. A lot of the time you will hear people saying “we don’t have time to be making a prototype” – When it’s the other way around!

Final Thoughts

A lot of people ask why they should spend time and effort creating a prototype when you can just go straight into the development of a website. Every project is different, but it’s easier to make changes before the development process has begun and you’ll save time and money in the long run.