Atomic Design

Atomic Design ist eine von Brad Frost entwickelte Methode zur Verwaltung und Systematisierung von User-Interfaces.

Es wird dazu genutzt, um Design-Systeme zu erstellen.

Diese Methodik gibt uns die Möglichkeit, (vom Abstrakten zum Konkreten) konsistente und skalierbare Design-Systeme zu erstellen.

Es gibt fünf unterscheidbare Ebenen im Atomic Design: Atoms, Molecules, Organisms, Templates und Pages.

Design-Datei aus Figma-Community zum Thema „Atomic Design“ –> https://www.figma.com/community/file/1214888616626709424/atomic-design-approach-newbie-academy

YT-Video über Atomic Design –> https://youtu.be/Yi-A20x2dcA?si=fjdSZxcT1ztYmyY7

Ein Atom ist ein kleinstmögliches Objekt wie, z.B., Labels, Buttons, Textfields etc.

Moleküle: Newsletter-Anmeldung, Login für eine App oder andere Gruppierungen von Atomen.

Organismen sind Gruppen von Molekülen, die zu einem relativ komplexen Objekt innerhalb eines Interfaces verbunden werden.

Templates sind Vorlagen, die hauptsächlich aus Gruppen von Organismen, die zu Seiten bzw. kompletten Views zusammengefügt werden.

Pages sind Seiten, oder eher als Instanzen von Vorlagen zu verstehen.