Introduction
Chaque site internet, application ou autre projet nécessite un plan. Un peu comme un architecte réalise le plan de sa maison avant de la construire. Le wireframing consiste à définir en détails chaque zone du site. Il intervient en général après le zoning et permet de définir les composants d’une page sous forme de croquis.
Il est important de garder en tête les objectifs du site et les différents flux de navigation pour les atteindre.
Le wireframing est utilisé pour définir la structure finale des différents types de pages (header, menu, footer, corps de pages, boutons). Il permet aussi d’aider à formaliser les attentes, les besoins et objectifs, d’obtenir des feedbacks et de détecter les problèmes d’utilisabilité. C’est à partir de ce document que travaillera le designer visuel afin de concevoir l’apparence finale du site.
Méthodologie
Le but est de décrire le plus précisément tout écran en faisant abstraction des considérations graphiques (typographie, couleurs, etc.).
Ce travail doit répondre à chacune des 12 règles ergonomiques suivantes tirées du livre Ergonomie du Web d’E.Sloïm, 3e édition.
Architecture : le site est bien organisé
Organisation visuelle : la page est harmonieuse
Cohérence : le site capitalise sur l’apprentissage interne (il faut rester cohérent dans les choix fait par rapport au site pour permettre à l’utilisateur de se façonner un modèle mental solide.)
Conventions : le site capitalise sur l’apprentissage externe (l’utilisateur n’est pas novice dans la navigation et il va essayer d’appliquer ses connaissances concernant d’autres pages au vôtre.)
Information : le site informe l’internaute et répond à ses besoins
Compréhension : les mots et symboles sont choisi minutieusement
Assistance : le site aide et dirige l’internaute
Gestion des erreurs : le site prévoit que l’internaute se trompe et propose des alternatives
Rapidité : l’internaute ne perd pas son temps et arrive rapidement à son but
Liberté : c’est l’internaute qui commande
Accessibilité : un site facile d’accès pour tous
Satisfaction de l’internaute : l’utilisateur atteint son but et trouve ce qu’il cherche.
Points importants à prendre en considération
Le wireframe est un outil utile car il permet de mettre en place tous les éléments. Le tester permet de se représenter le projet avant d’aller plus loin. C’est aussi un gain de temps pour le reste de la team travaillant sur le projet (designers et développeurs). Si l’on définit les éléments à cette étape (tôt dans le projet) c’est pour avoir un gain de temps et d’argent.