Tiistaina 25.5.2021

Asiakkaan brändi-ilmeen jalkauttaminen verkkosivulle – Ongelmatonta vai ei?

On brändi-ilmeitä, joiden ohjeistuksissa jokainen asia on mietitty tarkasti ja niistä ei haluta lipsua. Kuinka ne sitten otetaan suunnittelussa huomioon? Saako ohjeistuksista poiketa, jos ne asettavat ongelmia mm. saavutettavuuden kanssa? Mitä jos brändi-ilmettä tai -ohjeistusta ei ole tai se on vajavainen?

Tämä kirjoitus saattaa sisältää vanhentunutta tietoa, sillä se on julkaistu yli 3 vuotta sitten.

Brändiohjeistuksen sisäistäminen

Kun projektia aloitellaan starttipalaverissa yhdessä asiakkaan kanssa, on hyvä käydä läpi myös brändi-ilmettä ja -ohjeistusta, jos sellainen asiakkaalta löytyy. Useimmiten ohjeistus pitää sisällään ohjeistukset vähintäänkin logolle, väreille ja typografialle. Laajemmat ohjeistukset myös mm. kuvitustyylille, tone of voicelle (eli miten asiat ilmaistaan) ja erinäisille graafisille elementeille. Näistä kuitenkin kuvitus ja ToV on sellaisia, jotka ovat enemmän sisällöntuotannon vastuulla.

Suunnittelijan onkin tärkeää sisäistää ohjeistus jokaista kohtaa myöten, jolloin suunnittelun aikana ei tule yllätyksiä tai turhia iteraatioita sen vuoksi, jos ohjeistusta ei ole noudatettu. Vaikka miten suunnittelija haluaisi lähteä revittelemään brändi-ilmeen kanssa, on sen pysyttävä linjassa aina ohjeistuksen kanssa, sillä sitä varten se on luotu että brändi pysyy yhtenäisenä.

Entä jos brändiohjeistusta ei ole?

Jos sen sijaan brändi-ilmettä tai -ohjeistusta ei ole eikä sitä ole verkkosivun uudistuksen yhteydessä tarkoitus tehdä, jättää se tietenkin suunnittelijalle varaa käyttää luovuuttaan ja ehdottaa rohkeammin erilaisia ratkaisuja.

”Tein itse ja säästin” -ratkaisut eivät yleensä ole kovin kannattavia, sillä niistä puuttuu lähes aina jotain oleellista. Siksi brändi-ilmeen tai logon suunnittelu kannattaakin tilata ammattilaiselta, joka osaa ottaa eri käyttötarpeet huomioon.

Parhaimpaan lopputulokseen kuitenkin pääsee, jos suunnittelijataho on vastuussa myös visuaalisen brändin suunnittelusta ja pääsee sen pohjalta etenemään verkkosivun suunnitteluun. Näin brändin jokainen sfääri tulee taatusti sisäistetyksi ja se näkyy luovina visuaalisina ratkaisuina myös verkkosivulla, sillä ohjeistusta tehdessä suunnittelija osaa ottaa huomioon vahvasti myös miltä brändi näyttää verkossa. Se puoli valitettavan usein jää pikkunätin kikkailun varjoon kun visuaalista brändiä luodaan. Hienot asiat listattuna brändiohjeistuksessa ei auta yritystä millään tavalla, jos sitä ei voi hyödyntää käytännössä järkevästi. Koska liiketoiminta on yhä enemmän digitalisoitunutta, on sille annettava entistä suurempi painoarvo myös ohjeistusta laatiessa.

Jos yrityksesi on vaikkapa startup-yritys, tai se on jokin uusi mullistava tuote, kannattaa sen brändäykseen käyttää aikaa, sillä markkinat ovat kovat eikä sieltä sekundalla erotuta jo pelikentällä maineensa tehneistä yrityksistä, ainakaan positiivisesti. Haluat varmasti erottua kilpailijoistasi ja luoda kilpailuetua uskottavuudella, eikö?

Typografia & värit

Hyvissä brändiohjeistuksissa on otettu huomioon printtiin ja verkkoon tarkoitetut fontit, ja ne ovat omaksi ostettuja webbifonttitiedostoineen.

Silloin tällöin tulee kuitenkin vastaan projekteja, joissa brändiohjeistuksen fontti ei ole paras mahdollinen verkkosivutoteutuksiin, ja tällöin ehdotetaan korvaavaa fonttia, joka on lähellä ohjeistuksessa mainittua. Tälläinen tapaus voi olla esimerkiksi kolmannen osapuolen palvelussa (esim. Adobe Fonts, entinen Typekit) oleva fonttiperhe, jonka käyttö hidastaisi verkkosivun latausnopeuksia. Ongelma korjaantuu lataamalla (useimmiten maksulliset) fonttitiedostot toisesta palvelusta tiedostoina.

