Design System – Yrityksesi digitaalinen ilme yksissä ”kansissa”

4.2.2021

Yritykseltäsi saattaa löytyä useampia digi- ja mainostoimistoja yhteistyökumppaneina, omat sisäiset vastuuhenkilöt sekä liuta muita enemmän tai vähemmän toiminnassa mukana pyöriviä tahoja. Kun keittiöstä löytyy monta kokkia, myös lopputulos voi olla... suuri yllätys. 

Kuvittele että verkkosivujen uudelle kampanjasivulle on suunniteltu painikkeen korkeudeksi 25px, mutta muualla sivustolla käytetään painikkeissa 40px korkeutta. Tämä ei tässä kohtaa kuulosta vielä isolta asialta, yksittäisestä sivusta kun on kyse. 


Kun nämä uudet ominaisuudet monistuvat ja muuttuvat pikkuhiljaa kenenkään huomaamatta, ja alkuperäinen raikkaan vadelmanpunainen sävy alkaa taittamaan enemmän viinimarjaan, meillä löytyykin verkkosivuilta jo viisi (5) lähestulkoon samanlaista painiketta, mutta kaikki ovat kuitenkin hieman eri korkuisia ja/tai värisiä – leveyksistä puhumattakaan. Ei hyvä… ainakaan jos tavoitteena on yhtenäinen ja selkeä brändi-ilme!


Design Systemin avulla saadaan jaettua kaikille mukana oleville tahoille ajantasaiset materiaalit, niin ilmettä kuin viestintääkin ajatellen. Näin yrityksesi näyttää ja kuulostaa samalta, vaikka eri vastuuhenkilöt työskentelisivätkin eri kokonaisuuksien taustalla.

 

Mikä on Design System?

 

Brand bookit ja design guidet ovat toimineet jo vuosia yritysten graafisen ilmeen ohjenuorana, mutta viedäksesi yrityksesi kehitystä tehokkaasti eteenpäin on aika rakentaa oma Design System.
 

Design Systemistä puhutaan paljon varsinkin UI- ja UX-suunnittelun yhteydessä, mutta itse näen sen hyödyt vieläkin pidemmälle. Design Systemin avulla saadaan koottua yrityksesi graafinen ilme, CSS-koodit, verkkosivukomponentit ja muut graafiset elementit ja materiaalit sekä ohjeet standardeiksi, jotka yhdistettynä toisiinsa muodostavat helposti hallittavan kokonaisuuden – Design Systemin. Se on erillinen työkalu tai alusta, johon on koottuna kaikki yritykseesi liittyvä data ja dokumentointi, digitaalisen tuotteesi yhtenäisen ilmeen ylläpitämiseksi ja tehokkaan jatkokehityksen helpottamiseksi. 

 

Miksi Design System on hyvä asia? 

 

Mielestäni Design Systemin hienous on juurikin siinä, miten se helpottaa eri osastojen ja organisaatioiden välistä työskentelyä sekä edesauttaa yrityksen yhtenäisen brändin hallinnassa. Kun kaikki palapelin palaset ovat tallessa yhdessä laatikossa, on kokonaisuutta helppo tarkastella ja kehittää haluttuun suuntaan. Ja mikä parasta, hyvin rakennettu Design System nopeuttaa ja yksinkertaistaa suunnitteluprosesseja.

 

Design Systemin avulla saadaan torpattua erilaiset ”vahinkolaukaukset” ja ilmeen hallitsematon kehitys, kun kaikkien tahojen käytössä on ajantasaiset tiedot ja selkeä dokumentaatio siitä, miltä ko. yritys näyttää ja kuulostaa. Esimerkiksi luottokoodarisi jäädessä pidemmälle sairauslomalle, mukaan on helppo ottaa uusi kaveri paikkaamaan tilannetta siksi aikaa, ilman pelkoa sivuston totaalisesta räjähdyksestä.


Verkkosivujen kehitys Design Systemin avulla

 

Design System on devaajan pyhä arkisto. Sieltä löytyy kaikki mitä koodari voi tarvita verkkosivujesi kehitykseen liittyen. Eikä ainoastaan se, että sieltä löytyy kaikki, vaan että sen avulla saadaan aikaiseksi puhdasta koodia, joka omalta osaltaan helpottaa myös ajan mittaan kehitystä (ja säästää rahaa!), kun verkkosivuja on aika uudistaa tai päivittää. Suuremmissa verkkosivukokonaisuuksissa voi taustalla työskennellä samanaikaisesti useampikin koodari. Kun heille on jaettuna kaikki samat materiaalit Design Systemin avulla, tulee lopputuloksesta yhtenäinen niin front- kuin back-endin


Mitä hyötyä Design Systemistä on yrityksellesi?


Jos olet alussa valmis panostamaan hieman enemmän aikaa ja rahaa järjestelmän luomiseksi, se maksaa itsensä takaisin nopeasti. Miksi? Kun Design Systeminne on luotu valmiiksi, jatkossa aikaa ei kulu erilaisten komponenttien ja koodin pätkien luomiseen, vaan esimerkiksi tuotekehitys saa varsinaisen tehostartin olemassa olevan aineiston pohjalta. Monesti myös vähänkään isommissa projekteissa voi olla useampia eri toimistoja mukana suunnittelemassa, jolloin materiaalien jakaminen onnistuu tehokkaasti ja keskitetysti, mikä taas edesauttaa nopeiden lanseerausten ja tehokkaiden kampanjoiden luomisessa – brändin menettämättä laatuaan.


Se miten käyttäjä kokee brändisi ja minkälainen päällimmäinen tunne hänelle siitä jää, määrittää sen, palaako hän uudelleen palveluidesi pariin. Design System auttaa hallitsemaan yrityksen brändiä, joka on suorassa yhteydessä loppuasiakkaaseen. Kun esimerkiksi verkkokaupan kokonaisuus on looginen ja helppokäyttöinen, asiakas myös todennäköisesti palaa uudelleen sivuillesi. 


Yksi Design Systemin hienouksista on ennen kaikkea kehittää käyttäjäkokemusta, jonka pohjalta on perusteltua päätyä erilaisiin ratkaisuihin verkkosivuillasi, mikä taas hyvin toteutettuna vaikuttaa brändin tunnettuuteen ja kasvattaa asiakaskuntaa.


Design System elää ja kasvaa yrityksesi mukana, minkä vuoksi on tärkeä muistaa jatkuva dokumentointi ja järjestelmän ylläpito. Design System linkittyy vahvasti digitaalisten tuotteiden ja palveluiden ympärille, mutta tämä sama aineisto on helppo jalkauttaa myös yrityksen muihin materiaaleihin ja markkinointiin. 

 

Netti on täynnä loistavia esimerkkejä Design Systemeistä, joihin on koottu kaikki olennainen yksittäisistä komponenteista ikonien ja elementtien käyttöön, väripalettien kokoamiseen sekä muihin ohjeistuksiin. Käy kurkkaamassa miten esimerkiksi Google on ratkaissut oman Design Systeminsä, Material Designin. Aika vaikuttava kokonaisuus ja helposti kaikkien saatavilla!



Noora Lehto

noora.lehto@buorre.fi

Jatka katsomista

Pysy mukana kehityskulussa

Tilaa uutiskirjeemme ja pysy ajan tasalla markkinoinnin, digipalveluiden ja muotoilun uutisista. Lupaamme inspiroida ja innostaa, emme täyttää sähköpostiasi turhaan!