What is a website prototype?
A prototype, in terms of web design, is an interactive mockup of your web design. While it may not have all the bells and whistles of a final website build, it can give you a really good idea of the functionality, user journey and flow through a website. A website prototype is essentially a high-fidelity visual version of the site that allows you to link between screens and demonstrate how the website would work before going to build.
Why do we create website prototypes?
Creating website prototypes is useful in many ways. Most importantly, a prototype allows a user to interact with the website almost as it would behave when built. While it may not include any animation or transition styles it does operate on a basic level to let the user navigate and interact with certain elements on the site.
Can I prototype wireframes or do they have to be high-fidelity?
Depending on the complexity level of the website, it can be beneficial to prototype at an early wireframe stage, even if this is just for the designers benefit. In some cases, working with flat visuals can blind a designer to some areas of navigation and functionality that could benefit the design. Working with wireframe prototypes can help identify areas of improvement at a very early stage of design, thus saving time later on when working with high-fidelity visuals.
What are the benefits of prototyping?
Prototyping is hugely beneficial in the design process as it allows us to save a lot of time early on in a web project. Identifying areas for improvement during the design stage is a lot easier to rectify than finding out these problems once the site has gone into development. Prototyping is also beneficial to show users who may not understand flat visuals as easily as an interactive version of the site.
Should I create a prototype of my website?
Now this question is a bit of a difficult one, but in most cases, I would say ‘yes’. Prototyping can be done is so many different ways that it’s become a hugely easy task to complete and can be executed for free. If you think you or your users would benefit in any way from a website prototype then I’d urge you to give it a try!
What tools can I use?
There are a lot of tools out there to help you create your website prototype.
Online and software options include (but are not limited to):
- Invision (Fifteen’s preferred prototype tool)
- Origami
- Webflow
- Marvel
- Vectr
- Sketch
- Balsamiq (for wireframe prototyping)
- Axure
However, prototyping can also be achieved in more basic ways like using Powerpoint or creating PDFs, and even away from the screen by using paper sketches.
At Fifteen, almost all of our web projects are reviewed through prototyping, by both our team, clients and in some cases through online user testing. This way we get the most beneficial feedback possible in order to produce the best product we can.
If you’re looking to start a new web project, look no further. Get in touch with Fifteen today on 0115 932 5151 or email [email protected]