Wireframes are all but a clear notion in the web design world. When it comes to the design process of any IT project, several notions comes into mind like wireframe, design, sketches, prototypes. After reading an article on sketches and wireframes in UXmatters, I thought it’d be a good idea to put these blurry notions back in their current context of new technologies… hence methodologies.

At a time when technologies (web2.0) and devices (mobiles, tablets…) are exploding, wireframes, design and prototype are merging together slowly but surely. But first let’s have a look at these blurry notions and see how they are coming together in the creative process.

Wireframing the design

A wireframe is often understood as the first step into designing a future app or website. It usually consists of a rough sketch, usually hand-drawn, of the user interface. Its main purpose is to throw out ideas and design “directions”. Hence, it has to be “fluid” and disposable to be changed quickly. A wireframes is a team work by definition. Everyone has to be invited to provoke ideas and directions. It primarily focuses on communicating concepts and structure. Thus it doesn’t include details as these are left to design.

Designing the app and its interactions

Although I separated design from prototypes, these two processes often go hand in hand. After they have gone through different ideas and concepts, designers usually start designing their future website. But with the coming of the web 2.0 and the growing importance of functionalities, the design has to be functional and tested among users and on different devices (desktop, web, mobiles…) in order to be validated. Testing their design before implementing it is one of the reasons why more and more IT companies have started using functional prototypes.

Prototyping and the web 2.0

If wireframing is all about suggesting and exploring, Prototyping has a lot more to do with validation. Moreover, with the coming of the web 2.0 and new devices like mobiles and PC, the focus was put on interactions and dynamism. And apps have now to be crossplatform, taking into account a wide range of devices (mobiles, pocket PCs, tablets…). That’s why prototypes came into being as IT professionals realised that making changes to a final product was a lot longer and expensive than changing a inexpensive functional prototype. Very close from the final application, functional prototype are made to make the final user tests. From design to functionalities, Business rules and requirements, an application prototype has to include them all in order to get the validation and start the development process.

The agile method bringing them together

Now a days, apps are born and live in a very competitive world. In order to prepare them for success, the design and user experience processes have to be carefully orchestrated. So rather than separate all these processes, companies tend to merge them to get a more agile creative process. Some even go as far as using prototypes for both designing and developing processes in order carry out user tests, operating and visualising the changes that will have to be done on the fina