Glossaire

La part du produit et des équipes qui utilisent réellement le système. C’est la mesure qui compte : un design system peu adopté coûte sans rapporter.

Une méthode de Brad Frost pour organiser une interface en niveaux : atomes, molécules, organismes, gabarits, pages. Utile pour penser la composition, moins pour nommer les composants au quotidien.

Les composants réutilisables du système, dans Figma et dans le code : bouton, champ, carte, menu. Elle n’est qu’une partie du design system ; sans règles ni gouvernance, elle reste une collection.

La conception de l’identité d’une marque : ce qu’elle dit et comment elle se reconnaît. Logo, couleurs, typographies, ton et règles d’usage, pensés pour tenir sur tous les supports.

Une évolution qui oblige les équipes à modifier leur code ou leurs fichiers : un composant renommé, une propriété supprimée. Elle s’annonce, se documente et passe par une version majeure.

Le document qui décrit l’identité visuelle et ses règles d’usage. Pensée pour la communication, elle doit être traduite en rôles et en tokens pour servir un produit numérique.

Le rapport de luminosité entre un texte et son fond, défini par les règles d’accessibilité WCAG. Le niveau AA demande 4,5:1 pour du texte courant et 3:1 pour du grand texte.

La proportion d’écrans ou de composants d’un produit construits avec le design system. Suivie chaque trimestre, elle montre si l’adoption progresse.

L’ensemble des décisions, des composants et des règles qui permettent à plusieurs équipes de construire des interfaces cohérentes. Il réunit des fondations (tokens), une bibliothèque de composants en design et en code, une documentation et une gouvernance.

Les plus petites décisions de design, nommées et stockées une seule fois : une couleur, une taille, un rayon, une durée. Le même token alimente Figma et le code, ce qui garde les deux alignés.

Le travail qui permet aux designers de faire leur travail : outils, process et communauté organisés pour que le design avance vite, de façon cohérente, et soit adopté par le reste de l’entreprise.

Une documentation générée ou tenue à partir du système lui-même, avec des exemples réels et à jour. Elle dit quand utiliser un composant, quand l’éviter, et comment il se comporte.

Le format JSON standard des design tokens, publié par le Design Tokens Community Group du W3C. Il décrit chaque token avec sa valeur et son type, et permet de les échanger entre outils.

La liste courte des tailles de texte autorisées, avec leur interlignage et leur graisse, du titre à la légende. Cinq à sept niveaux suffisent dans la plupart des produits.

Les règles qui disent qui décide de ce qui entre dans le système, comment on contribue et comment il évolue sans casser. Sans elle, un design system se fragmente dès que l’équipe grandit.

La partie visible de la marque : logo, palette, typographies, images, formes. Elle devient un système quand ses règles sont écrites et traduites en tokens.

La liste datée de ce qui a changé à chaque version. C’est le premier outil de confiance d’un design system : les équipes savent ce qui bouge et quand.

Le degré auquel un système est structuré, gouverné et adopté. On l’évalue généralement sur plusieurs axes : fondations, composants, gouvernance, adoption.

Le process écrit par lequel une équipe propose un nouveau composant ou une évolution : demande, revue, construction, publication. Il transforme les demandes informelles en améliorations du système.

Un espace colorimétrique (luminosité, chroma, teinte) où des écarts de chiffres égaux donnent des écarts perçus égaux. Il sert à générer des gammes de couleurs régulières, prises en charge en CSS.

Une personne par équipe ou par entité qui fait remonter les besoins et redescendre les nouveautés. Le réseau de relais est souvent ce qui fait passer un système d’outil à pratique partagée.

L’endroit unique qui fait foi pour une décision : un fichier de tokens, une bibliothèque, une page de documentation. Quand il y en a deux, elles finissent par diverger.

Un jeu de valeurs pour les tokens système : clair, sombre, contraste élevé ou autre marque. Les composants ne changent pas, seule la correspondance entre rôles et valeurs change.

Le troisième niveau : les valeurs propres à un composant, comme le fond du bouton principal. Ils pointent vers des tokens système et permettent d’ajuster un composant sans toucher au reste.

Le premier niveau de tokens, aussi appelés primitifs : la palette brute (bleu 600, gris 100, 16 px). Ils disent ce que vaut une valeur, pas à quoi elle sert, et ne sont pas utilisés directement par les composants.

Le deuxième niveau, aussi appelé sémantique : des rôles comme « fond par défaut » ou « couleur d’action », qui pointent vers des tokens de référence. C’est à ce niveau qu’un thème sombre ou une deuxième marque change les valeurs.

Une déclinaison prévue d’un composant : taille, style (principal, secondaire), état (survol, désactivé). Les variantes limitent les choix possibles à ceux qui ont été décidés.

Une convention de numérotation en trois chiffres, majeur.mineur.correctif. Le premier change pour un changement cassant, le deuxième pour un ajout, le troisième pour une correction.