Although wireframes are essential to the design process when building a website or software, they are no longer sufficient. We’ll explain why in a second but first, let’s get down to a bit of IT history.
Wireframes: a short history
Way back in the early days of IT, if someone wanted to build a website or an app (of any type), putting things on paper was the first thing professionals did to envision and define their project. But soon, clients asked for more than mere sketches and mockups. IT consultants thus started using Powerpoint to show the overall software design or the pages of a website. Clickable wireframes, meaning a short interactive version of an app, was obviously the next step (this is why so many wireframes have this ‘sketchy‘ design).
However, in the current era of the web 2.0, dynamic websites or RIA, static wireframes just don’t cut it anymore. Conditional navigation, rich interaction, database, changing content… IT products are increasingly complex and ‘low-fidelity’ wireframes don’t represent the final app or website.
Wireframes are dead, long live prototypes! Well, that’s what we’re hearing, anyway. So what’s next then? They’re called high-fidelity prototypes: ‘high-fidelity’ because they have the same look and feel as the final product, ‘prototypes’ because they are fully functional versions of the final product.
Now, you could argue: why bother with a hi-fi prototype if it’s the same as the final output? Well, although a prototype is, for end users, virtually identical to the final product, it is not the same as most prototypes are made with HTML only, and not with the same code and programming that will be implemented later. But again you could say: what’s the point in preparing something so similar to the end product? Well, a hi-fi prototype is useful for several reasons:
- Communicate effectively with your clients (who are not always IT literate)
- Define specifications concretely
- Carry out user testing
- Visualize apps and see their limitations
- Follow up & visualize changes throughout all processes
- Gauge technical feasibility, or
- Simply sell an idea
How to prototype
Once you’re done with paper mockups, you can start to build an HTML prototype. However, this can be a tedious, time-consuming job and might not be useful if you’re building an interactive application or a dynamic website. The best way to move forward is using a high-fidelity wireframing tool. Justinmind allows you to create fully functional dynamic and interactive prototypes without any coding. Using a prototyping tool will let you design, add rich interactions, integrate real data, create conditional navigation, build diagrams and navigation flows, generate specification documents and even carry out remote user testing.
So, what are you waiting for? Get prototyping!