Fra atom til stilikon

Nyheder om Dwarf

Hos Dwarf er vi altid nysgerrige på at tænke processer anderledes. Den nysgerrighed har medført en ny tilgang til udarbejdelse og implementering af visuelt design. Få et indblik i metoden og i hvordan vi har brugt den i praksis.

Internettet har de senere år set en ensartning af design af websites. Websites på tværs af branche låner, inspirerer og tyer til genkendelige elementer i stræben efter den gode intuitive brugeroplevelse. Vi har tidligere skrevet om brugeroplevelsesrevolutioner i form af det usynlige interface, og nu går vi skridtet videre til frontendudviklingen og systematisering af design.   

Her stikker navnligt én mand ud. Selvom efternavnet antyder det modsatte, er Brad Frost et af de varmeste navne inden for webdesign. Grunden til Frosts popularitet skal findes i metoden atomic designs. Med et fast greb om design-nældens rod, har han skabt et mindset for, hvordan de objektive elementer i design kan skilles fra de ofte subjektive tilgange til design.

Atomic design handler i al sin enkelthed om at gøre tilgangen til design ensartet og skalerbar, og konkretisere et begreb, der ofte kan være abstrakt. Metodens systematik betyder samtidig, at struktur og designelementer der allerede er benyttet én gang nemt kan genbruges.

Fra atom til page i 5 trin

Designevulotion

Forestil dig det periodiske system - en kategorisering af elementer. Som en analogi over det periodiske system tegner atomic design et billede af, hvordan design – nærmest som en 5-trins evolutionsproces – kan bygges op af atomer, der danner molekyler, der igen danner organismer. Designet tager derefter form som templates og endelig evulotionens sidste trin: pages.

Og hvorfor så denne metodiske tilgang til design? Blandt andet fordi teknologien dikterer det. I dag findes der et utal af devices med forskellige skærmstørrelser, leveret af producenter, der alle har forskellige tilgange til webdesign. Atomic design er en måde at styre en designproces, så gode arbejdsgange bliver endnu bedre. Så nok har vi at gøre med en metodologi, men ikke et ufravigeligt manifest.

Design i bredt perspektiv

Den indbydende moderne webløsning kræver, at design- og frontendafdelingen på nogle områder deler mindset. Hos Dwarf har Atomic Design bidraget til at bringe design og udvikling endnu tættere sammen.

Det har blandt andet været tilfældet med vores projekt i samarbejde med Forhandlingsfællesskabet og KL, der er gået sammen om videndelingportalen Viden på Tværs (VPT). Her har designer og frontendudvikler arbejdet i takt. Frontendudviklerens atomer i form af knapper, søgefelter mm. er blevet til sideløbende med designerens styletiles og styleguide. Designeren overleverer styleguiden og frontendudvikleren puster liv i templates, så de bliver til pages.

Alt i alt betyder metoden, at vejen fra wireframes til færdige pages bliver kortere. Produktionen kan hurtigere rykkes til browseren, så kunden kan følge med i tilblivelsen, og designet bliver i hele processen set sideløbende fra både et brugerorienteret perspektiv og et udviklingsperspektiv.

Du kan læse mere om Brad Frosts atomic design på hans blog