Créer une plateforme est un travail assez méticuleux. Il exige en réalité une parfaite maîtrise des notions telles que le wireframe, le prototype et la maquette. Que recouvre chacun de ces concepts ? Quelles sont les différences à noter entre ces concepts?

 

Qu’est qu’un Wireframe ?

Le wireframe est aussi appelé zoning ou mock-up. Il s’agit de la maquette de fil de fer ou la maquette fonctionnelle. C’est la représentation visuelle de l’interface de la page internet ou web. Il est utilisé pour déterminer les composants et les zones de la page web sous la forme d’un croquis. C’est une étape du prototypage. Créer un site internet ou une application mobile est un projet qui nécessite une planification méticuleuse. Le wireframing est une étape située entre le cahier des charges et la réalisation des différentes maquettes graphiques. Il est parfois omis dans la conception de projet informatique ; ce qui entraine des conséquences fâcheuses. C’est l’exemple de la mauvaise ergonomie du site internet, des coûts révisés souvent à la hausse ou la mauvaise évaluation de l’échéancier.

 

Dans quel cas peut-on utiliser un Wireframe ?

L’utilisation du wireframe s’effectue en réalité avant toute élaboration de maquette graphique. Son utilisation s’inscrit dans la recherche efficiente d’ergonomie à travers la définition de la structure finale des pages web : menu, header, slider, footer, corps de page, images, niveaux de titres, boutons, formulaires ou call-to-action. Le wireframe permet d’évaluer de manière concrète tout ce qui fonctionne en termes d’expérience utilisateur. Les différentes annotations définissent dès lors les fonctionnalités de la future plateforme.

 

Qu’est qu’un prototype ?

Le prototype est le modèle original d’une plateforme. Il présente les différentes qualités techniques ainsi que les caractéristiques de fonctionnement du site web. C’est un exemplaire incomplet d’un site internet qui matérialise l’étape d’évolution du projet.

 

Dans quel cas peut-on utiliser un prototype ?

Le prototype est utilisé pour démontrer ou pour infirmer le bien-fondé d’une composante d’un site web. Il est réalisé souvent en un ou plusieurs exemplaires afin de faciliter les tests unitaires. Il permet de valider les choix réalisés pendant la conception du projet.

Pour plus d’informations sur les cas ou l’on peut utiliser des wireframes : consultez cette page

 

Qu’est qu’une maquette ?

La maquette a une valeur de prototype virtuel. Le maquettage ou Wireframing est une étape cruciale dans le processus de la conception d’une interface. Il offre l’opportunité de définir en principe la hiérarchie au niveau de l’information pour ce qui est du design afin d’élaborer la mise en page plus facilement. C’est un simple wireframe qui ressemble concrètement à un plan d’architecte.

 

Dans quel cas peut-on utiliser une maquette ?

La phase prototype peut être précédée éventuellement d’une phase de maquettage ou de modélisation.

 

Quelles sont les différences entre wireframe, prototype et maquette ?

Le zoning en ergonomie permet de faire un schéma grossier d’une page internet grâce à l’usage de blocs. Cela permet de présenter brièvement l’emplacement des différentes zones de contenu ainsi que des grandes fonctionnalités. Cette étape débouche sur le wireframe ou maquette fil de fer. Les contenus tels que les textes, les vidéos ou les images sont mieux précisés. C’est un meilleur outil de communication avec le client afin qu’il se projette dans le travail et valide finalement les fonctionnalités. Le but est d’éviter la rédaction biaisée du cahier de charges. Le mockup transforme la wireframe en une page interactive. A cette étape, on peut ajouter des liens pour présenter les différents principes de navigation. Il est encore appelé le wireframe au format HTML. Le prototype vient valider les technologies qui assurent le fonctionnement du projet. La maquette est la dernière étape qui présente le visuel du prototype.

 

Un outil de wireframing ? il en existe plein et des gratuits dont celui ci : https://www.weld.io/

 

Dans tout projet digital, l’ergonomie s’avère être un élément fondamental. On est confronté aux concepts tels que le zoning, le wireframe, le mockup, le prototype ou la maquette. L’étape de la conception des interfaces se réalise au début de tout projet et se poursuit le long du projet.