Designsystem

Design- och utvecklingschefer och produktägare får snabbare releaser och konsekventa, tillgängliga gränssnitt, samlat i en källa som alla era team delar och som ni kan förvalta själva.

Ett designsystem är ett komponentbibliotek på systemnivå: gränssnittskomponenter, mönster och dokumentation som skalar över flera produkter eller varumärken. Vi etablerar och förvaltar det, med tillgänglighet enligt WCAG 2.2 AA (riktlinjerna för webbtillgänglighet) inbyggd i varje komponent, samma kravnivå som tillgänglighetsdirektivet EAA, i kraft 28 juni 2025. Resultatet är konsekventa gränssnitt, snabbare lanseringar och tillgänglighet i varje applikation som använder systemet.

En ändring i färg, typografi eller avstånd kan slå igenom hundratals skärmar. Vi använder AI-stöd för att kartlägga konsekvenserna av en ändring och hålla dokumentationen i takt med koden, så att teamen vet vad som påverkas innan en ny version går ut.

Så går det till

01

Kartläggning och strategi

2–4 veckor, kartläggning av existerande gränssnitt, varumärkesriktlinjer och teamen som ska använda systemet. Komponentstrategi och ägarmodell.

02

Färg, typografi och avstånd, plus kärnkomponenterna

Färg, typografi och avstånd, plus kärnkomponenterna: knappar, formulär, navigation, kort och tabeller. Prototyp och kod parallellt.

03

Dokumentation och pilotteam

Dokumentation som teamen kan följa. Ett pilotteam tar v1 i bruk och ger feedback.

04

Första versionen tas i bruk

Publicerad första version, ändringslogg och guide för övergången. Aktiv supportkanal för teamen som använder systemet.

Vad du får

  • Färg, typografi och avstånd, versionerade och oberoende av plattform
  • Komponentbibliotek med fulla varianter och tillstånd, som klickbar prototyp
  • Kodat komponentbibliotek i den teknik era team redan använder, som matchar prototypen
  • Dokumentation med användningsregler och tillgänglighetsanvisningar
  • Tillgänglighet enligt WCAG 2.2 AA inbyggd i varje komponent
  • Versionshantering med changelog och migrationsguider
  • Modell för hur nya komponenter tas in
  • Tema-system för flera varumärken
  • Automatiska tester för tillgänglighet och visuell jämförelse

Gjort för

Bland annat Länsförsäkringar: Designsystem för Länsförsäkringar, AFRY: Multisajt med 16 språk på en plattform eller Unionen: 1,7 miljoner sidvisningar per månad, 50 redaktörer.

Vanliga frågor

När är det dags för ett designsystem?

När ni har minst tre produkter eller varumärken som divergerar designmässigt, eller när nya produktteam ständigt återuppfinner samma komponenter. Ett designsystem är en tvärgående investering, den betalar tillbaka sig först när flera team använder det.

Vad är skillnaden mellan tjänstedesign och ett designsystem?

Tjänstedesign tar ett oklart problem till ett validerat koncept för en specifik tjänst. Ett designsystem är det gemensamma språket flera produkter bygger på. Många börjar med tjänstedesign på en tjänst och låter komponenterna bli ett designsystem när flera team ska dela dem.

Kan vi ta över förvaltningen själva?

Förvaltning i eget team är målet. Dokumentation och en modell för hur nya komponenter tas in levereras så att ni driver vidare själva. Många kunder behåller en konsultinsats med ett par seniora utvecklare i teamet, för stabilitet.

Söker ni något annat? Se Tjänstedesign, Tillgänglighet, Webb- och innehållsplattform eller Förvaltning och vidareutveckling.

Joakim Ekman
Joakim Ekman Affärsområdeschef, förändringsledning
Boka samtal