Why prototyping should be an extension of designing ?


You can make a prototype in every design project, but why should we lose time to make something close to the developed product if we already made the « design » ? First of all, let’s take a step backward to understand how prototyping and designing are intimately linked.

Designing generally follows a well known process, but incomplete most of the time. We think about what the user who’ll see our design wants. For example, in an e-commerce app, the user usually wants to buy stuff. When we know what the user intend to do, we build a path that will lead him/her to the main goal. So, we must find out what kind of product he wants, then facilitate his/her purchase by putting all the information needed (name, mail, bank details…). Upon that, we must entertain that person by adding some « beauty » to the design : classify categories by color, put some nice icons that make sense for the customers (for example : a trash can for deleting etc) . When you’ve achieved those parts, you can be proud of what you’ve done but your design is not yet finished.

This is where prototyping takes all its sense.

From UX to UI

Designing the flow, then add colors, images, fonts… From there, prototyping offers a vaste range of possibilities.

Prototyping allow anyone to see what could be the final product

Here are two different examples made from the screen above.

Animating make sure you dot your I’s and cross your T’s

Although prototyping can already seems pretty useful, there’s more. With a prototype you can test if your design meet to the user’s expectations. A lot of prototyping tools have emerged recently like Invision, Flinto, Principle, Framer.js or even the Facebook tool Origami.

I’ve only test Flinto so far but I’ll test some others to weigh the pros and cons. With Flinto you can make a simple and quick prototype and with some imagination there’s no limit to what you can animate !

Examples of Flinto prototypes

To conclude, with prototyping you can truly create a bridge between developer and designer. No more animation created on the fly, test your design before the development, it can only do you good !

Thanks for reading !