En design Web, il est courant de rencontrer des expressions comme wireframe ou maquette haute fidélité. Le niveau de fidélité d’une maquette est une échelle qui permet de déterminer à quel point le résultat développé doit ressembler au design. Une maquette basse-fidélité sera donc une ébauche, alors qu’une maquette haute-fidélité représente le produit attendu après le développement.

Un sketch est une ébauche préliminaire dans laquelle le designer peut vouloir identifier différents éléments. Généralement, j’utilise un sketch rapide pour confirmer des hypothèses ou m’assurer de débuter le projet sur une bonne base. Le positionnement des éléments globaux du site (entête, pied de page, titres de premier niveau, navigation) peuvent être validés avec un sketch sur papier. Parfois, il est intéressant de sketcher des interactions comme l’ouverture d’un menu, ou un effet d’animation.

Une maquette basse fidélité (ou un wireframe) permet de mettre en place de manière plus rigide la structure globale de la page. Une grille a été établie pour le projet et les tailles d’écran peuvent maintenant être prises en compte. Les différents niveaux de titres et de textes sont insérés avec du lorem ipsum – ce merveilleux language « de remplissage » bien utile. Les images et icônes sont représentées à l’aide de placeholders, afin qu’on puisse en visualiser les dimensions et les emplacements.

Une maquette haute fidélité est produite pour ajouter des éléments du guide de style et de la marque, les couleurs, textes et images finales sont généralement ajoutées à cette étape. Ce niveau de maquette est souvent plus long à produire, et le plus sujet à être modifié plusieurs fois. Dans la méthode de développement traditionnelle (waterfall), cette maquette est approuvée, parfois par plusieurs niveaux de gestion, qui auront tous une opinion sur son contenu.

Pourtant, la plupart des projets ne nécessitent pas de produire tous les écrans en maquettes haute fidélité. En fonction de l’équipe, de la cohésion entre le designer et le développeur et de leurs niveaux d’expertise, il est important de doser et de choisir les pages qui seront plus détaillées au design. Parfois, un prototype ou une maquette haute fidélité sont nécessaires pour bien transmettre l’idée et l’interactivité de la page – par exemple, dans le cas d’une navigation qui sort de l’ordinaire. Souvent, seulement quelques pages critiques sont produites en haute fidélité et les autres sont interprétées par le développeur à partir de maquettes basse fidélité, de sketchs, d’indications écrites ou verbales et du guide de style.

Avant de demander à votre designer de produire l’ensemble des pages de votre futur site en maquettes haute fidélité, prenez le temps de discuter avec votre équipe de ses besoins et de ses attentes. Quels sont les éléments plus innovateurs ou pour lesquels une précision plus grande est nécessaire, et quels sont ceux à interpréter à partir d’un dessin papier et d’une conversation? Votre développeur est-il prêt à travailler à partir de maquette basse fidélité? Et vous, êtes-vous prêt à embrasser cet aspect de la méthode Agile en ne visualisant le résultat final qu’une fois développé?

Leave a comment

Votre adresse de courriel ne sera pas publiée. Les champs obligatoires sont indiqués avec *