Atomic Design - Was ist das? Webdesign Agentur Sandstein Neue Medien informiert.

Was ist Atomic Design?

Atomic Design bezeichnet eine Methode, mit der man Design Systeme kreieren kann. Für die Beschreibung seines Baukastensystems bediente sich der Erfinder des Gestaltungsansatzes, Webdesigner Brad Frost, einer Analogie aus der Chemie.

Die Bausteine im Atomic Design

Beim Atomic Design wird, wie der Name schon sagt, das Design in seine Einzelteile zerlegt. Das Atom, also der kleinste Bestandteil einer Weboberfläche, entspricht z.B. einem HTML-Tag. Verbinden sich mehrere Atome, entsteht ein Molekül. Kombiniert man etwa Label, Input und Button, ergibt sich daraus das Molekül Suchfeld. Die nächste Stufe ist der Organismus, eine bereits komplexe Teilstruktur einer Seite wie ein Header oder Footer. Aus mehreren Organismen entsteht ein Template, also eine Vorlage, die dann mit Inhalten gefüllt werden kann.

Welche Vorteile hat Atomic Design?

Brad Frost hat vielleicht nicht das Rad neu erfunden, aber schon allein die Begrifflichkeit lenkt die Aufmerksamkeit darauf, wie wichtig besonders die kleinsten Bestandteile im Webdesign sind. Die Vorgehensweise geht daher Hand in Hand mit dem Responsive Design.

Die Vorteile des Baukastensystems sind für den User der Seite nicht sichtbar – für Entwickler und Admin aber entscheidend. Nicht nur, dass Atomic Design für Konsistenz im Aufbau der Website sorgt, auch die Erweiterung um neue Bausteine ist möglich, ohne das bestehende Template zu beeinflussen. Besonders wenn mehrere Softwareentwickler zusammenarbeiten, hilft das Baukastensystem bei der Verständigung zum Codeaufbau.

Ihr Ansprechpartner in Sachen Webdesign

Susanne Aurin

Susanne AurinLeiterin Grafikdesign