Ett designsystem är en samling återanvändbara design-komponenter, med tydliga regler för hur de ska användas. Designsystemet samlar resurser, riktlinjer och ger ett gemensamt språk för alla som är inblandade i att designa och bygga en digital produkt eller tjänst.
Inom ett designsystem hittar man både grafisk profil och ett bibliotek av designkomponenter. Det kan också innehålla riktlinjer och exempel på hur en väl designad produkt ska se ut. Designsystemet är ett centralt verktyg för team som arbetar över olika produkter och plattformar för att säkerställa att företaget kan ge en sammanhållen och härlig användarupplevelse till sina kunder.
I arbetet med Gårdssällskapet skapade vi ett designsystem som inte bara innehöll deras visuella identitet utan också återkommande mönster. Systemet gör det möjligt för oss att skapa en konsekvent digital upplevelse som speglar Gårdssällskapets varumärke på varje sida och i alla flöden.
Designsystem vs. grafisk profil
Grafisk profil och designsystem är släktingar, men designsystemet är mer omfattande. Medan den grafiska profilen fokuserar på grundläggande visuella komponenter som typsnitt, logotyp, färger och riktlinjer, går ett designsystem längre och fungerar som en central resurs för att hantera design återkommande och i stor skala.
När vi utvecklade Gårdssällskapets designsystem inkluderade vi både den grafiska profilen och hur den skulle tas ut i alla delar av den digitala tjänsten för att den digitala upplevelsen inte bara ska se bra ut utan också fungera optimalt för användarna.
Varför är designsystem viktiga?
Designsystemet hjälper team att arbeta mer enhetligt, med komponenter (både som atomer och som molekyler) och riktlinjer samlade på ett ställe. Med hjälp av ett designsystem kan en designer snabbt skapa nya sidor och moduler med färdiga UI-komponenter, en programmerare kan kopiera och klistra in testade kodsnuttar, och en marknadsförare kan enkelt hitta riktlinjer för innehåll för att skapa nya kampanjer.
Det här ger en konsekvent varumärkesidentitet och en sammanhängande upplevelse för slutkunden. Designsystem hjälper också företag att skala upp sina design- och utvecklingsinsatser. De gör det möjligt för företag, som kanske består av flera team och arbetar över olika plattformar och produkter, att bli samordnade i sitt arbete.
Vad kan ingå i ett designsystem?
Designsystem inkluderar ofta följande:
- Översikt: Denna del ger en överblick och är viktig för ett mer komplext system. Här kan man nämna nya uppdateringar, eller lista principer och gemensamma värderingar som definierar vad bra design innebär för organisationen.
- Grundläggande komponenter: Visuella eller stilistiska riktlinjer som färger, typografi, ikonografi, bildspråk, ljud, rörelse och mer.
- Komponenter, eller atomer: Ett bibliotek av återanvändbara UI-element, kan finnas både visuellt och i kod.
- Mönster eller molekyler: Kombinationer av komponenter med förslag på hur komponenter kan användas tillsammans på ett användarvänligt sätt.
- Riktlinjer för content och varumärke: Vissa designsystem inkluderar också varumärkesriktlinjer, som beskriver varumärkesvärden, personlighet och standarder för till exempel tonalitet och grammatik. Det kan också innehålla en lista med ord och hur de ska eller inte ska användas.
Genom att ha alla de här elementen i ett sammanhållet system, kan ett företag säkerställa att de digitala produkterna inte bara är visuellt tilltalande utan också konsekventa, funktionella och följer varumärket.
Mer om vårt arbete med Gårdssällskapets designsystem:
📦 Uppdaterad grafisk profil och ett gediget designsystem
🔍 Optimering av digital prenumerationstjänst