Siksi suosimmekin joko Googlen webfontteja tai kuten todettua; suoraan fonttipalveluista ostettuja fontteja, joista ne saa ladattua omina tiedostoinaan ja asennettua suoraan palvelimelle ja näin pitäen latausajat sen osalta kunnossa. Kolmannen osapuolen palveluissa on myös riskinsä, sillä jos jokin fontti sattuu poistumaan valikoimasta, poistuu se myös asiakkaan sivuilta koska fontti ladataan kyseisestä palvelusta (em. Adobe Fonts).

Värit ovat ohjeistuksissa usein tarkkaan määriteltyjä ja näiden osalta ongelmia voi ilmentyä lähinnä värisokeiden osalta. Siksi onkin hyvä miettiä kuinka brändivärejä verkkosivulla hyödyntää. Hyvässä ohjeistuksessa nämäkin ongelmat ovat jo valmiiksi kampattu.

Logot

Logot, nuo yleisimmät murheenkryynit ovat suunnittelijalle usein se kuuluisa kanto kaskessa, jos sen suunnittelussa ei ole otettu huomioon eri käyttötarkoituksia. Logosta pitäisi olla aina pari versiota, joita voi hyödyntää tiettyihin tarkoituksiin. Jos mietitään nyt nimenomaan verkkosivua ja sen navigaatiota, väittäisin, että n. 95% sivustoista käyttää suhteellisen matalaa navigaatiota, jonka sisään logo on asetettu. On kuitenkin brändejä, joiden logo on suunniteltu vain ja ainoastaan pystylogoksi, eikä vaakatasoista logoa ole suunniteltu lainkaan. Tämä luonnollisesti asettaa haasteensa sen asettelulle ja jolloin kuullaan usein fraasi ”Saisiko logon isommaksi?”. Tämä taas pilaa visuaalista harmoniaa, jos logoa joudutaan sen pystykoon vuoksi suurentamaan ja tämä taas tekee navigaatiosta usein korkeamman, vain siksi, että se saadaan mahtumaan sinne paremmin.

Ratkaisuna tähän on yksinkertaisesti se, että logosuunnittelussa olisi hyvä tehdä aina vaaka- ja pystyversiot, tarpeen mukaan myös ikoniversio, jota voi käyttää mm. sovellusten ikonina. Mutta ainakin edes se vaakaversio, koska sen käyttömahdollisuudet ovat monipuolisemmat kuin pystylogossa.

Alla Walt Disneyn logosta tehdyt variaatiot, jotka soveltuvat hienosti eri käyttötarkoituksiin.

Kuvitus ja graafiset elementit

Kuvituksella on iso rooli koko verkkosivun yleisilmeessä, vaikka värit ja typografia olisikin kunnossa. Suunnittelijan rakentamassa sivuston prototyypissä ns. placeholder-kuvat (esim. kuvapankkikuvat) saattavat näyttää kivalta, mutta ei niitä todennäköisesti tulla kuitenkaan käyttämään julkaistavalla verkkosivulla. Jos asiakkaalla ei itsellään ole laadukasta kuvitusta käytössä, olemme yleensä suositelleet omaa hovikuvaajaamme Emmi Virtasta hoitamaan homman.

Ja jos brändiohjeistus olisi samaan aikaan työnalla, voidaan samalla määritellä linjaukset kuvausten pohjalta myös tulevaisuutta ajatellen, jolloin brändi ei lähde niin sanotusti leviämään heti kättelyssä tältä osin.

Myös erinäiset graafiset elementit voivat olla tärkeä osa kokonaisilmettä. Ne voivat olla verkkosivulla yksinkertaisimmillaan vaikkapa pallukoita, joita käytetään osioiden ja lohkojen yhteydessä sopivan hillitysti. Niillä tuodaan sivuston yleisilmeeseen eloa ja syvyyttä.

Onko visuaalinen brändisi jämähtänyt?

Brändin olisi hyvä kehittyä kokoajan, eikä yksi uudistus jaksa kantaa vuosia eteenpäin ilman jatkuvaa kehitystä ja viilausta. Teemme Dudella verkkosivujen suunnittelun lisäksi uniikkeja ja nykyaikaisia brändi-ilmeitä, jotka pyyhkivät kilpailijoilla lattiaa ja olemme valmiita myös auttamaan niiden jatkokehityksessä.

Käy tutustumassa myös muutamiin tekemiimme töihimme, joissa asiakkaan brändi on jalkautettu vahvasti mukaan verkkosivustolle: Mediashake, Atena Kustannus, Arkkitehti-lehti, Tahto Group ja Suomen Kustannusyhdistys.

Ota siis ihmeessä yhteyttä, jos tuntuu siltä, että brändisi on päässyt ajan saatossa hieman väljähtymään ja kaipaisi uudistusta tai sen jalkauttamisessa verkkoon ei edellisellä kerralle ole onnistuttu toivomallasi tavalla.

Ole uskottava.