Derfor trenger dere et digitalt designsystem

Dersom dere har behov for en tydelig merkevare på nett, så kan et digitalt designsystem gjøre dere mer effektive og gi dere et bedre sluttresultat.

Et digitalt designsystem har mange fordeler utover en tydelig merkevare på nett. Med et sunt digitalt designsystem får dere også et konsistent design, raskere tid til markedet, dere blir mer effektive og får nettsider som laster raskere.

Digitalt designsystem del 1 – Derfor trenger dere et digitalt designsystem
Digitalt designsystem del 2 – 5 steg til et sunt design

Et digitalt designsystem er gjenbrukbare designelementer med ferdig CSS-kode.

Designguide, designhåndbok, designrammeverk, stilguide, designsystem, designprogram, kjært barn mange navn… Et designsystem er ikke bootstrap og det er ikke et kode-rammeverk, og det er ikke som en statisk pdf brandhåndbok slik du er vant til å se den, men det er en bedrifts brand oversatt til digitale flater, det er selve designet og også koden som er skreddersydd til bedriftens behov. Det kan være nyttig for både små bedrifter og for store konsern.

Med et sunt designsystem, kan din bedrift oppnå:

  • Konsistent og intuitivt design som er oppdatert i henhold til bedriftens designprofil.
  • Raskere tid til markedet ved å ta LO-FI prototyper rett til produksjon.
  • Forbedret operasjonell effektivitet i design og utviklingsteamene.
  • Gjenbrukbar frontendkode som gir bedre performance for brukerne dine.

 

Et digitalt designsystem er nyttig for alle som har behov for en tydelig merkevare på nett

Alle som har nettsider med CSS-kode, som har behov for en tydelig merkevare på nett, kan ha god nytte av et digitalt designsystem. Et stort konsern med mange produkter og tjenester på nett trenger et mye mer omfattende designsystem enn en enkel liten nettside for et galleri. Derfor bør dere skreddersy designsystemet til bedriftens behov.

Designet blir konsistent med gjenbrukbare designelementer

Tenk om brosjyrene dine hadde noen sider med nytt design og noen sider med tre år gammelt design fra en gammel versjon av profilhåndboken? Det skjer ofte på nett at brukeren må klikke seg igjennom sider med inkonsekvent design i en og samme brukersesjon, det er faktisk ganske vanlig! Konsistens kan høres kjedelig ut. Der er ingen designpris for ‘mest konsistente design’. Men konsistens handler ikke om å gjøre grensesnittet spennende, det handler om å kommunisere effektivt, slik at brukerne forstår hva det visuelle språket betyr. På samme måte som det verbale språket er konsistent, er det nødvendig å også bruke et konsistent visuelt språk. Hvordan brukerne tolker en nettside er basert på hva de ser og hva de har sett og erfart tidligere. Slik bygger vi forventninger om hvordan ulike grensesnitt skal oppføre seg. Både utseende og lokasjon på visuelle elementer har betydning for hvilke forventninger brukerne får. Brukere setter stor pris på det om et element som ser likt ut oppfører seg på samme måte på mobil som på en større skjerm. Det sparer dem for kognitiv energi.

Brand håndbøker mangler retningslinjer for digitale flater

En brandhåndbok gir retningslinjer for hvordan logoen og profilen til en bedrift skal brukes for å sikre en sterk merkevare.

Brandhåndbøker er ofte noe overfladiske, de viser typisk hvordan ting skal se ut på papir, i brosjyrer, visittkort og brevpapir, men ofte er der minimalt med retningslinjer for hvordan profilen skal brukes på digitale flater. Nå finnes der unntak naturligvis, men formen i brandhåndbøker har ikke endret seg stort de siste 10 årene, og ligner fortsatt veldig på brandhåndbøkene som ble laget før i tiden, den gangen da en bare hadde trykksaker å forholde seg til.

Få leser brandhåndboken grundig

En brandhåndbok er bra å ha, men det krever mye disiplin å få alle til å følge håndboken til punkt og prikke.

Har du noen gang testet om designvisjonen din har slått rot blant designerne? Gått rundt og spurt designerne hva som er den overordnede designvisjonen? Og hva med frontend-utviklerne, som bestemmer hvordan koden skal struktureres, er de kjent med designstrategien?

Digitale designprosesser krever løpende designiterasjoner

Digitale flater er mer uforutsigbare enn papir. Hvilke enheter målgruppen sitter på endrer seg hele tiden, og alt vi kan gjøre for å oppnå et best mulig sluttresultat er å teste så mye som mulig, gjøre mange designiterasjoner og justere og tilpasse designet løpende. Det vil alltid være endringer i teknologi, marked, forretningstrategier og nye satsningsområder, funn fra analyser og tester som krever designiterasjoner. Disse endringene kommer som regel flere ganger i løpet av et prosjekt.

Dere sparer tid på lang sikt

Et digitalt designsystem er som en håndbok for hvordan designet skal brukes på digitale flater, men det er mer enn det, det går dypere ned i kodestruktur og digitale designelementer som knapper, skjemaelementer og hvordan koden kan gjenbrukes. Den har ferdige testede designelementer for alle de elementene som finnes for digitale flater som man har brukt for i designet. Har dere laget kode for en knapp, så kan den gjenbrukes tusenvis av ganger uten å skrive mer CSS. Når dere vil endre litt på designprofilen, så kan du endre det bare et sted, så blir automatisk alle elementer som bruker samme kode riktige (dersom du har et lykkes med å utvikle et sunt design). Du bruker to minutter på å endre på knappen istedenfor en hel dag med tråling igjennom utallige CSS filer, noe som antagelig hadde blitt nedprioritert likevel, slik at dere ender opp med et inkonsekvent design istedenfor å oppdatere alle sider.

Sidene blir raskere å laste

Problemet med digitale design er at en hele tiden jobber mot den samme nettsiden (eller flere), tenk deg at målgruppen din som fikk utdelt en ny brosjyre måtte bære med seg alle brosjyrene du noen gang har trykt opp fordi de hører til den samme bedriften? Dersom dere hele tiden bare lager nye digitale design, og skriver mer og mer kode, uten å rydde opp i det gamle, så blir det hele tiden bare mer og mer for målgruppen din å laste i nettleseren hver gang de besøker nettsiden din. Når den samme kodebiten gjenbrukes, så blir det mindre å laste for målgruppen som besøker nettsidene.

Slik gjør dere det

Med et sunt designsystem kan dere oppnå grensesnitt med et enhetlig designspråk på tvers av prosjekter med ulike design- og utviklingsteam. Men det er ikke nok å bare utvikle designsystemet, dere må også forvalte det på en bra måte for å lykkes.

I min neste post kan du lese om hvordan dere kan lykkes med et digitalt designsystem:
Digitalt designsystem del 2 – 5 steg til et sunt design

Janne Flusund er rådgiver innen brukervennlighet og design i Steria. Hun jobber med UX design og har en bakgrunn i visuell kommunikasjon,  interaksjonsdesign og design management. Janne har lang erfaring fra mediabransjen med redaksjonell UX design og strategiske design rammeverk for CMS.

Janne Flusund er rådgiver innen brukervennlighet og design i Steria. Hun jobber med UX design og har en bakgrunn i visuell kommunikasjon, interaksjonsdesign og design management. Janne har lang erfaring fra mediabransjen med redaksjonell UX design og strategiske design rammeverk for CMS.

En kommentar om “Derfor trenger dere et digitalt designsystem

  1. Tilbaketråkk: Steria

Legg inn en kommentar