Thoughts

Fem tips för att lyckas med ert designsystem

Ett designsystem hjälper er att arbeta effektivt och skalbart. Det bidrar dessutom till en mer enhetlig varumärkesupplevelse. Esattos UX/UI-designer Frida Svensson ger fem tips för att lyckas med designsystemet.

Designsystem – ett fenomen med många fördelar

Du har säkerligen hört ordet designsystem florera i diverse konversationer ute på stan. Detta är inget nytt fenomen, men det blir allt vanligare att sätta upp även för lite mindre företag. Att ha ett designssystem är både kostnadseffektivt och bidrar till en enhetlig och kvalitativ slutprodukt. Det hjälper er organisation att arbeta skalbart i era digitala kanaler. Det har med andra ord många fördelar att skapa ett designsystem. Men hur gör man det bäst?

Så lyckas ni med designsystemet – fem tips:

Jag som arbetar med detta dagligen har satt ihop en lista på hur ni lyckas bäst med ert designsystem:

1. Börja litet

Börja med att sätta upp en stabil och välarbetad grund. I praktiken kan det innebära att justera/webbanpassa er grafiska profil med färger, typsnitt och logotyp. Nästa steg kan vara att sätta upp de allra vanligaste komponenterna på er site, så som knappar och formulärelement. När grundstenarna är på plats går det snabbt att skala upp och bygga nya sidmallar. Se till att utvärdera era viktigaste kundresor och optimera efter dessa.

Fler tips:

  • Skapa en färgpalett med primära, sekundära och neutrala färger.
  • Se över det typsnitt som ska användas och att en licens finns på plats. Sätt upp regler för hur typsnittet ska användas.
  • Sätt upp ett grundläggande komponentbibliotek med exempelvis knappar, formulärelement och ikoner.

2. Tillgänglighetsanpassa

Se till att redan från början säkerställa att ditt designsystem är tillgängligt för alla. Har alla element tillräckliga kontrastvärden? Har din webb en tydlig navigering? Det är betydligt enklare och mer kostnadseffektivt att ta höjd för detta från början, än att behöva bygga om allt efter en tid.

Fler tips:

  • Använd verktyg för att tillgänglighetsgranska kontrastvärden och färgval.
  • Se till att navigeringen är enkel att förstå och använda.
  • Använd tydliga och beskrivande etiketter för formulärelement och knappar.

3. Ta med hela teamet

Ett designsystem är inte bara till för designers. Det är till för alla i teamet för att ha någonting att samlas och diskutera kring. Det är därför viktigt att alla i teamet har tillgång till ert designsystem. Både designers, utvecklare, projektledare och produktägare. Alla har viktiga åsikter att bidra med som gör att just ert designsystem kommer lyckas.

Fler tips:

  • Anordna regelbundna workshops och möten för att samla in feedback från teamet.
  • Strukturera ert designsystem på ett tydligt sätt och tillhandahåll dokumentation där det behövs.
  • Uppmuntra teamet att bidra med idéer och förbättringsförslag.

4. Jobba med feedback

Se till att arbeta med feedback från era användare och uppdatera designsystemet därefter. Att arbeta iterativt med feedback gör att användarna känner sig hörda och får den bästa möjliga upplevelsen. Detta skapar ett stort förtroende hos er som avsändare. En lättanvänd tjänst kommer man gärna tillbaka till, medan man som missnöjd användare ofta söker sig till en annan aktör.

Fler tips:

  • Skapa rutiner för hur ni samlar in feedback, såsom enkäter och användartester
  • Identifiera mönster och återkommande problem som kommer in från feedbacken
  • Implementera förbättringar baserat på den inkomna feedbacken

5. Se det aldrig som en färdig produkt

För att återkoppla till föregående punkt: ett designsystem är ett levande dokument. Det är ingen PDF som ska sparas ner i en mapp och inte röras på fem år. Det är viktigt att hela tiden anpassa och uppdatera sitt designsystem för att hela tiden ligga i framkant och anpassa efter behov.

Fler tips:

  • Genomför regelbundna granskningar av designsystemet och identifiera områden som behöver förbättras
  • Rensa bort komponenter som inte används för att minska förvirring
  • Se till att det finns tid för innovation och framtagning av nya idéer

Vill du veta mer?

Frida Svensson

Frida Svensson

UI Designer

frida.svensson@esatto.se