Why wireframes belong to the past

[Etienne]

Yes, although wireframes are essential before building a website or a software, but they are now obsolete. I´ll tell you why in a second but first, we should do a bit of IT history.

Wireframes: a short history

At the beginning of (IT) times, if somebody wanted to build a website or an app (and this goes for any products made by men), putting things on paper was (and in many case still is) the first thing professionals did to think 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).

…Long live wireframes

However, in the era of the web 2.0, dynamic websites or RIA, static wireframes just don´t make it anymore. Conditional navigation, rich interaction, database, changing content… IT products are increasingly complex and small “low-fidelity” wireframes doesn´t cover the vast majority of the final app or website.

High-fidelity prototypes

Wireframes are dead, long live wireframes! 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.

Why bother?

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 exactly like it as most prototype are only HTML version. The final out and thus not made with the same technologies that will be implemented later. But again you could say: what´s the point in preparing something identical to the end product? Well, a hi-fi prototype is useful for several reasons:
- communicate effectively with your clients (often non IT literate)
- concretely define specifications
- carry out user tests
- visualize apps and see its limitations
- follow up & visualising changes through all processes
- gauge technical feasibility
- or simply sell an idea

How to prototype

Well, once you´re done with paper mockups, you can start to build an HTML prototype. However, this is a tedious, time-consuming job (you need to code) and this will not be useful if you´re building an interactive application or a dynamic website. The best way to do this is using a high-fidelity wireframing tool (i.e. Justinmind Prototyper). This kind of tool lets you create fully functional dynamic and interactive prototypes without any coding. Using a prototyper will let you design, add rich interactions (Jquery-like), integrate real datas, create conditional navigation, build diagrams (i.e. navigation flows), generate specification documents and even carry out remote user tests.

Basically, it does it all for you, mockups, wireframes and high-fidelity prototyping. From conception to design, simulation and testing, it does it all so that you will be well prepared for the hard bit… development!