Designsystemet er en felles verktøykasse med grunnleggende UI-komponenter, retningslinjer og mønstre som det er verdifullt å dele på tvers av offentlig sektor. Designsystemet skal bidra til effektiv produktutvikling og helhetlige brukeropplevelser.

Hva er et designsystem?

Et designsystem består av UI-komponenter og mønstre som sikrer gjennomtenkte og konsistente brukeropplevelser i digitale tjenester.

Ved å bruke grunnleggende byggeklosser fra designsystemet kan produktteamene selv bygge mer sammensatte komponenter som dekker spesifikke behov.

Et designsystem fungerer som en bro mellom design og utvikling, og sørger for at det er de samme verdiene vi jobber med.

Hvorfor et felles designsystem?

Regjeringen vil jobbe for at "offentlige digitale tjenester skal ha et brukervennlig og gjenkjennbart design på tvers av ulike etater slik at innbyggere med lav digital kompetanse kan benytte tjenesten". ¹

Gjennom å samarbeide om et felles designsystem kan vi i større grad sikre helhetlige og gjenkjennelige brukeropplevelser på tvers av etater. I stedet for å lage de samme grunnkomponentene om og om igjen, kan vi lage dem skikkelig én gang og sikre god kvalitet ved at at tilgjengelighetskrav og testing er godt ivaretatt. Best av alt - da har vi kun ett sted å vedlikeholde dem når det kommer nye teknologier, standarder, krav og behov. Det betyr mer tid til å løse viktigere problem for brukerne våre. 🎉

Hvem bruker designsystemet?

Designsystemet er i bruk i Altinn Studio, der 70 ulike etater utvikler sine tjenester. Flere offentlige virksomheter har også tatt designsystemet i bruk utover tjenester de lager i Altinn.

Hva består designsystemet av?

Designsystemet består av grunnleggende designelementer, UI-komponenter, mønstre og god praksis. Du kan ta i bruk det du trenger, i den grad du ønsker.

• Grunnleggende designelementer
  De grunnleggende designelementene i designsystemet, som vi kaller "Design Tokens", styrer hvordan komponentene skal se ut, blant annet med tanke på farger, typografi, størrelser, avstander og former. Noen av variablene er lagt opp til å være tema-baserte, det vil si at de tar utgangspunkt i din merkevare med de fargene og preferansene du selv velger.

• UI-komponenter
  Designsystemet inneholder de mest grunnleggende UI-komponentene som gir verdi å dele på tvers. Vi dokumenterer hvordan komponentene bør brukes og oppdatererer retningslinjene etter hvert som vi får mer innsikt. UI-komponentene finnes foreløpig i Figma og React.

• Mønstre og god praksis
  Designsystemet er en samarbeidsarena for å utvikle gjenkjennbare mønstre og felles anbefalinger. Med mønstre mener vi for eksempel hvor sentrale elementer skal plasseres i grensesnittet, og hvordan navigasjon, feilmeldinger og andre gjentagende brukeroppgaver skal oppføre seg. Vi kan samarbeide om mønstre selv om vi ikke bruker de samme tekniske komponentene eller designelementene.

• Blogg
  I bloggen kan vi fortelle om nye oppdateringer og dele historier. Vi håper flere vil bruke bloggen til å skrive om hvordan de har tatt i bruk designsystemet.

Hvem kan bruke og bidra til designsystemet?

Alle som lager digitale løsninger for innbyggere kan bruke designsystemet. Det er åpen kildekode og vi setter pris på at du bidrar til å gjøre designsystemet bedre. Si gjerne ifra hvis du finner en feil eller vil foreslå en forbedring. Spørsmål kan du stille i Slack-kanalen #Designsystemet, der hjelper vi hverandre.

Hvordan kan du bidra?

Vi har ingen bestemt måte du må gå fram på for å bidra, men ta gjerne kontakt på Slack når du har et behov, så kan vi sammen vurdere behovet.

• Bidra med design
• Bidra med utvikling
• Bidra med innsikt
• Skriv en artikkel

Hvordan samarbeider vi på tvers?

En viktig verdi for oss er å være åpne og transparente, og vi tror dette er avgjørende for å få til et samarbeid på tvers. Alt vi gjør deler vi åpent - kildekode, backlog, roadmap, Figma, Storybook.

En gang i måneden har vi "Demo og samarbeidsforum" som er åpen for alle interessenter. Her forteller vi om hva vi har jobbet med siden sist og tar imot innspill og behov. Ta kontakt om du vil ha tilsendt en møteinvitasjon.

Teamet i dag består hovedsakelig av designsystem-teamet i Digdir, med god hjelp fra designere og utviklere i Brønnøysundregistrene, Mattilsynet og Udir. Vi håper designsystemet blir et tverretatlig team i enda større grad og vi jobber for mer ordnede rammer i det offentlige for å kunne jobbe på denne måten.

Designsystemet har et tett samarbeid med Altinn Studio - et verktøy for å utvikle digitale tjenester til innbyggere og næringsliv. Bruker du Altinn studio til å utvikle tjenester, bruker du automatisk designsystemet.

Vil du være med på samarbeidet?

Heier du også på mer gjenbruk og mindre dobbeltarbeid? Send oss en e-post på: designsystem@digdir.no

---

Kilder

[1] Regjeringens strategi «Digital hele livet» og handlingsplanen for «Økt inkludering i et digitalt samfunn»)