Encore que je ne recevrai le Kbis que ce mois-ci, la société est immatriculée depuis le 25 décembre dernier. Elle se nomme La fée du Net. Cependant, pour l'heure, elle n'a rien à porter. J'accueille ce mois-ci un stagiaire graphiste pour remédier à cela, c'est à dire pour concevoir sa charte graphique.
J'ai procédé à des recherches pour trouver des exemples de charte graphique et des modèles de brief.
L’ergonomie Web a pour but de prendre en compte l’utilisateur final à toutes les étapes de la vie d’un site Web et dans toutes ses dimensions (contenu, graphisme, référencement…).
Pour l’ergonomie, le site web n’a de sens que du point du vue de son utilisateur et de l’usage qu’il fait du site. D'autre part, l’utilisateur n’est appréhendé que dans son rapport au site.
Bertrand Evain, l'ergonome avec qui je travaille sur le projet, tient un blog. Certains de ses articles sont intéressants et je les reprendrai ici. Celui qui va suivre (dont j'ai remanié la forme), traite de l'utilisabilité d'un système informatique, qu'il s'agisse d'un site Internet, d'un logiciel, d'un téléphone…
Il y a quelques jours, après avoir réinitialisé mon navigateur Safari, j'ai dû ressaisir identifiant et mot de passe sur chacun de mes sites accoutumés. Cette fastidieuse expérience m'a fait prendre conscience d'un bénéfice inattendu de l'ergonomie, et qui pourrait bien être un des secrets de l'affection qu'ont les mac users pour leur machine.
Il n'y a guère de doute que pour une poignée de façons de bien réaliser une idée, il y en a des milliers de la gâcher. L'enjeu dans notre cas est d'autant plus grand que le service est nouveau et que c'est un logiciel en ligne : nous créons un usage et, sur Internet, les utilisateurs ne vous laissent votre chance qu'un instant, avant de vous adopter ou de vous rejeter.
Aussi est-il crucial d'adopter une méthode qui limite la perte de temps liée aux tâtonnements, aux discussions sans fin, et balise le chemin vers la bonne formule. Celle de l'ergonome avec qui j'ai travaillé, Bertrand Evain, est d'une remarquable puissance. Cette méthode repose sur deux outils et une philosophie.
Au terme de deux mois et demi de conception, Bertrand Evain (l'ergonome de l'équipe) et moi avons abouti à la maquette fonctionnelle du site. Une maquette fonctionnelle (ou story board ou wireframe ou prototype), c'est la représentation des différents écrans du site. (On peut pour cela utiliser Powerpoint ou un outil professionnel comme Axure)
Avant de passer la main à l'équipe technique, il nous fallait franchir cette étape cruciale : les tests utilisateurs. Pour prendre une image, c'est comme pour un architecte de montrer les plans de la maison qu'il a conçue à de probables habitants avant qu'elle ne commence à être construite (développement) et peinte (graphisme). Si les habitants la rejettent, il n'y a plus qu'à recommencer !
Nous attaquons avec Cécile la charte graphique du site et, en bon ordre, nous commençons par le logo. Ce n'est rien moins, à mon sens, que l'équivalent du nom et du visage pour une personne. L'enjeu est d'autant plus important pour nous que le service est novateur et qu'il sera lancé aussi bien dans les pays francophones qu'anglo-saxons.
Peu après le travail que nous avons conduit avec Bertrand (l'ergonome) sur la page d'accueil, j'ai briefé notre graphiste Cécile.
Quoique je lui aie communiqué notre prototype et en ait développé la logique, je l'ai invitée à ne pas hésiter à s'écarter de nos options si elle le jugeait opportun. Je lui ai en outre indiqué quelques exemples intéressants de page d'accueil en guise de source d'inspiration.
Au terme de quelques jours, elle m'a communiqué une version que je vous laisse découvrir…
Prototype de la page d'accueil : http://bit.ly/13SFx4
Enfin, plus exactement, sa maquette fonctionnelle… Au delà du teasing (de bonne guerre en matière de buzz marketing), ce que je souhaite exposer ici c'est la méthode suivant laquelle Bertrand, l'ergonome de l'équipe, et moi avons élaboré cette page d'accueil.
Inspiré par le bon Defensive Design for The Web, je me propose de photographier au fil de l'eau bonnes et mauvaises pratiques du Web.
Flux commentaires
English version