Design for helheten, ikke detaljene 25

Starter vi å designe små perfekte detaljer, uten blikk for helhet og innhold, kommer vi til å feile.

Brad Frost på Webdagene 2014
Brad Frost på Webdagene 2014

På Webdagene 2014 snakket Brad Frost om hvorfor «one size fits all»-rammeverk som Foundation og Bootstrap ikke funker særlig bra til å bygge unike nettsider, og hvordan vi kan bygge style guides på en smart måte. Det er vi enig med han i. Han er opptatt av å starte med små «atomer», i form av frittstående elementer (som for eksempel en label, et input-felt eller en knapp), for så å veve dem sammen i molekyler, organismer, maler og deretter nettsider. Vi er usikre på hvor godt akkurat dette funker i praksis.

«Responsiv design» misforstås

Frost har et veldig godt poeng som alle som jobber med web bør ta innover seg: vi må slutte å designe for forskjellige eksakte skjermstørrelser. Det er ikke dét som er responsiv design.

Idéen om at det skal funke på iPhone, opp til iPad og videre opp til iMac (alltid Apple-produkter…) er usmart, og en misforståelse av web som medium. For hva med dingsene som kommer i fremtiden? Og hva med alle de som ikke bruker Apple-produkter? Det ligger i nettets natur at alt flyter. Derfor må vi behandle det som det det er: flytende, ikke statisk.

«Atomic design»

Som alternativ foreslår Brad Frost sin tilnærming til å bygge nettsider, som er konseptet «atomic design.» Brad definerer det slik:

«Atomic design is methodology for creating design systems. There are five distinct levels in atomic design:»

  1. Atoms
  2. Molecules
  3. Organisms
  4. Templates
  5. Pages

Tanken er at man starter med å bygge små «atomer», i form av frittstående elementer (som for eksempel en label, et input-felt eller en knapp), for så å veve dem sammen i molekyler, organismer, maler og deretter nettsider.

Men er det egentlig så lurt å jobbe i den rekkefølgen?

Det blir farlig om vi som designere skal isolere oss og jobbe med små, perfekte atomer og molekyler uten å tenke på hvordan disse skal fungere i samspill med innholdet. Og det blir enda farligere når vi starter med detaljene og tror helheten kan dannes derifra.

Derfor kan vi ikke starte med å lage reglene, de må oppstå av det vi prøver å formidle. Når det kommer til stykket er ikke maler, styleguides og alt det der mer enn et middel for at det som formidles skal få gode forutsetninger. Det bør ikke ligge i sentrum. Man bør ikke starte med det, man bør avslutte med det.

«Stamcelledesign»

Idéen om «Atomic design» er besnærende som metafor på designsystemer. Men hva om vi heller snur dette på hodet: Er det ikke smartere å tenke på helheten som utgangspunkt, for så arbeide frem detaljer ut fra den, basert på innhold og overordnet design? Da kan «stamcelledesign» være en bedre metafor på hvordan vi bør jobbe smart.

Vi er altså ikke sikre på om Frosts tilnærming funker så bra i praksis. Selv om detaljene (atomene) er viktige, så er ikke det stedet man bør starte. Detaljer skal dannes ut i fra en helhet – og de skal tilpasse seg helheten. Metaforisk sett ville det kanskje vært riktigere å se på atomene (detaljene) som stamceller, som skal formes av cellene rundt. Starter vi med noen prinsipper, en merkevare og et konsept kan vi heller la atomene tilpasse seg ut ifra det.

Mo’ content, mo’ problems (to solve)

Gode designere reiser problemstillinger og prøver å løse dem. For å ha problemer å løse må vi skape dem. De oppstår ikke i en styleguide. Ei heller i en sidemal med Lorum Ipsum-tekst, som Frost viste eksempler på. De oppstår når ekte innhold møter design i en helhet.