Kontant tale værdsættes af læserne:

– Jeg gider ikke holde en masse kaffe-møder. Og jeg gider ikke betale for dem. Jeg vil se resultater, og jeg vil se dem hurtigt. Kan I klare det?

Marketingchef Allan Helleskov Kleiner fra Fitness World er no-bullshit-typen. Tak for det. Manden skulle bruge et nyt website og var ude efter en matchende leverandør.

Det nye design fra Loft37 var næsten på plads, nu var det tid at få det omsat til kode. Der skulle forresten også lige udvikles et nyt Drupal-site, som skulle integreres dybt med Fitness Worlds egne systemer. Og marketingchefen vidste godt, det ikke var “bare lige”.

Men han pressede på:

– Hvor hurtigt kan jeg se resultater, spurgte han utålmodigt. Er en uge hurtigt nok? svarede leverandøren med et smil. Og sådan gik det til, at Fitness World fik en frontend i Atomic Design.

Konsistent design

Atomic Design er en metode til at sikre et konsistent design af websider.

Designet brydes ned i dets mindste elementer, fx farver, fonte og former (som i "formen på en knap", red.). De mindste elementer kaldes for atomer, og bygges i HTML en gang for alle.  

Atomerne bruges til at lave molekyler, som er mindre enheder – fx en knap, der består af atomerne form, farve og en font til tekst.

Molekylerne sættes igen sammen til organismer, fx en header, og organismerne bruges så til at bygge fx de sidetyper, der benyttes i det daglige arbejde med at publicere på et website.

Allan Helleskov Kleiner kendte godt principperne. Men han vidste også, at de er svære at overholde i praksis.

– Designere er jo kreative mennesker. De er af natur bedre til at følge deres hjerter end en nøje fastlagt plan. Derfor har de det med hele tiden at lave små ændringer, og så har vi balladen, siger han.

Benhård styring

Hos Peytz & Co er de vilde med Atomic Design. Bureauet anvender en række udviklingsværktøjer, som er bygget efter Atomic Design principperne og således styrer designet – og dermed designerne – benhårdt.

Ønsker designeren fx at ændre en knapform eller tilføje en gradient, så vil frontend-udvikleren naturligt spørge, om han ønsker at ændre samtlige knapper på sitet, eller om der er en særlig god grund til at introducere en ny knapform?

For Allan Helleskov Kleiner betød systemerne, at hans utålmodighed blev indfriet. Han fik et login til værktøjet Pattern Lab, hvor frontend-udviklerne opbygger designet i ren HTML. 

– Efter nogle få uger kunne jeg se frontenden dukke op i responsive udgave. Jeg, og alle de andre interessenter, kunne se den på alle vore devices, og jeg kunne godkende den, før der blev kodet en eneste linje backend, fortæller marketingchefen.

– Ved at bruge Atomic Design principperne og Pattern Lab kunne vi ikke bare følge med i hele processen. Vi har også sikret, at designet er konsistent på hele sitet, og at ændringer, fx af en farvepalet, slår igennem på alle sider med det samme.

– Systemet betyder også, at vi ikke længere behøver designere til at lave de mere banale tilføjelser og ændringer, fordi elementerne er givet på forhånd og "bare" skal samles, slutter Allan Helleskov Kleiner.

Agil udvikling til aftalt pris

Peytz & Co udviklede design og CMS efter de agile metoder, men til en aftalt pris. Og prisen holdt. Ifølge Kontaktdirektør Claus Sølvsteen fra Peytz & Co holdt den, fordi holdet fra Fitness World, Loft37 og Peytz & Co mødtes flere gange om ugen og prioriterede indsatsen, og fordi Fitness World hver uge fik et totalt overblik over antal brugte timer, opdelt på frontend, backend og logiske opgavedefinitioner.

Alle vidste med andre ord hele tiden, hvor langt projektet var.

Resultatet kunne ses den 24. januar 2018, kun 13 uger efter det allerførste møde.

Og tre måneder senere gjorde Fitness World resultatet op: 16 pct. flere brugere på mobilen og en 40 pct. stigning i omsætning via mobilen. Så bliver det ikke meget bedre.