Varaa keskustelu
Profession multibrand design systeemi

Multibrand design systeemi kolmen digipalvelun uudistukselle

Professio Group keskittää kolme brändiään samaan WordPress monisivustoon. Tavoitteena on yhtenäinen käyttökokemus ja sisällönhallinta, mutta samalla säilyttää brändien omat, vahvat identiteetit. Tätä tavoitetta tuimme suunnittelemalla Professio Groupille yhteisen design systemin (suunnittelujärjestelmän), jonka kaikki kolme brändiä jakavat. Modulaarinen, design tokeneita hyödyntävä design system mukautuu saumattomaksi kunkin nykyisen (ja tulevan) brändin ilmeeseen.

LÄHTÖKOHTA

Kolme brändiä, yksi alusta

Professio Group halusi koota kolme brändisivustoaan yhdeksi WordPress monisivustoksi. Tavoitteena oli yhtenäistää käyttökokemus tinkimättä yksittäisten brändien tunnistettavuudesta.

STRATEGIA

Yhtenäinen mutta yksilöllinen

Sen sijaan, että olisimme suunnitelleet kolme sivustoa erikseen, loimme yhden skaalautuvan design systemin. Se palvelee nykyisiä brändejä, mutta mahdollistaa myös uusien tuomisen mukaan myöhemmin. Näin sivustot jakavat saman teknisen rakenteen, vaikka ulospäin ne näyttävät erilaisilta.

STRATEGIA

Skaalautuvuuden ei tarvitse olla tylsää

Uskomme, ettei jaetun alustan tarvitse tarkoittaa tasapaksua lopputulosta. Strategiamme ydin oli rakenteen ja visuaalisuuden erottaminen. Lopputuloksena on modulaarinen design systeemi, joka hyödyntää design tokeneita ja mukautuu näin jokaisen kolmen brändin tarpeisiin.

TOTEUTUS

Näin kokonaisuus rakentui

Professio Design System -kirjasto on meidän single source of truth. Se sisältää sekä suunnittelukomponentit että niiden dokumentaation. Jokaisella brändillä on oma Figma-tiedostonsa, joka hyödyntää tätä jaettua Professio Design System -kirjastoa.

Komponenttikirjasto
Värijärjestelmä
Typografia

Professio Design System -kirjasto sisältää yli 100 Figma-komponenttia. Jokaiselle komponentille on määritelty omat variaatiot ja ominaisuudet, ja laadittu dokumentaatio.

Hyödynsimme työssä atomista suunnittleumetodologiaa: järjestelmä on rakennettu nousevasti pienimmistä muuttujista aina laajoihin lohkomalleihin.

Värijärjestelmä on kattava ja joustava. Se rakentuu brändiväreistä, neutraaleista sävyistä sekä semanttisista väreistä. Kaikki kolme brändiä jakavat samat neutraalit ja semanttiset värit, kun taas brändikohtaiset paletit muodostuvat kunkin brändin omista pääväreistä.

Eri bränditeemojen lisäksi järjestelmä tukee sekä tummaa että vaaleaa tilaa.

Typografia toimii identiteetin selkärankana ja varmistaa yhtenäisen ilmeen kaikissa kanavissa. Valitun kirjaintyypin neutraali ja moderni muotokieli tukee brändin selkeyttä ja luettavuutta. Samalla kirjaintyypin useat eri leikkaukset tarjoavat luovia mahdollisuuksia vaihtelevien tapahtumailmeiden ja kampanjoiden toteuttamiseen.

TOTEUTUS

Yhteinen kokemus ja ylläpidettävyys parantui

Yhteinen design system parantaa käyttökokemusta kaikilla kolmella sivustolla (Professio, Mif ja Tieturi), säilyttäen samalla kunkin brändin tunnistettavuuden. Skaalautuva järjestelmä tehostaa työtä tarjoamalla suunnittelijoille ja kehittäjille yhteisen kielen. Ratkaisu helpottaa merkittävästi myös sivustojen ylläpitoa ja jatkokehitystä: sisällöntuottajien tarvitsee hallita vain yksi järjestelmä päivittääkseen kaikkia kolmea sivustoa. Tällä hetkellä uusi design system on otettu käyttöön Profession sivustolla, ja kahden muun brändin käyttöönotto on käynnissä.

Aiheeseen liittyvät palvelut

Design systeemi
Palvelumuotoilu
varaa keskustelu

Käynnistä designuudistus

Valitse aika, käydään teidän tarpeet läpi ja aloitetaan suunnittelu.