2020 – 2025
Bakgrund
En stor organisation som Arbetsförmedlingen har stora vinster i att ha ett fungerande designsystem. För att snabbare kunna ställa om och bygga nya tjänster. Det stärker användarupplevelsen, ökar tillgängligheten, spar tid och resurser och bjuder in till tätare samarbeten.
Jag hade tidigare i min roll som AD-lead försökt upprätthålla ett UI-kit. Men det fanns ingen tid avsatt för att arbeta med detta. Det arbetet skedde på övrig tid och i samverkan med andra kompetenser och avdelningar. 2020 avsatte myndigheten en budget för en ny byggsten som då blev Designsystemet och ett team bildades där jag fick rollen som produktdesigner (på Af kallat UX-designer med visuell inriktning). Teamet i övrigt bestod av produktägare, produktansvarig, senior frontendutvecklare, två juniora ux-ingenjörer och en lösningsarkitekt. Efter två år tillkom två tillgänglighetsexperter och en ytterligare produktdesigner. Vårat uppdrag var och är att bygga upp ett ledande designsystem i världsklass, som är open source och kan delas med både andra myndigheter och privata aktörer.
Process
Jag var med från början och jobbat med fler olika delar av designsystemets uppbyggnad. För att nämna några projekt:
Uppbyggnad av UI-kit först i Sketch + Abstract sedan Figma. Där framtagandet av nya komponenter sker enligt en behovsdriven samarbetsmodell. Exempel ny komponent inleds med research, kravställa tillgänglighetskriterier, behovsanalys som en del av designsystemet (vilka fler har behovet). Skissarbete, iterationer med berörda team och expertkompetenser, bygg, testa, färdig komponent, release och uppföljning.
Dokumentationswebb, där har jag tagit fram underlag för startsida, landningssidor, menystruktur och webbaserade specialverktyg. Ett av de första projekten var att avveckla den grafiska manualen i tryckt form (som jag jobbat med tidigare som AD-lead) och göra en helt webbaserad lösning för att dela internt och för externa aktörer. Det innebar en omarbetning av hela dess innehåll och omskrivningar och ta fram grafiska exempel och nya riktlinjer.
Systematisera och utveckla hela den digitala färgpaletten. Omarbeta hela den redan existerande paletten, tillföra nya behov och förenkla användandet. Tydliggöra vilka färger som hör hemma vart och säkerställa att kontraster hålls.
Systematisera design i designtokens. Innebär att skapa ett system för hur utveckling och design kan kommunicera på samma nivå. För att skapa avancerade komponenter i Figma som enkelt kan gå från design till färdig kod.
I tätt sammarbeta med kommunikationsavdelningen om ”Synen på myndigheten”. Tog vi fram ett underlag som stärker trovärdigheten, stärker tillgänglighet och inkludering, Där jag bla. Ansvarade för en ny färgpalett och uppdaterat visuellt uttryck för hela myndigheten.
Skapa eget ikonbibliotek, skriva designmönster, designriktlinjer, komponentdokumentation och utbildningsmaterial. Stötta och sälja in användningen av designsystemet till team och tjänster. Vara en reklampelare för designsystemet, och finnas på plats vid viktiga tillfällen, hålla och driva föreläsningar och uppmana till samarbeten utanför myndigheter. Där inte designsystemet är applicerbart hjälpa till att plocka ut de delar som är möjliga att implementera eller ta beslut om inte göra någon implementation där det inte tillför något värde eller är allt för resurskrävande.
Med mera…
Utmaningar
När vi drog igång fanns det inte så många andra att kolla på. Vi var pionjärer och har många gånger fått börja om och ständigt förbättra.
Vi tog oss igenom en pandemi, där det blev en omställning att jobba tillsammans. Det som räddade oss var att vi hade Teams att tillgå eftersom vi var ett testpilotteam. Övriga myndigheten fick klara sig med Skype.
Designsystemet har inte varit ett skallkrav fören 2025, det har därför inte alltid varit enkelt att övertyga vissa team och produktägarna om de vinster som ett designsystem tillför.
Vi har hela tiden varit ett litet team som gör mycket. Blivit utsatta i omställning och omorganisationer. Där jag tyvärr var tvungen att sluta.
Resultat
I Arbetsförmedlingens hela reformation som nu pågår har designsytemet varit en nykelspelare som nu får allt mer uppmärksamhet även internt. Tidigare har vi uppmärksammats i flera andra olika sammanhang. Både genom att andra myndigheter kollat på oss och tagit hjälpt via samarbeten.
Länk till designsystemet: design.arbetsformedlingen.se
UX | Designsystem | Art direction | Webbtillgänglighet | DOS | Projektledning | Ikondesign | Designriktlinjer | Designmönster | Varumärkesbyggande | Designtokens | Illustration | Informationsdesign | Ikondesign | Användartester | Designreview | Konceptutveckling | Kognitiv genomgång | Heuristisk utvärdering | Research | POC | Agile | Scrum | SAFe | Tillgänglighetsvalidering | Audit | Kartläggningar | Storyboard | Wireframes | Prototyper | A/B Tester | Figma | Sketch | Abstrac | Illustrator | Photoshop | ServiceNow | SiteVision | Pega | GitLab | JIRA | CMS
// Fler exempel är på gång…
