21-Dec

UX, Design and Designsystem

Designsystemer og hvordan de kan hjelpe din virksomhet

5 min read

·

By Markus Lavoll Gundersrud

·

December 21, 2023

Designsystem har vært i vinden de siste fem årene. Omtrent samtidig med lanseringen av Googles Material Design 2, og flere andre selskapers tilgjengeliggjøring av deres egne designsystemer, så ble begrepet designsystem allment kjent i bransjen. I Norge har vi f.eks. NAV sitt designsystem Aksel.

Et designsystem består av:

  • Visuell profil - Blant annet dokumentasjon og eksempler på fargevalg, teksttyper, stil og fremtoning.
  • Verktøy - Det en bruker for å kunne bygge, vedlikeholde, dokumentere designsystemet, samt kommunikasjonsverktøy.
  • Komponentbibliotek - Forhåndsdesignede, gjenbrukbare byggesteiner som brukes til å designe brukergrensesnitt.
  • Retningslinjer - Viser do’s and dont’s, og for eksempel oppførselen til komponenter med animasjon og lignende.
  • Mennesker - Designere, utviklere og produktutviklere. Menneskene som sørger for at designsystemet holdes i live og videreutvikles.

Kort fortalt kan et designsystem beskrives som en kilde til sannhet som forteller hvordan en virksomhet skal oppleves på analoge og digitale plattformer. I denne artikkelen kommer jeg primært til å fokusere på retningslinjer og komponentbiblioteket til et designsystem.

Hvorfor skal man ha et designsystem?

Et designsystem kan ha sine fordeler for organisasjonen.

Én kilde til sannhet

Uten et designsystem kan det oppstå uklarhet i hva som er “siste versjon” av for eksempel komponenter og retningslinjer. Vet å ha det dokumentert i designsystemet, så kan en alltid referere til det. Med et designsystem som kontinuerlig videreutvikles, så trenger en også å bare gjøre endringer ett sted, og det blir enklere å oppdatere i fremtiden.

Ved å ha én kilde til sannhet, så vil det bli et mindre behov for å standardisere og organisere designet på tvers av team og flater, siden dette er noe designsystemet tar seg av. Dette skaper også visuell likhet på tvers av forskjellige typer enheter, skjermer og applikasjoner.

Effektivisering

Med et fungerende designsystem, så kan en spare tid med å bruke komponenter om igjen og en unngår dobbeltarbeid der en må designe den samme tingen flere ganger for å brukes flere steder. Dette frigir tid for både utviklere og designere, som da kan brukes til å skape gode brukergrensesnitt og gode brukeropplevelser, fremfor å bruke tid på valg av farger, fonter, utforming av komponenter, osv.

Hvis man i tillegg bruker design tokens for å bygge opp komponentene, så blir også skille mellom design og utvikling mindre, som også er tidsbesparende.

Universell utforming

Designsystemet kan bidra til at organisasjonen oppfyller diverse krav til universell utforming. Ved å tenke UU fra bunnen av når man bygger opp komponentbiblioteket til et designsystem, så sikrer man seg at alt som benytter seg av designsystemet også opprettholder et minimumsnivå av universell utforming.

Et par tips

Et kontinuerlig arbeid

Når man jobber med et designsystem, så bør man tenke på det som et hvilket som helst produkt et team utvikler. Eneste forskjellen er at dette produktet er ment for intern bruk. Som andre produkter, så kreves det kontinuerlige forbedring for at produktet skal skape verdi og ikke bli utdatert. De samme prinsippene gjelder for interne verktøy som for eksterne verktøy.

Tenk MVP

Det er lett å la seg rive med når en ser andre designsystemer som har et nærmest uendelig antall komponenter som dekker alle mulig behov, men når en skal starte på et designsystem, så er det beste å starte i det små. Tenk MVP og start med det minste, og der det dekker det “største” minste behovet, så bygger en videre derfra. Et komplett ferdig designsystem er ikke et mål i seg selv og som tidligere skrevet, så kreves det kontinuerlig arbeid for å ha et designsystem som gir verdi.

Du kan ikke dekke alt

Det er ikke nødvendigvis alt som skal inn i et designsystem. Hvert produktteam har egne behov, og designsystemet bør ikke oppleves som begrensende. For å unngå dette, så er det lov å gå utenfor malen hvis et team trenger en helt spesifikk komponent, som kan leve utenfor designsystemet. Dersom det over tid blir en komponent flere team også ønsker å benytte seg av, så kan den da bli implementert i designsystemet, slik at alle teamene benytter seg av den samme komponenten.

Det krever laginnsats

Et designsystem kan fort bli utdatert hvis det jobbes med en gang, og så vedlikeholdes det ikke av et dedikert time. En måte å unngå dette på kan være å sette sammen et eget team for designsystemet, som består av designere og utviklere fra forskjellige team. Da kan hvert teammedlem representere teamet de sitter i til vanlig og på den måten sørge for at designsystem-teamet kontinuerlig får innspill på behov og forbedringer fra de som tar designsystemet i bruk. På denne måten, så vil designsystemet reflektere organisasjonsen nåværende behov og holde seg oppdatert.

Og helt til slutt

Ikke kast bort tid på å bygge et fullstendig designsystem inspirert av en annen organisasjon sitt designsystem. Mest sannsynlig har dere egne behov, og dere trenger kanskje ikke 8 forskjellige knapper å velge mellom. Et designsystem er et levende produkt for organisasjonen, og bør reflektere de nåværende behovene organisasjonen har.