Atomisk design – hvordan bygge skalerbare komponentbiblioteker

Fra atomer til organismer

Brad Frosts atomiske designmetodologi deler UI-komponenter inn i fem nivåer: atomer, molekyler, organismer, maler og sider.

Atomer er de minste UI-elementene: en knapp, et inputfelt, en overskrift, et ikon. Molekyler er kombinasjoner av atomer – et søkefelt med ikon og knapp. Organismer er mer komplekse strukturer, som en header med logo, navigasjon og søk. Maler definerer layout uten reelt innhold. Sider er ferdige instanser med faktisk innhold.