Design
system.
Un design system, c'est une charte qui s'exécute. Là où le document PDF décrit des règles que chacun applique à sa manière, le système fournit les composants réels, utilisés directement par les designers et les développeurs. Les écarts deviennent impossibles plutôt qu'interdits.
Le Studio définit les principes, le Lab construit et documente la bibliothèque. Jetons de couleur et d'espacement, composants d'interface, états, règles d'assemblage.
C'est un investissement, pas une dépense de confort. Il devient rentable dès qu'une équipe produit plusieurs interfaces, ou qu'un même produit vit plus de deux ans.
Des décisions, transformées en pièces.
Le système part des jetons, les plus petites décisions, et remonte jusqu'aux composants assemblés. Chaque niveau s'appuie sur le précédent, aucun ne le contourne.
Jetons de design
Couleurs, espacements, tailles, rayons, ombres, durées. Les plus petites décisions du système, nommées une fois et référencées partout.
Bibliothèque de composants
Boutons, champs, tableaux, navigation, messages. Avec tous leurs états : survol, actif, désactivé, chargement, erreur.
Règles d'assemblage
Comment composer une page à partir des pièces. C'est ce qui distingue un système d'un simple catalogue.
Documentation
Quand utiliser quoi, et surtout quand ne pas utiliser. Consultable en ligne, à côté du composant réel.
Synchronisation design et code
Les mêmes jetons dans les outils de maquette et dans le code. Sans cela, les deux mondes divergent en trois mois.
Gouvernance
Qui peut ajouter un composant, comment, et sous quelle validation. Un système sans règle d'évolution se dégrade en bibliothèque de doublons.
Partir de l'existant, pas de la page blanche.
Nous commençons par inventorier ce qui existe déjà. Dans presque tous les cas, on découvre onze gris et sept boutons différents : c'est le meilleur argument pour lancer le chantier.
Inventaire
3 à 5 joursRecensement des couleurs, tailles et composants réellement utilisés dans vos interfaces. Le constat est en général sans appel.
Jetons
3 à 5 joursRationalisation et nommage. Onze gris deviennent quatre, chacun avec un usage défini. C'est la fondation de tout le reste.
Composants
2 à 4 semainesDessin puis développement, état par état. Chaque composant est livré avec sa documentation et ses cas d'usage.
Documentation et mise à disposition
1 semaineSite de documentation, bibliothèque installable, exemples. Un système que personne ne trouve n'est pas utilisé.
Gouvernance
3 à 5 joursRègles d'évolution, rôles, processus de validation. Puis accompagnement des premières contributions de vos équipes.
Une bibliothèque, et ses règles de vie.
Ce qu'on nous demande avant de commencer.
À partir de quand un design system est-il rentable ?
Dès deux interfaces à maintenir, ou un produit destiné à vivre plus de deux ans. En dessous, une charte bien faite suffit et coûte beaucoup moins cher. Nous vous le dirons si c'est votre cas.
Quelle différence avec une charte graphique ?
La charte décrit, le système exécute. La charte dit quelle couleur utiliser, le système fournit le composant déjà à la bonne couleur. L'un se lit, l'autre s'installe.
Faut-il refaire nos interfaces existantes ?
Pas d'un bloc. Le système s'applique progressivement : les nouveaux écrans d'abord, les anciens au fil des évolutions. Une migration totale et immédiate est le meilleur moyen de bloquer toute la production pendant six mois.
Qui maintient le système ensuite ?
Vos équipes, avec les règles de gouvernance que nous posons ensemble. Nous pouvons rester en appui les premiers mois, le temps que les premières contributions internes se fassent.
Cela n'uniformise-t-il pas trop les interfaces ?
Un système bien conçu libère au contraire du temps : les décisions triviales étant prises une fois, l'attention se reporte sur ce qui est réellement spécifique. L'uniformité subie vient des systèmes trop rigides, pas du principe lui-même.
Onze gris différents dans un produit, c'est un système qui manque.
Montrez-nous vos interfaces actuelles. L'inventaire suffit en général à trancher.
75001 Paris