français
(Le Design System)
anglais
Design System

Un Design System est à la fois une bibliothèque, un guide, et un mode d’emploi documentant les composants graphiques, les patterns, et les visuels employés dans une maquette, un produit, une app, un site web, ou un service. C’est la charte graphique d’un service digital.

Le Design System assure la cohérence visuelle de l’ensemble, tout en évitant de réinventer la roue en documentant comment obtenir et employer les composants. Pour ce faire, il doit être facilement accessible pour les utilisateurs [designers, développeurs, marketing, ...] mais aussi fournir un canal de communication qui permet de faire remonter les questions, d’élucider les ambiguïtés, ou de proposer des suggestions d’amélioration.

Un bon Design System n’est pas, par exemple, seulement un export des ressources de Sketch à partir d’un outil comme Zeplin[1][1] — Voir : https://zeplin.io/, mais un document vivant qui commence par expliquer la philosophie qui sous-tend et guide le tout, suivi d’exemples aussi bien de composants, que d’implémentations et de cas limites. C’est l’équivalent visuel du guide de style [Style Guide] pour la rédaction et l’écriture.

Pour en savoir plus
Atomic Design, Brad Frost, 2016
Getting Started with Design Systems — Part 1, Linn Vizard, Adobe Ideas, 2020
Getting Started with Design Systems — Part 2, Linn Vizard, Adobe Ideas, 2020
Getting Started with Design Systems — Part 3, Linn Vizard, Adobe Ideas, 2020
Laying the Foundations, Andrew Couldwell, 2019
Design System : A Figma publication for design systems creators, designers, developers, and managers, Figma
A comprehensive guide to design systems, Will Fanguy, Inside Design / inVision, 2019

Dernière mise à jour : 2020.09.22