Atomic Design

Atomic Design je metodika pro budovani systemu komponent uzivatelskych rozhrani, ktera pochazi od designera Brada Frosta. Nazev vychazi z chemie: stejne jako se hmota sklada z atomu kombinujicich se do molekul a organismu, rozhrani jsou budovana z malych, znovupouzitelnych jednotek kombinujicich se do stale slozsitejsich struktur.

Hierarchie ma pet urovni. Atomy jsou nejmensi prvky: tlacitka, vstupy, popisky, ikony. Molekuly jsou skupiny atomu pracujicich spolecne, napriklad vyhledavaci pole kombinujici vstupni pole a tlacitko. Organismy jsou slozitejsi sekce sestavene z molekul a atomu, treba hlavicka webu. Sablony definuji strukturu rozlozeni bez skutecneho obsahu. Stranky jsou konkretni instance sablon s vyplnenym skutecnym obsahem.

Hodnota tohoto pristupu nespociva v nomenclature, ale v discipline, kterou vynucuje. Navrhovani a budovani komponent v izolaci -- typicky v nastrojich jako Storybook -- nuti tymy premyslet o opetovnem vyuziti jednotlivych casti, misto aby resily kazdy ekran jako jednorazovy problem. Udrzovani konzistence pri rustu produktu se tak vyrazne zjednodusuje.

Atomic Design prirozene doplnuje design systemy a knihovny komponent. Kdyz tym sdili stejnou slovni zasobu pro stavebni bloky UI, predavani mezi designem a vyvojem probihaji hladceji a dochazi k mene nedorozumenim ohledne toho, co ma komponenta delat.