De l'arborescence aux fichiers sources

Un projet de design ne commence pas par une page d'accueil, et il ne se termine pas par une image. Entre les deux, chaque étape produit quelque chose qui se relit, se corrige et se transmet. Les connaître permet de savoir ce que vous recevez, et à quel moment une correction coûte encore peu.

1. 01

   L'arborescence

   Quelles pages existent, comment on passe de l'une à l'autre, ce que le visiteur doit pouvoir faire à chaque étape. Cette structure décide de tout le reste, et c'est la seule chose impossible à rattraper en cours de développement sans tout reprendre.

2. 02

   Les écrans clés

   Dessinés en vraie taille, avec vos contenus réels quand ils existent. Un faux texte de remplissage cache exactement les problèmes qu'une maquette doit révéler : un titre trop long, une liste qui déborde, un formulaire qui décourage.

3. 03

   Le prototype

   Les écrans reliés entre eux, parcourables comme un site. Vous le faites tester autour de vous, et les corrections se font là, pas trois mois plus tard sur du code déjà écrit.

4. 04

   Le système

   Couleurs, typographies, composants et états, documentés. C'est ce qui permet de créer un écran ou un support de plus sans nous rappeler, et sans que le résultat jure avec l'existant.

5. 05

   Les fichiers sources

   Remis, exploitables par n'importe quel développeur ou designer, y compris hors du studio. Une charte de quatre-vingts pages que personne n'ouvre ne protège aucune cohérence ; quelques règles claires, si.

Chaque élément est testé dans ses conditions réelles avant d'être validé : un logo en tout petit et en monochrome, des couleurs à l'écran comme à l'impression, une typographie sur un paragraphe entier et pas seulement sur un titre.