Atomic Design

L’Atomic Design est une méthodologie de conception d’interface utilisateur inventée en 2013 par Brad Frost qui s’inspire du design modulaire et qui vise à optimiser la création de Design Systems centrée sur la conception de composants.

Cette méthodologie de conception consiste à décomposer les interfaces utilisateur en éléments de base appelés atomes. Ces atomes sont ensuite combinés pour créer des « molécules » plus complexes, telles que les formulaires, les cartes de produit et les en-têtes de page. Les molécules sont ensuite combinées pour former des « organismes » plus grands tels que les barres de navigation et les pieds de page.

L’Atomic Design aide les designers à construire des Design Systems plus cohérents et plus efficaces en fournissant une approche modulaire pour la conception d’interfaces utilisateur. Cette méthodologie permet également de simplifier la gestion des éléments de conception et de faciliter la collaboration entre les designers et les développeurs.

Particules subatomiques (ions : typographie, couleur, ombre, espacement, couleur) > atome (ex. : élément input d’un formulaire, un label) > molécule (champ email avec son label ) > organisme (composant formulaire d’inscription) > organisme complexe (partie d’un template ex. : header) > page (template) > modèle de page (layout) > module.