People working with apps, tablets and computers. Illustration.

«Alle» snakker om designsystem. Vi hjelper deg med å forstå hva det er, og hvorfor alle bedrifter som har planer om å skalere burde skaffe seg et.

Kvantitet uten kvalitet 

Behovet for et designsystem er en konsekvens av økt digitalisering. En organisasjon med flere digitale løsninger mister gjerne oversikten over tid over løsningene sine når det gjelder både design og kodeUten retningslinjer vil alle som jobber med løsningene designe, kode og implementere elementer og funksjoner på egenhånd. Resultatet er unødvendig tidsbruk,redusert kvalitet og inkonsekvent design og funksjonalitet som kan påvirke kundeopplevelsen

Hva er et designsystem?  

Et designsystem er et hjelpemiddel og viktig verktøy for alle som jobber med digital produksjon i en organisasjon.  Et designsystem samler retningslinjer og gjenbrukbare komponenter i et bibliotek. Her kan utviklere, designere, produkteiere og resten av teamet enkelt finne frem til og bygge løsninger med de samme gjenbrukbare komponentene. Komponentene er designet, kodet, testet og laget for å fungere med hverandre.  

Hva slags designsystem den enkelte virksomhet trenger vil variere, men vi ser at det finnes noen smarte løsninger som de fleste designsystem vil kunne ha nytte av:

1: Designsystemet burde inneholde retningslinjer. For eksempel en visuell profil knyttet til bruk av farger og fargekoder, utvikling eller klarspråk. De fleste bedrifter har allerede retningslinjer som kan videreføres i designsystemet, ofte kjent som brand book eller merkevarehåndbok. 

2: Et designsystem kan samle gjenbrukbare komponenter på et sted. Designelementene man bruker burde kunne bygges fra hverandre og settes sammen til nye løsninger, litt som legobrikker. På den måten sikrer man konsistens i alle elementer på en side.

3: Og sist, men ikke minst: Det kan være lurt å organisere designsystemet slik at alle elementer på den digitale siden er koblet opp mot et hovedelement. Det betyr at om man plutselig må endre original-elementet, vil endringen automatisk gjennomføres på alle digitale sider som inneholder akkurat dette elementet. Dette er svært tidsbesparende!  

La oss ta et eksempel:  

Bedrift X har oppdatert sin visuelle profil, og vil ta den nye logoen i bruk på alle digitale flater. Hver enkelt side kan være utviklet litt forskjellig, siden det har vært ulike designere og utviklere i bedriften gjennom mange år. For at bedrift X skal endre logoen må en utvikler inn og endre logoen manuelt på hver side, noe som tar rundt et kvarter per side. Bedrift X har i dag 500 digitale sider med logoen, og det vil ta rundt en uke å få endret den på alle sidene. Hvor lang tid ville dette tatt med et designsystem? Siden utvikleren kun trenger å endre logoen et sted, som automatisk vil oppdatere alle andre digitale sider, vil det kun ta 15 minutter.  

Dette er en fordel for bedrift X enten de vil bytte ut flere elementer på siden, eller endre designet slik at det er oppdatert i henhold til universell utforming, andre retningslinjer eller nye trender og brukerbehov. 

Tips: Trenger du en enkel måte å sjekke hvordan din nettside ligger anhvor mange fontstørrelser og farger finnes det på din nettside? Sjekk Cssstats!

 

Økt produktivitet er bare en av fordelene:  

Raskere utvikling og økt produktivitet er bare en av fordelene et designsystem gir. Her har vi listet opp noen flere: 

  • Forenkler arbeidsflyten for utviklere, designere, og produkteiere. Dette gir automatisering og raskere utvikling. Et designsystem gjør det dermed enklere å tilpasse seg et stadig skiftende digitalt landskap.  

  • Opprettholder en konsekvent identitet og design. Dette gir bedre kvalitet på siden og en mer troverdig merkevare. 

  • Gjør det enklere å holde oversikt og være oppdatert på selskapets egne interne retningslinjer, men også eksterne lover og regler (som krav til universell utforming).  

  • Skaper et konsist design og klare retningslinjer for design og utvikling. Den digitale merkevaren får et helhetlig uttrykk. Dette gir flere gevinster for brukeren og styrker brukeropplevelsen. 

  • Tilrettelegger for skalering og vekst, samtidig som man beholder kvaliteten.  

  • Det blir enklere å teste nye løsningsforslag og jobbe innovativtNår designere og utviklere har tilgang på komponenter og ferdig kode, vil man raskere kunne prototype og teste nye ideer og konsepter. Denne måten å jobbe på gjør at man kan lansere nye løsninger oftere, som styrker innovasjonskraften.

 

Et designsystem må være levende for å virke  

Et designsystem  leve og vokse med organisasjonen for ikke å gå ut på dato. Etter hvert som organisasjonen utvikler seg, gjør designsystemet det også. Et godt organisert system effektiviserer arbeidet og kommunikasjonen mellom team-medlemmene, og sørger for at designsystemet holder seg oppdatert, vedlikeholdt og enhetlig over tid, også når bedriften vokser.   

 

Ønsker du å utvikle et designsystem? 

Itera har et komplett tjenestespekter innen design og utvikling, og hjelper deg med det du har behov for, fra kartlegging av behov, utvikling av retningslinjer, visuell profil, teknisk oppsett til prosjektledelse og innføring i organisasjonen. Vi skreddersyr både utviklingsprosess og løsning, slik at din organisasjon får akkurat det dere trenger.

Våre salgsledere er alltid tilgjengelige for å fortelle deg mer om hva vi kan gjøre for deg og din virksomhet. 

Vi blir glade for å høre fra deg!

Bli inspirert 

Flere bedrifter har sine designsystemer åpent tilgjengelig. Her er noen av Iteras favoritter: 

 

NAV har i tillegg til komponenter og styling en egen seksjon med “slik skriver vi” og “verdier”. Nyttig for en bedrift som skal nå ut til alle lag av befolkningen!  

  

Selskapet bak organiseringsverktøyet Trello har kalt designsystemet sitt opp etter favorittsnacksen sin: Nachos. De bruker matkonseptet for å forklare hvorfor de trenger et designsystem: It's all about quality ingredients. 

 

IBM

IBMdesignsystem Carbon har de et eget sted der designere og utviklere kan komme med forslag til forbedringer (Contributing). I en global organisasjon med mange avdelinger ersystemet avhengig av å finne balansen mellom kreativ, men systematisk utvikling.  

 

Photon er Firefox’ designsystem. Dette er en levende guide, med egne seksjoner merket med et symbol for utkast. På den måten kan utviklere og designere følge med på hva som lages, teste det og komme med tilbakemeldinger før det blir lansert.