What is a wireframe, mockup & prototype?

What is a wireframe?

A wireframe is basically a map to your website. They are meant to be simple,making wireframes a fast tool to get the design going. But there is another concept at play here, which relates to the degree of detail you apply to your website wireframe: the level of fidelity.

What is a mockup?

A mockup is a high-fidelity simulation of how a website or mobile app will look.

What is a prototype?

A prototype is a mid-to-high-fidelity design model of the final UI of your website of mobile product.As well as offering a more detailed look at the visual attributes of your design,prototypes usually include the first user interaction. Sure, you can add some, albeit very limited,interaction in clickable wireframes — where you can click elements on the screen — but with prototypes,you can demonstrate and validate the complete functionality of the design by adding events, animations,variables and advanced interactions. The general idea of a high-fidelity prototype is to represent as close to the final product as possible.