* Webdesign Annecy-le-Vieux

Webdesign Annecy-le-Vieux

Article:

Le Wireframe (ou maquette fil de fer) en web design a pour objectif de réaliser un schéma présentant les zones d'un site Web, ou d'une page Web. Une personne non technique peut le réaliser. Pour Jakob Nielsen, le maquettage wireframe correspond à du prototypage horizontal1, c'est-à-dire au développement de la partie graphique de l'interface homme-machine. Il permet : La confirmation de la satisfaction des exigences de l'interface utilisateur et des possibilités du site web ; La simulation du fonctionnement a priori du site web selon les objectifs de départ ; Une première estimation du temps et du coût de développement.
Pour ce qui est du site web, une première forme de maquette statique permet de définir le « zoning » des écrans, c'est-à-dire le découpage des pages du site. Les types de page sont: page d'accueil, page intérieure, chapeau de rubrique, etc.) Les différentes zones de la page sont identifiées par le concepteur qu'il schématise à l'aide de blocs ou de boîtes afin de déterminer les grandes fonctionnalités et les zones principales du contenu. Il précise le rôle et la position de chaque zone et définit leur taille relative ainsi que leur importance visuelle2. Le concepteur peut apporter des précisions claires sur les éléments de la page comme la hiérarchisation des différents textes, les dimensions en pixel des contenus, etc.
La base au travail du graphiste reste le zoning. Sa mission est d'habiller les différentes zones de l'écran ainsi déterminées en fonction de l'identité visuelle du produit. La maquette fil de fer peut faciliter la discussion avec les commanditaires du site web, mais également pour réaliser des tests utilisateurs. Il est possible également d'insérer des liens sur certaines parties de la maquette informatisée afin de permettre de naviguer entre les écrans et donc de vérifier l'ergonomie du système de navigation proposée voire de certaines modalités d'interaction. On le qualifie alors de prototype. Bien que le passage par le maquettage papier soit encore une technique courante, il devient de plus en plus fréquent d'utiliser des logiciels dédiés ou déviés de leur fonction d'origine
LES OUTILS
Pour réaliser un Wireframe les outils nécessaires sont une feuille, une gomme, et un crayon de papier. Sans blague ! Pour améliorer, vous pouvez ajouter plusieurs feuilles, et des ciseaux. Vous pouvez ainsi positionner les éléments (des rectangles de papier) sur votre page Web virtuelle (une feuille). Il existe cependant une multitude d'outils informatiques, plus ou moins perfectionnés, permettant le travail collaboratif ou non, en-ligne ou hors-ligne...