Design system
Et designsystem er din brand identitet indkoorporeret i byggeklodser der kan sættes sammen til digital formidling, nemt og effektivt og med omtanke og respekt for dit brand.
Et design system består, som udgangspunkt, af et grundfundament, komponenter, evt både design-komponenter og kodede komponenter, brugs-dokumentation og en proces-definition.
Fundamentet
Som navnet indikerer, er fundamentet udgangspunktet for designsystemet. Her defineres de grundmaterialer der skal bruges i komponenterne. Fundamentet er en konkretisering af brand-book, altså en beskrivelse af design og detaljer der udgør brandets udtryk. Det kan fx. Være en definition af brand-farverne, som hhv. hex-koder og “kode” koder (design tokens) m.fl., så man fra start af, tænker praktiske brugsscenarier ind i designsytemet.
Et fundament skal helst være stabilt og omhyggeligt konstrueret, så det der bygges på det er lagntidsholdbart.
Komponenter
Komponenter er designsystemets byggeklodser. De delelementer der bruges til at bygge fx en kampagneside op. Komponenterne er som udgangspunkt det mest simple element, fx. En knap, et tekst-element, en banner el.lign. Komponenter kan være simple eller forholdsvis avancerede, det vigtigste er at der er taget højde for om det er et element der bruges ofte og man derfor kan spare tid og tanker ved at lave en genbrugelig komponent.
Design guidelines
Præcis som man kan have brug for en brugsvejledning hvis man ønsker at bygge Star Wars’ Millenium Falcon i Lego, kan det være en hjælp og en tidssparrer at definere nogle guidelines og brugsscenarier for komponenterne. Guidelines er skriftlig og billedlig dokumentation af “best practice” brug af komponenterne. Det er naturligvis umuligt at tænke alle potentielle brugsscenarier igennem, men som udgangspunkt kan det være en stor hjælp at dokumentere hvilke brugsscenarier komponenten var tænkt som. Krydret med små logiske huskere som fx. “overvej hvilke af varianterne af knapperne der er relevant for dit specifikke brugsscenarie” og “Does and Dont’s”.
Proces
Når et designsystem skal bygges op, er det afgørende dels, at brand-identiteten oversættes grundigt og gennemtænkt i fundamentlaget, dels at de komponenter der laves - og disses varianter, er de mest relevante elementer til designsystemet. Det kommer ofte som en overraskelse hvor mange mennesker man bør involvere i processen at udvælge de mest vigtige komponenter, samt at lave restriktioner for brugsscenarierne af komponentern.
Designsystemet skal helst kunne bruges af interne som eksterne. Folk der kender alt til “reglerne” for fx. brugen af en knap, til fx. eksterne bureauer der kun har en overfladisk forståelse for brandets DNA. Derfor er det en god idé at tænke bredt og pædagogisk når komponenterne til designsystemet skal vælges.
En anden tidsrøver i udviklingen af et designsystem, er den tid man ofte kommer til at bruge på at være “ambassadør” for designsystemet. Det kan virke indlysede at når man bruger tid på at lave nogle regler og “best practices”, så bør det respekteres, men de fleste ansatte i en virksomhed, har før eller siden skulle lave “design”, fx. sætte en Power Point præsentation sammen. Hvis det ikke er super intuitivt og vel-dokumenteret hvordan design-elementer og komponenter bør bruges, kan man ikke fortænke folk i at komme til at bruge dem forkert og dermed levere et udtryk der ikke passer til virksomhedens brandidentitet.
Ergo: Struktur, effektivitet og usability kommer man sjældent sovende til, så vær beredt på at et designsystem ikke bygges eller integreres i virksomheden på én dag.
Et designsystem er et levende værktøj, og vil med tiden udvikle sig. Systemet kræver derfor en gennemtænkt proces for vedligeholdelsen af systemet, for at sikre at værktøjskassen forbliver relevant - og ikke bare føles som en fiks idé nogle kreative engang fik.
Nojns proces
✺ Frequently asked questions ✺
-
Som oftest indeholder det et fundament, som er guidelines for grundelementerne (farver, spacing og typografi). Disse danner grundlaDet for genanvendelige UI komponenter (knapper, tabellers, formularer etc.)
De er som oftets bygget til som værktøjer til designere og udviklere, men kommunikationsmedarbejdere kan ligeledes have stor hjælp af værktøjet. -
Med gennemtænkte og prædefinerede elementer ogkomponenter, kan design og udviklingsabejde optimeres i enhold til tid og kvalitet. Eksterne parter har nemt ved at opbygge interfaces der understøtter brandidentiteten
-
Brandbook er en overordnet dokumentation af virksomhedens brand og visuelle udtryk. Den danner ofte grundlaget for designsystemets fundamentslag, men hvor brandbooken er en mere generel beskrivelse er designsystemet ofte målrettet digtalt UI design og udvikling og tager derfor højde for fx. UI effekter (parallax, mouse-over farveskifte etc) , farver og fonte til digitalt brug etc.
-
At komponenterne er genanvendelige, relevante (også ever tid) og veldokumenterede. Men det vigtigste er nok at et godt designsystem effektiviserer design-processen og gør designopgaverne langt mere kost-effektive.
-
Nej, hvis du ikke kommunikerer til din målgruppe via en skærm med en vis frekvens, er der ikke brug for det helt store forkromede designsystem.
Men designsystemer kommer i forskellige størrelser og kompleksitetsgrader, og selv en beskeden dokumentationsbeskrivelse af fundaments-elementerne, enkelte komponenter og skabeloner plus en konkret, kort og præcis, brugsvejledning til komponenterne kan spare, selv en mindre virksomhed, for mange timers arbejde, hvis der i ny og næ skal kommunikeres til kunderne fx via hjemmesiden eller en kampagne.
-
Ja.
En gang i mellem er det faktisk helt okay at tilføje lidt lir, bare fordi det ser cool ud. På samme måde som man fx bærer smykker, bare fordi det er visuelle detaljer, der understreger ens personlige udtryk og / eller har en affektionsværdi.
