Millainen on hyvä B2B-verkkokauppa?

Nyt jos koskaan verkkokaupat ovat nousseet merkittäväksi osaksi yritysten liiketoimintaa. Vallitseva koronapandemia on tuonut tullessaan haastavat ajat monelle yritykselle ja siirtänyt liiketoiminnan painopistettä entistä voimakkaammin verkkoon. Pelkkä poikkeustilanne ei yksistään ole kuitenkaan syy verkkokauppojen suosiolle. Digitalisaation myötä verkkokauppa on kasvanut jo hyvän tovin kuluttajapuolen lisäksi myös B2B-sektorilla. Huolella suunniteltu sekä visuaalisesti ja teknisesti toimiva B2B-verkkokauppa tehostaa liiketoiminnan prosesseja ja toimii tehokkaana myynnin kanavana.

Kylmää ja kasvotonta kauppaa vai timanttista palvelua? Miksi B2B-verkkokauppa kannattaa?

En tiedä tarvitseeko tätä edes sanoa, mutta todetaanpa nyt silti: faksien ja sähköpostiin naputettavien tarjouspyyntöjen tai sähköisten tilauslomakkeiden aika alkaa siintämään kovaa vauhtia ohi! B2B-verkkokaupan kautta prosessien automatisointi ja toimintojen integroiminen tehostavat liiketoimintaa sekä säästävät aikaa. Turhien manuaalisten työvaiheiden poistuminen tekee samalla yrityksestä myös asiakkaalle houkuttelevamman vaihtoehdon.

Parhaimmillaan B2B-verkkokauppa voi edelläkävijyyden myötä olla myös vahva kilpailuetu. Verkkokauppaa voisi B2B-sektorilla luonnehtia ennemminkin tilausjärjestelmäksi kuin verkkokaupaksi.

B2B-verkkokaupoissa ostajat ovat mitä todennäköisimmin myös kuluttajaverkkokauppojen asiakkaita. Niinpä heidän ostokäyttäytymisensä ohjautuu verkkoon luontevasti ja ostaminen koetaan mielekkääksi tehdä verkosta silloin, kun itselle sopii.

Vaikka usein verkkokauppa mielletään etenkin yrityspuolella kylmäksi ja kasvottomaksi kanavaksi, on se hyvin toteutettuna kaikkea muuta. Verkossa asiointi on paitsi helppoa, myös joustavaa ollessaan aikaan ja paikkaan sitomatonta.

Verkkokauppa vahvistaa asiakaskokemusta ja konversioiden lisäämistä tukien samalla yrityksen kilpailukyvyn säilyttämistä. Verkkokaupan saumattoman ostoprosessin, asiakaskohtaisten kustomointien sekä esimerkiksi chatbottien avulla asiakaskokemuksesta saadaan jouheva ja ehyt. Ostaisit varmaan itsekin uudestaan verkkokaupasta, jossa homma sujuu?

Mitä kannattaa huomioida?

Aivan kuten B2C-puolella, valtaosa B2B-ostajista suuntaa tiettyä tuotetta tarvitessaan Googleen. Kuluttaja-asiakkaista poiketen B2B-ostajat ovat pääsääntöisesti varusteltu oman alansa asiantuntemuksella ja heillä on jo valmiiksi selkeä käsitys, siitä mitä ovat ostamassa. Niinpä tuotekuvien ja spesifien tuotetietojen sekä videoiden, oppaiden ja muun tukimateriaalin saatavuuden merkitys korostuu B2B-verkkokaupassa.

Asiakaspalvelun saatavuuteen on syytä kiinnittää erityistä huomiota, sillä myös yrityspuolella ostaja odottaa usein kysymyksiinsä nopeaa reagointia ja asiantuntevaa vastausta. Mitä paremmin B2B-verkkokauppa vastaa ostajan tarpeita suoraviivaisella ja nopealla ostoprosessilla, sen todennäköisemmin hänet saadaan sitoutettua käyttämään verkkokauppaa jatkossakin.

Sujuvasti toimivaan B2B-verkkokauppaan kannattaa satsata reippaasti niin aikaa kuin panoksiakin, sillä parhaimmillaan sen kautta saavutetaan konversioita ja pitkään kestäviä asiakassuhteita.

Poimi parhaat jutut kuluttajakaupoista

Pyörää ei tarvitse tämänkään aiheen tiimoilta keksiä uudelleen. Verkkokaupoissa on paljon lainalaisuuksia, jotka toimivat niin kuluttajaverkkokaupassa, kuin B2B-puolella. Käyttäjäkokemus, jonka perään usein kuulutan, pelaa merkittävässä roolissa molemmissa verkkokauppatyypeissä.

Luotettavuus, selkeys, selailun ja hakemisen helppous sekä kattavien tuotetietojen saatavuus ovat ihan yhtä tärkeitä käyttäjälle, oli kyseessä sitten yritysten välinen kaupanteko tai kuluttajien verkkokauppashoppailu. Käy ottamassa haltuun vinkkimme verkkokaupan käyttökokemuksen parantamiseksi!

Sitouta asiakkaasi personoidulla verkkokaupalla

48 % asiakkaista käyttää verkko-ostoksiinsa enemmän rahaa, kun verkkokauppa on personoitu. Lisäksi erityisesti B2B-puolella on totuttu tarjoamaan räätälöityjä ratkaisuja eri asiakkaille. Seuraava kysymys varmasti kuuluukin, että mites homma ratkaistaan sitten verkkokaupassa?

Hyvin personoidulla verkkokaupalla kohdataan asiakkaan vaatimukset sekä haasteet ja vastataan tarpeisiin siten, että asiakkaan ei tarvitse lähteä etsimään parempaa muualta. B2B-verkkokaupan toteutuksessa on mahdollista räätälöidä eri tuotenäkymä, hinnat ja toimitusvaihtoehdot tai -maksut eri asiakkuuksille.

Usein B2B-verkkokaupat rakennetaan siten, että hinnat ja ostomahdollisuus tarjotaan vasta kirjautuneille asiakkaille, mikä mahdollistaa sen, että kullekin asiakkaalle tai asiakasryhmälle voidaan tarjota juuri heille räätälöityjä ratkaisuja. Personoitu sisältö helpottaa asiakasta löytämään tarvitsemansa sekä mahdollistaa helpomman lisämyynnin esimerkiksi asiakasprofiilin perusteella suositelluilla tuotteilla antaen samalla eväät kestävän asiakassuhteen hoitoon.

Sujuvalla ostoprosessilla helpotat asiakkaasi arkea

Sinisen Härän Mikkoa siteeratakseni ”Verkkokaupassa asioinnin tulisi olla yhtä helppoa kuin kauramaidon hakeminen lähikaupasta pikakassan kautta”. Otetaanpa ihan esimerkkinä: kauramaito loppui ja lähdet hakemaan sitä lähimmästä kaupasta. Kaikki kaupat on suunniteltu suhteellisen samalla rakenteella, joten tiedät, miten kaupassa kuljet, nappaat kauramaidon kyytiin ja kävelet itsepalvelukassan kautta MobilePayta kortinlukijaan vilauttaen takaisin kahvikupposesi ääreen! Sulla on tarve, jonka saat nopeasti täytettyä. Myös B2B-verkkokauppa-asioinnin tulisi olla yhtä helppoa.

Verkkokaupan huolella ja loogisesti suunnitellun käyttöliittymän lisäksi on hyvä huomioida ominaisuuksissa myös se, että asiakkaalle kriittiset vakiotuotteet ovat helposti löydettävissä. Tähän onkin olemassa ihan loistavia ratkaisuja.

Jos kohderyhmääsi kuuluvien vakio-ostajien täytyy säännöllisin väliajoin tilata joitakin tiettyjä tuotteita verkkokaupastasi, kannattaa tästä ottaa täysi hyöty irti verkkokaupan oma tili -osiosta. Oman tilin kautta asiakas voi paitsi seurata tekemiään tilauksia, myös kopioida sen uudeksi tilaukseksi.

Jos tuotetilausta haluaa kerätä pikkuhiljaa tarpeen mukaan, voidaan käyttäjälle tarjota mahdollisuus kerätä toivelistaa, jonne asiakas voi klikata haluamiaan tuotteita ja lisätä ne sieltä ostoskoriin vaivattomasti. Kun asiakkaalta on edellytetty kirjautuminen verkkokauppaan oston tekemiseksi, ovat myös toimitusosoite- ja laskutustiedot valmiiksi mintissä, joten tilaus on sillä selvä.

B2B-verkkokaupan lyhyt oppimäärä

  1. Panosta B2B-verkkokaupassa käyttökokemukseen, kattaviin tuotetietoihin ja hakutoimintoihin
  2. Personoi sisältö asiakkuudelle sopivaksi: näytä juuri tälle asiakkaalle räätälöidyt tarjoukset, hinnanalennukset sekä täsmätuotteet.
  3. Tee ostoprosessista mahdollisimman helppo ja vaivaton

Onko yritykselläsi suunnitelmissa uuden verkkokaupan rakentaminen tai vanhan uudistaminen?

Ota yhteyttä meidän projektipäällikköön Mikkoon, niin jutellaan lisää!

Kuinka rakentuu visuaalisen ilmeen workshop

Visuaalisen ilmeen suunnittelu on suurimmilta osin brändityötä. Ilme pohjautuu aina brändin arvoille ja toiminnalle sekä sille, miltä visioimme brändin tuntuvan ja näyttävän kohderyhmille. Tämän myötä visuaalisen ilmeen suunnitteluprosessimme tarkoittaakin hieman asioiden syvempää kaivelua brändistä erilaisten tehtävien avulla.

Tehtävien määrä ja laajuus vaihtelee keissistä toiseen, mutta workshop rakentuu aina vähintään neljästä erilaisesta, eri aisteja hyödyntävistä tehtävistä.

Jos brändi olisi eläin, niin mikä eläin se olisi? Esimerkiksi ”kuningas” leijona tai karhu, itsenäinen kotka, lojaali koira jne.

Tämä tehtävä on hyvä jäänrikkoja workshopin alkuun. Keskustelu eläimistä tuntuu monesti alkuun hassulta ja vähän lapselliseltakin, mutta eläimiin liittyvistä keskusteluista on tullut poimittua mitä merkityksellisempiä timantteja. Kaikilla on mielikuvia ja merkityksiä eri eläimille, ja yhteisessä keskustelussa täältä löydetään hyviä vastaavuuksia brändin tavoittelemiin mielikuviin.

”20 second gut-test” – eli vapaasti suomennettuna 20 sekunnin ensifiilis

Tehtävä koostuu 10–20 erilaisesta sivustosta, joita jokaista katsotaan 20 sekunnin ajan. Sivustolle annetaan arvosana 1–5 sen perusteella, kuinka todennäköisesti haluttaisiin, että oma brändi näyttäisi tämän sivuston kaltaiselta. Vapaisiin kommentteihin on tietysti myös mahdollisuus.

Meillä tätä on testattu 10 ja 20 sivustolla, ja olemme itse kokeneet 20 eri sivustoa jo hieman puuduttavaksi. 10 sivustoon mahtuu kuitenkin monen monituista erilaista vaihtoehtoa. Tärkeintä on valita visuaalisesti sekä käyttökokemukseltaan mahdollisimman erilaisia sivustoja.

Moodboard, eli kollaasitaulut erilaisista tunnelmista

Kun workshopin aiheena on visuaalisuus, olisi tuhlausta käydä keskusteluja vain sanoilla, adjektiiveja käyttämällä. Kaikilla meillä voi nimittäin olla täysin eri mielikuva esimerkiksi raikkaasta tai hempeästä ulkoasusta.

Tämän takia rakennan workshopiin aina neljä erilaista moodboardia, joiden kuvittelen edustavan kyseisen asiakkaan brändin vaihtoehtoisia tyylisuuntia. Tässä käytän apuna rohkeasti omia ennakkoluulojani, ja perustan vaihtoehdot omille mielikuville, asiakkaan kanssa käydyille keskusteluille ja kilpailijoiden benchmarkkaukselle.

Esimerkkinä viimeisimpänä pitämäni workshopin neljä erilaista tyylisuuntaa: modernin minimalistinen, romanttinen rustiikki, rustiikki artesaani ja kotoisan lämmin.

Esimerkki workshopin moodboardista.
Esimerkki workshopin moodboardista.

Moodboardeja tarkastellaan ensin kaikessa hiljaisuudessa yksi taulu kerrallaan, ja jälleen pyydän asiakasta arvioimaan moodboardin arvosanalla 1–5: kuinka todennäköisesti oma brändi muistuttaa kyseistä moodboardia. Pyydän myös valitsemaan suosikkikuvan perusteluineen.

Tämän jälkeen yhteisillä keskusteluilla löydämme hyvin suuntaa sille miltä ilme potentiaalisesti voisi näyttää ja mitkä tyylit sekä kuvat ovat ehdottomia inhokkeja.

Etusivun uutiset 10 vuoden päästä

Ajatusleikki, jota itse rakastan! Tämä tehtävä on mielestäni kaikille yrityksille loistava tapa kirkastaa ja konkretisoida visioita ja unelmia.

Tehtävänä on siis kuvitella, että jos yritys olisi tekojensa tai palveluidensa vuoksi etusivun uutinen kymmenen vuoden päästä, niin mikä olisi uutisoinnin aihe? Mitä niin merkittävää, poikkeuksellista tai innovatiivista yritys on tehnyt, että siitä uutisoidaan lehden etusivulla? Lehti voi olla Helsingin Sanomat tai oman alan aikakauslehti, se ei ole merkityksellistä tehtävän kannalta.

Brändin persoonallisuus-spektri

Tämän tehtävän tarkoituksena on selventää adjektiiviparien avulla brändiä kuvaavia sanoja. Spektrille asetetaan sanapareja ja asiakkaan tulee tiimityöllä valita, mihin kohti brändi spektrillä sijoittuu.

Sanaparit eivät ole toistensa vastakohtia, minkä takia tämä tehtävä onkin niin kinkkinen – monesti kun haluttaisiin olla vähän kaikkea! Tässäkin tehtävässä tärkeintä on kuitenkin juuri se herännyt keskustelu aiheesta.

Oma spektrimme näyttää tällä hetkellä tältä, mutta pääsee kehityksen alle vielä tänä keväänä.

Kollaasitaulun rakennus

Edellisen tehtävän spektrin perusteella rakennetaan yhdessä kuvakollaasi/moodboard, johon kerätään sopivan oloisia kuvia brändiä kuvaamaan.

Asettelen asiakkaalle yllä olevan spektrin adjektiiveja vastaavia kuvia näytille, ja näistä asiakas valitsee yhden kuvan per ryhmä. Tässäkin tehtävässä monesti ne ”tämä ei ainakaan kuvaa meitä” -kuvat kertovat todella paljon siitä mitä ollaan ja mitä ei olla.

Lopuksi valitut kuvat kootaan kollaasiksi ja keskustellaan kuvista yhteisesti.

+ Ostajapersoonat

Usein pienten aloittelevien yrittäjien kanssa työskennellessämme käymme läpi vähintään pintapuolisesti ostajapersoonia ja rakennamme kaksi suuntaa antavaa ostajapersoonaa erilaisten kysymysten avulla.

Osassa tapauksista ostajapersoonat on jo aiemmassa brändin kehittämistyössä lyöty lukkoon, ja osassa tapauksia täydennämme ostajapersoonia tarvittaessa myöhemmin laajemmalla panostuksella.

Workshopissa on meillä aina mukana fasilitaattorin lisäksi kirjaa pitävä tyyppi, ja näiden muistiinpanojen perusteella visuaalinen suunnittelu pääsee vauhtiin. Lue täältä vinkkejä visuaaliseen työpakkiin ja täältä taustasyitä visuaalisen ilmeen suunnittelulle.

Burgerjoint.fi-sivustolle pronssia Finnish Web Awardsissa

Pronssi on voitettu, hopee hävitty 🥉

… tai näin ainakin sanottiin aina, kun junnuvuosina jääkiekkoturnaus päättyi pettymykseen pronssimitalit kaulassa. Huolimatta junnuvuosien voiton mentaliteetista, tästä pronssimitalista ollaan koko Sinisen Härän tiimin enemmän kuin ylpeitä!

Kuten täällä blogissakin tuossa kesän korvilla huudeltiin, niin osallistuimme toistamiseen Finnish Web Awardsiin (neitsytvuonna pokattiin Gold- ja Paras blogi -palkinnot Hatsolo.fi sivustolla). Tällä kertaa Euroopan parhaista burgereista palkitun Social Burgerjointin keväällä 2019 uusitulla sivustolla. Ja kuten otsikosta näkee, niin kovassa joukossa pronssimitalihan sieltä napsahti!

Sanotaanko näin, että ei hävitty huonoille. Kilpailun aatelia (eli Grand Prix -palkinnon voitti) edusti suorastaan dramaattinen ruokangas.com-sivusto. Seuraavan Gold-sijan jakoivat Kiss My Turku -sivusto ja Helsingin uuden kirjaston Oodin sivusto. Sinisen Härän suunnitteleman ja toteuttaman Burgerjoint.fi-sivuston kanssa jaetulla pronssipallilla seisoivat Contrast Digitalin suunnittelema makiaclothing.com sekä Gigantin itsensä kehittämä gigantti.fi.

Kilpailun edustajisto luonnehti finalisteja seuraavasti:

Kilpailun taso oli edelleen maamme kovinta ja oli ilo saada esitellä työnne. Palkinnot toimitetaan voittajille henkilökohtaisesti ja vuoden 2020 kilpailun suunnittelu on jo hyvässä vauhdissa. Jokainen osallistunut sivusto edusti erinomaista osaamista.

Lue halutessasi myös tarkempi kuvaus Social Burgerjointin verkkosivuprojektista referenssiartikkelin muodossa.

ISO KIITOS taas kaikille yleisöäänestyksessä äänestäneille, Social Burgerjointin jengille ja tietysti Finnish Web Awardsin järjestäjille!

Pitäiskö tehdä teillekin mitalin arvoiset verkkosivut?

Vallilassa Sinisen Härän toimistolla todistetusti valmistuu mitalin arvoisia verkkosivuja. Jos teillä on tarvetta uudistukselle, haluat saada varmistuksen nykyisen sivuston toimivuudesta tai muuten vaan morottaa, niin klikkaa itsesi ottamaan yhteyttä tai tilaa ilmainen arvio verkkosivuista alta. ⤵️

Tilaa ilmainen arvio

TOP 7 – Parhaat WordPress-lisäosat

Lisäosa, englanniksi plugin, devaajaksi plugari. WordPressin lisäosakirjastossa on tällä hetkellä ladattavissa 55 464 lisäosaa erilaisiin tarkoituksiin. Lisäosilla verkkosivustoon saadaan helposti käytännöllisiä lisätoiminnallisuuksia ja ominaisuuksia ilman riviäkään omaa koodia – näppärää! Tohdin väittää, että harvassa ovat ne WordPress-sivustot, joilla ei olisi ainuttakaan lisäosaa ladattuna. Tässä artikkelissa käyn nopeasti läpi, mitä on hyvä ottaa huomioon ennen WordPressin lisäosien lataamista ja vinkkaan Sinisen Härän työkalupakista 7 parasta lisäosaa.

Lisäosat, uhka vai mahdollisuus?

Vaikka omaa työtä helpottavien WordPress-lisäosien lataaminen sivustolle onkin parin klikkauksen päässä, kannattaa varoa, ettei talsi suoraan sudenkuoppaan. Kuten jo mainitsinkin, lisäosakirjastossa on aikamoinen kirjo erilaisia lisäosia, joista kaikki eivät ole todellakaan parhaan käytännön mukaisia. Vanhentuneet, sivuston teeman tai muiden lisäosien kanssa yhteensopimattomat lisäosat voivat heikentää tietoturvallisuutta tai kuormittaa sivuston latausnopeutta ja toimivuutta. Loppujen lopuksi riittää, että lataat sen yhden lisäosan, joka ei ole yhteensopiva jonkin toisen lisäosan kanssa, tai jossa jokin koodinpätkä ei ollutkaan ihan kohdillaan ja tyylikäs sivustosi muuntautuu järjettömän näköiseksi sotkuksi rikkoontuneilla toiminnoilla. Not fun.

Siispä mitä vähemmän lisäosia sivustolla on, sen parempi.  Kuitenkin huolella valitut lisäosat helpottavat verkkosivuston ylläpitämistä ja parantavat käyttökokemusta. Oma suositukseni onkin, että kun jonkin ominaisuuden saitille halajaa, kannattaa tehdä vähän taustatyötä lisäosan ajantasaisuudesta, käyttäjäarvioista, ominaisuuksista, tuesta sekä yhteensopivuudesta ennen Lataa-napin painamista.

Parhaat WordPress-lisäosat

Meillä on käytössämme oma kustomoitu WordPress-teema, jonka pohjalle rakennamme asiakkaillemme räätälöidyt verkkosivut ja -kaupat. Suuri osa saittien kustomoinnista pystytään hoitamaan koodilla, mutta täysin ilman lisäosia mekään emme kuitenkaan selviä. Niinpä seuravaksi tulee perusteluineen parhaat lisäosat, joita me käytetään sivustoprojekteissamme – olkaapa hyvät!

Advanced Custom Fields Pro eli lyhyemmin ACF

Advanced Custom Fields Pro on maksullinen lisäosa, joka nimensä mukaisesti mahdollistaa kustomoitujen lisäkenttien lisäämisen WordPressin editointinäkymään. Käytännössä WordPressin perusmuokkaimessa oletuksena olevien tekstieditorin, artikkelikuvan ja kategorioiden lisäksi näkymään saadaan joustavasti lisättyä lisää tekstikenttiä, kuvia, videoita… Aika lailla mitä vaan.

Me käytetään ACF:ää kaikissa sivustoprojekteissamme. Rakennamme sivustot dynaamisesti helpottaen siten sivuston sisältöjen päivitettävyyttä asiakkaiden kannalta. ACF antaakin reilusti mahdollisuuksia räätälöidä WordPressin perusmuokkainta halutulla tavalla.

CPT UI Custom Post Type

Custom Post Type eli CPT kuuluu ehdottomasti vakiovarusteisiin Sinisen Härän saittiprojekteissa. Sen syvemmälle WordPressin perusajatukseen menemättä, WP:n julkaisualustassa on kaksi tapaa lisätä sisältöä sivustolle: sivut ja artikkelit. CPT-lisäosan avulla sivustolle saadaan lisättyä kustomoituja artikkelityyppejä, kategorioita ja taksonomioita. Niin ja mikä parasta, tämä lisäosa toimii ACF-lisäosan kanssa saumattomasti yhteen!

Sivustoprojekteissamme CPT-lisäosan avulla tehdään omia kustomoituja artikkelityyppejä muun muassa erilaisille palveluille, tapahtumille tai vaikkapa ruokalistoille. CPT-osiot nousevat WordPressin ohjausnäkymään omana osionaan (aivan kuten artikkelit) ja niiden hallinnointi on siten tehty käyttäjälle helpoksi. Esimerkiksi, kun asiakas haluaa lisätä uuden palvelun sivustolleen, tämän ei tarvitse, kun täyttää (luonnollisesti ACF:llä kustomisti lisätyt) sisältökentät halutuilla sisällöillä ja valmista tuli. Palvelulistaus ja palvelun oma sivu haetaan dynaamisesti verkkosivustolle ennalta määriteltyjen ulkoasujen mukaisesti, joten mitään ulkoasuun liittyvää osaamista ei tarvita.

Yoast SEO / Rank Math

Verkkosivuston hakukoneoptimoinnista huolehtiminen on eittämättä melkoisen merkittävässä roolissa nykyaikana. Jos siis meinasit selvitä mahdollisimman pienellä määrällä lisäosia, niin hakukoneoptimoinnin lisäosaa ei kannata ensimmäisenä tipauttaa pois ladattavien lisäosien listalta. Meillä hyviksi todettuja SEO-lisäosia ovat Yoast SEO ja Rank Math. Molemmissa ehdoton etu on se, että yhdellä lisäosalla saat käyttöösi kokonaisen hakukoneoptimoinnin työkalupakin, joka sisältää käytännössä kaiken mm. avainsana-analyysistä, sivustokarttoihin, metatietojen muokkaamiseen sekä tekstisisällön optimointiin.

LiteSpeed Cache

Sivuston latausnopeus vaikuttaa paitsi sivuston käytettävyyteen, myös sen sijoittumiseen hakukoneiden hakutuloksissa. LiteSpeed Cache on ilmainen lisäosa verkkosivuston kokonaisvaltaiseen latausnopeuden optimointiin.  LiteSpeed -lisäosa tallentaa välimuistia koko sivustolta palvelintasoisesti, mikä parantaa sivuston latausnopeutta merkittävästi enemmän, kun vain pelkän sivuston välimuistia tallentavat lisäosat.  Lisäksi se sisältää kattavat työkalut sivuston nopeuden optimoimiseksi, minkä vuoksi se asennetaankin oletuksena meidän tekemille sivustoille sivuston latausnopeutta parantamaan.

WooCommerce

WooCommerce on ilmainen ja ylivoimaisesti suosituin verkkokauppalisäosa WordPressille. Se on kevyt ja avoimeen lähdekoodiin perustuva lisäosa, joka taipuu moneen käyttötarkoitukseen, oli kyseessä sitten iso tai pieni verkkokauppa. WooCommerce on helposti räätälöitävissä ja siihen on saatavilla erilaisia lisämoduuleja niin WooCommercen omasta lisäosatarjonnasta kuin muista WooCommercen kanssa yhteensopivista lisäosista. Sinisellä Härällä WooCommercea on käytetty niin suurten verkkokauppojen (Suomen Luonnonmaalit) rakentamiseen kuin katalogimallisten verkkosivustojen tekemiseen (Biozell).

Redirection

Uudelleenohjausten tavoitteena on huolehtia siitä, että käyttäjä ohjataan esimerkiksi Googlesta oikeaan osoitteeseen, vaikka sivuston osoite olisikin muuttunut. Näin säilytetään vanhalla sivulla saavutettu hakukonenäkyvyys ja estetään kävijän eksyminen 404-sivuille. Uudelleenohjaustyypeissä on eroja ja niillä on myös oma merkityksensä hakukonenäkyvyydessä. Siksi kannattaakin olla tarkkana, minkä uudelleenohjauksen valitsee. Käydäänpä nopeasti tähän väliin vielä uudelleenohjausten erittäin lyhyt oppimäärä:

  • 301-uudelleenohjaus > Pysyvä
  • 302-uudelleenohjaus > Väliaikainen
  • 303-uudelleenohjaus > Korvattu

Me huolehdimme Sinisellä Härällä sivuston uudelleenohjaukset Redirection-plugarilla, joka on ilmainen ja hyväksi todettu lisäosa sivuston uudelleenohjausten hallinnointiin. Redirectionilla pystytään toteuttamaan muun muassa ehdollisia uudelleenohjauksia ja saamaan logeja 404 erroreista sekä aktiivisista uudelleenohjauksista.

Polylang Pro

Kun sivustolle ei riitä yksikielinen toteutus, ovat käännöstyöhön tarkoitetut lisäosat, kuten Polylang korvaamaton apu. Polylang Pro-lisäosalla sivuston sisältöjen käännöstyöt onnistuvat  helposti ja käyttölogiikaltaan yksinkertaisesti. Sinisellä Härällä monikieliset sivustototeutukset hoidetaan Polylang Prolla sen tarjotessa kattavat integraatiot myös Custom Post Typejen sekä ACF-kenttien käännöksiin.

Tilaa arvio verkkosivujesi nykytilasta

Hyvät verkkosivut tarkoittavat meille teknisesti ja visuaalisesti toimivia, mutta ennen kaikkea myyntiä tukevia kokonaisuuksia. Verkkosivut ovat monesti asiakkaan ja yrityksen ensimmäinen myyntikohtaaminen, eikä markkinoinnista saada kaikkea irti, mikäli sivusto ei tue mainonnan tavoitteita.

Tilaa ilmainen arvio

Vieraskirjoitus: Leadoo – Konversiot kuntoon paremmalla asiakas­kokemuksella

Se fiilis kun kaivelet nettisivun trafiikkidataa Google Analyticsista ja tarkistat sen jälkeen, kuinka moni kävijöistä lopulta konvertoitui haluttuun toimintaan. Ei kovin rohkaisevia lukuja, vai mitä? Esittelen tässä jutussa yhden keinon tarjota kävijöille parempi asiakaskokemus (CX) ja kerätä sen myötä enemmän konversioita. Taikasana on interaktiivisuus ja sauvana keskustelevat botit. Asiaan.

Asiakaskokemuksen ja konversioiden välinen yhteys

Matala konversioaste on selkeä merkki vähemmän kuin mahtavasta nettisivun asiakaskokemuksesta (tässä kohtaa voisi puhua myös UX:stä). Hyvät uutiset tulevat tässä: et ole yksin matalan konversioasteesi kanssa. B2B-sivustojen konversiot roikkuvat yleisesti 1–3% syvyydessä. Tässä vielä toinen hyvä uutinen: heikon CX:n voi elvyttää interaktiivisten sisältöjen avulla.

 

Kääntäen voidaan sanoa, että konversiot ovat suora palkinto siitä, että olet tarjonnut sivustosi kävijöille helpon ja kivan asiakaskokemuksen. Me kaikki olemme asiakkaita – käytämmehän jos jonkinlaisia yritysten sivustoja aamusta iltaan. Fyysisistä kohtaamisista puhumattakaan. Siksi on oikeastaan aika helppoa ymmärtää, mitä loistava CX edellyttää. Riittää kun mietit, mikä tekisi kokemuksesta itsellesi paremman.

 

Liian helppoa ja yksinkertaista ei ole olemassakaan

Jos ajattelit helppoutta, olet oikeilla jäljillä (siinäs näet, olemme kaikki asiakaskokemuksen asiantuntijoita). Ihmisillä on aina jokin syy ländätä sivustolle – he haluavat saavuttaa jonkin tavoitteen. Tämä saattaa olla tuotteen ostaminen, lisätietojen löytäminen, työhakemuksen lähettäminen tai yrityksen tiimin kontaktointi. Yrityksen tehtävä on tehdä tuon tavoitteen saavuttamisesta mahdollisimman vaivatonta.

 

Ihmisillä on aina jokin syy ländätä sivustolle – he haluavat saavuttaa jonkin tavoitteen. Yrityksen tehtävä on tehdä tuon tavoitteen saavuttamisesta mahdollisimman vaivatonta.

 

Oikein sijoiteltu ja kävijöiden tarpeita puhutteleva interaktiivinen sisältö auttaa onnistumaan tässä. Sivustojen kävijät ovat nimittäin lähtökohtaisesti passiivista porukkaa, jota eivät pelkät tekstiblokit ja kuvat liikauta. Mutta jos sivuston sisältö herätetään keskustelemaan kävijän kanssa, tilanne muuttuu täysin. Interaktiivisuus aktivoi ihmisiä ja auttaa heitä saavuttamaan tavoitteensa.

 

Näin otat interaktiivisen sisällön käyttöön

Interaktiivisen sisällön teho perustuu kahteen perimmäiseen tekijään. (1) Sisältö voidaan personoida vastaamaan erilaisten käyttäjäryhmien polttavimpiin tavoitteisiin, kysymyksiin, ja haasteisiin. (2) Sisältö voidaan tarjoilla käyttäjälle juuri siinä paikassa ja sillä hetkellä, kun se tuottaa hänelle eniten arvoa.

Kuulostaa hienolta, mutta miten se toimii ihan oikeasti? Todellinen interaktiivisuus mahdollistaa kaksisuuntaisen dialogin käyttäjän ja sivuston välillä. Sisältö antaa käyttäjälle vallan vaikuttaa dialogin sisältöön ja päästä siten lähemmäs oman tavoitteensa saavuttamista. Näiden dialogien eli keskustelupolkujen suunnittelu on tärkein tehtävä, kun halutaan onnistua interaktiivisten sisältöjen kanssa. Niiden täytyy vastata sivuston kävijöiden tarpeisiin.

 

One size doesn’t fit all, joten keskustelupolkujen suunnitteluun on käytettävä päätä. Kun suunnittelu tehdään huolella, voi kuitenkin yllättyä siitä, että vain muutama eri dialogi voi vastata lähes kaikkien kävijöiden tarpeisiin. Kun dialogit on muodostettu, ne tuodaan sivustolle keskustelevien bottien muodossa. Tässä vaiheessa homma ei vaadi sen enempää kuin koodinpätkien copy-pastetusta sivuston CMS:iin (esim. WordPress).

 

Ja näin interaktiivinen sisältö parantaa asiakaskokemusta

Ajattele hetki perinteistä kirjakauppaa. Kun astut sisään liikkeeseen ja alat haahuilla hyllyjen välissä, myyjähenkilö ottaa sinuun pian kontaktin ja kysyy, voisiko hän auttaa jotenkin. Sinulla on kaksi vaihtoehtoa. Voit vastata refleksinomaisesti Kattelen vaan, kiitos, tai, jos tiedät miksi olet liikeessä, voit sanoa Kyllä kiitos, onko teillä.. Jos valitset kertoa tarpeesi myyjälle, hän voi auttaa sinua välittömästi tavoitteesi saavuttamisessa. Interaktiiviset botit hoitavat sivustollasi saman homman kuin se ystävällinen ja viisas myyjä kirjakaupassa.

 

Interaktiivinen sisältö on kuin tiimisi olisi aina paikalla pitämässä kävijää kädestä – ensimmäisestä kontaktista konversioon asti ja tarvittaessa vielä sen jälkeen.

 

Ei pelkkää pöhinää, vaan myös psykologiaa. Meidät ihmiset on rakennettu niin, että jokainen pieni vuorovaikutus joko ihmisen tai nettisivun sisällön kanssa madaltaa hieman kynnystä ottaa seuraava askel. Dialogin muotoon rakennettu botti kasvattaa kävijän luottamusta ja sitoutumista jokaisen klikkauksen ja lähetetyn viestin myötä. Samalla kävijä soljuu kohti tavoitteen täyttymistä.

 

Interaktiivinen sisältö on kuin tiimisi olisi aina paikalla pitämässä kävijää kädestä – ensimmäisestä kontaktista konversioon asti ja tarvittaessa vielä sen jälkeen. Ei ollenkaan hassumpi tapa parantaa asiakaskokemusta.

Muista nämä

  • Voit kasvattaa konversioiden määrää parantamalla nettisivun asiakaskokemusta.
  • Sivuston kävijöillä on aina jokin tavoite, jonka he haluavat saavuttaa – sinun hommasi on tehdä tavoitteen saavuttamisesta mahdollisimman vaivatonta.
  • Interaktiivinen sisältö luo dialogin, joka voidaan personoida kävijän tarpeen mukaan ja aloittaa juuri oikealla hetkellä.

 

Otto Antikainen

Marketing Specialist / Leadoo Marketing Technologies
+358 50 4078980
otto@leadoo.com
https://leadoo.com

15 vinkkiä visuaaliseen työkalupakkiin

Visuaalisen suunnittelun työkalut kehittyvät jatkuvasti, ja kynän ja paperin lisäksi käytössä on iso liuta erilaisia digityökaluja. Uusia työkaluja putkahtelee listalleni lähes viikottain, ja vaikka osa karsiutuu pois heti kättelyssä, jotkut pääsevät suoraan osaksi luottopakkiani. Listasin tähän muutamia omia lemppareitani, joita käytän lähes jokaisessa projektissa, riippuen toki aina työstettävästä asiasta.

Ohjelmistot

Adoben ohjelmistot on varmasti luonnollisin osa suunnittelijan työkalupakkia. Meillä säännöllisessä käytössä ovat Illustrator, Photoshop, Xd layoutien suunnittelua varten ja silloin tällöin myös InDesign taitto-ohjelma. Tällä hetkellä alamme sisällä porukka jakautuu hieman kahteen leiriin ohjelmistotarjoajien välillä, mutta me olemme toistaiseksi pitäneet kiinni Adobesta.

Toisinaan piirrän myös iPadilla, jolloin käytössäni on Procreate.

Automaatio värisuunnittelun tukena

Värisuunnittelu perustuu niin kutsuttuun väripsykologiaan. Värit ovat osa kulttuuriamme ja yhdistämme tiettyjä värejä tietynlaisiin tunteisiin ja tunnetiloihin, ja tätä tietoa hyödynnämme brändivärien valinnassa. Perusteet suunnittelulle lähtevät aina väriympyrästä, mutta onneksi nykypäivänä automaatio ja tekoäly ovat tulleet tähän myös avuksi.

Colormind.io on loistava työkalu väripalettien suunnitteluun. Jos visiossa on vain yksi tai kaksi väriä, mutta paletin täydentäminen on hankalaa, niin käännyn aina Colormindin puoleen. Se generoi minulle tekoälyllä yleisesti sopivaksi oppimiaan väripaletteja haluamieni värien ympärille. Ilmainen työkalu sisältää täysin valmiita paletteja (esimerkiksi teemoilla Amélie tai vesivärimaalaukset) sekä vapaan mahdollisuuden kokeilla yhdistelmiä erilaisilla pohjilla täällä http://colormind.io/bootstrap/.

Mikäli perusasiat väriympyrässä kaipaavat muistutusta tai kaipaan väriharmoniaan tarkkoja sävyjä, käytän apuna color.adobe.com-sivustoa tai vielä perusteellisempaa colordesigner.io-sivustoa. Myös paletton.com-sivustoa käytän joskus, ym. kolme palvelua ovat loppupeleissä melko samanlaisia.

Joskus, jos inspiraatio on täysin kadoksissa, selailen myös picular.co-palvelua, joka on omien sanojensa mukaan Google väreille. Palvelusta voit hakea vaikkapa sanalla “bull”, ja tulokset näyttävät värejä, joita yleensä kuvahaussa vastaan tulevat kuvat sisältävät. Myös tämä palvelu pohjaa tekoälyyn.

Nyt kun saavutettavuus on ollut yhä useammin mielessäni saavutettavuusdirektiivin vuoksi, on pakkiini tullut lisää myös saavutettavuuden tarkistamiseen tarkoitettuja työkaluja. Näiden avulla tarkistan väripintojen ja erityisesti tekstin kontrastia. Käytössäni on sekä http://accessible-colors.com/ & http://colorsafe.co/.

Erilaisia värityökaluja minulla on pakissani eniten ehkä siksi, että värit ovat minulle visuaalisessa suunnittelussa kaikkein eniten lähellä sydäntä.

Kuvat

Mikäli kuvia ei ole saatavilla projektikohtaisesti, haen kuvia eri kuvapankeista. Kuvapankkeja olenkin listannut jo täällä postauksessa vuonna 2017 4+4 vinkkiä ilmaisista kuvapankeista.

Fontit

Fontit haen lähtökohtaisesti projekteihin joko Googlen fonttipalvelusta, tai Adoben fonttikirjastosta.

Erilaiset ”design systemit” ja ”cheat sheetit”

Design systemejä, eli suunnitteluohjeistuksia löytyy verkosta suuri kirjo, ja näistä minulla ei ole vakiintuneita suosikkeja. Googlen Material Designia kurkin kuitenkin säännöllisesti ja käytän suunnittelun tukena erilaisia lunttilappuja, kuten uxesign.cc:n nappien suunnitteluun keskittyvää.

Mikäli visuaaliset työkalut kiinnostavat, mutta niiden käyttöön tarvitset silti apua, älä epäröi ottaa meihin yhteyttä. Tarjoamme verkkosivustojen suunnittelun lisäksi laajoja visuaalisen suunnittelun ja graafisen suunnittelun palveluja.

Mistä on hyvät verkkokaupat tehty? 8 vinkkiä käyttökokemuksen parantamiseksi

Verkkokauppa kasvattaa osuuttaan voimakkaasti markkinoilla ja siitä onkin muodostunut tärkeä asiakaskohtaamisen kanava verkossa. Verkkokauppa ei kuitenkaan ole pelkkää teknologiaa yrityksen myynnin ja prosessien tehostamiseksi, vaan se on ennen kaikkea syvää ymmärrystä sekä tuntemusta kohderyhmän ostokäyttäytymisestä. Tässä blogiartikkelissa käyn läpi, mitä verkkokaupan käyttökokemuksella tarkoitetaan ja mitkä seikat siihen vaikuttavat.

Älä aliarvioi käyttökokemuksen merkitystä

Oli kyse sitten yritys-, jälleenmyyjä- tai kuluttaja-asiakkaista, on verkkokauppa noussut oleelliseksi kanavaksi kohdata asiakkaat. Asiakkaiden tavat etsiä ja vertailla tietoa sekä tehdä ostopäätöksiä ovat muuttuneet, mikä vaatii yritykseltä kykyä saada käännettyä muuttunut ostokäyttäytyminen hyödyttämään omaa liiketoimintaa.

Asiakkaiden vaatimukset ja odotukset verkossa tarjottaville palveluille kasvattavat merkitystään ja ostopäätökseen voikin vaikuttaa ratkaisevasti se, miltä palvelun käyttäminen tuntuu tai kuinka sujuvaa käyttö on. Käyttökokemuksen merkitystä verkkosivustoilla ei sovi vähätellä, sillä sen vaikutus antaa huolellisesti suunniteltuna ja toteutettuna valtavan kilpailuedun ja voi parhaimmillaan olla myös ratkaisevakin tekijä yrityksen menestyksen kannalta.

UX-suunnittelulla kohti sujuvampaa käyttökokemusta

Koska käyttäjäkokemus on muodostunut yhdeksi oleellisimmista kilpailuvalteista verkkokaupalle, on siihen vaikuttavien elementtien ja ominaisuuksien löytäminen keskeisessä roolissa. Lisäksi oman kohderyhmän tunteminen auttaa ymmärtämään asiakkaiden tarpeita. Käyttäjäkokemuksen suunnittelu vaatii hyviä ongelmanratkaisutaitoja, sillä tavoitteena on löytää ratkaisu siihen, kuinka verkkokauppa saadaan luomaan lisäarvoa käyttäjälleen tehden samalla palvelun käytöstä mahdollisimman luontevaa.

UX-suunnittelun avulla pyritään vastaamaan käyttäjän tarpeisiin ylittäen heidän odotuksensa, kuitenkin niin, että palvelun käytettävyydessä säilyy vaivattomuus ja selkeys. Suunnittelussa keskitytään nimenomaan siihen, miltä palvelu käyttäjästä tuntuu. Käyttökokemus ei muodostukaan yksin upeista leiskoista ja hienoista erikoisefekteistä, vaan se kattaa kaikki verkkopalvelun toiminnot aina navigoinnista sivuston sisältöihin ja hierarkioihin saakka.

Mihin sitten pitäisi kiinnittää huomiota?

Kattavan kirjallisuustietopohjan haalimisen lisäksi toteutin aiheesta kyselytutkimuksen osana tietojenkäsittelyn tradenomin opintojani. Kyselytutkimuksessa selvitin, mitkä asiat vaikuttavat käyttäjän näkökulmasta verkkokaupan käyttökokemukseen. Nappaa tästä tiivistettynä vinkit suoraan käyttäjiltä itseltään:

1. Luotettavuus ennen kaikkea

Verkkokaupalle tärkeimmäksi valintakriteeriksi nousi luotettavuus. Luotettavuuden esiintuominen ja siihen panostaminen on tärkeää menestyksen kannalta.

2. Navigointi ja kategoriat kuntoon

Navigoimisen verkkokaupassa tulee olla yksinkertaista. Lisäksi käyttökokemukseen vaikuttaa, että verkkokaupan tuotteet on lajiteltu selkeästi kategorioittain. Mieti siis sivuston hierarkia ja rakenne niin, että sivuston käytettävyys on mahdollisimman sujuvaa.

3. Tee tuotteiden selailusta ja hakemisesta selkeää

Tuotteiden hakeminen, suodattaminen ja selailuominaisuudet ovat käyttökokemuksen kannalta tärkeässä asemassa. Kannattaa siis pohtia, onko tuotteiden hakeminen verkkokaupassa selkeää. Etenkin, jos tuotteita ja variaatioita on paljon.

4. Kattavat tuotetiedot tukevat ostopäätöstä

Yksittäisen tuotteen tiedot, laadukkaat kuvat sekä varastotilanteen näkyvyys on käyttäjille arvokasta informaatiota ostopäätöksen kannalta. Lisäksi muiden käyttäjien arviot tuotteesta vaikuttavat ostopäätöksen tekemiseen, joten kannattaa harkita tuotearviointien tuomista yksittäisen tuotteen tietoihin.

5. Turhat liirumlaarumit pois – verkkokauppaan tullaan ostoksille

Verkkokauppa saa mennä suoraan asiaan ilman erillisiä yritysesittelyitä etusivulla. Muista kuitenkin, että käyttäjän tulee löytää yhteystiedot sekä toimitus- ja muut ehdot helposti ilman yksityisetsivän jaloja taitoja. Toimitus- ja maksutavat vaikuttavat myös verkkokaupan käyttäjälle muodostuvaan kokonaiskokemukseen, joten niiden esilletuomiseen ja toimivuuteen on syytä kiinnittää huomiota.

6. No pitäähän sen myös näyttää hyvälle

Verkkokaupan visuaalisuus ja yrityksen brändi-ilmeen esiintuominen on myös tärkeä huomioida käyttökokemuksen nimissä ja niihin kiinnitetään huomiota jopa niin paljon, että se vaikuttaa ostopäätökseen. Visuaalisuus lisää verkkokaupan käyttömukavuutta, mutta se ei kuitenkaan saa mennä toimivuuden edelle. Käyttäjille on tärkeämpää se, että palvelu pelittää.

7. Responsiivisuus

Ehkä sanomattakin selvää, mutta sanotaanpa silti: shoppailu tapahtuu kasvavissa määrin mobiililaitteilla, joten verkkokaupan tulee olla käytettävissä kaikilla laitteilla.

8. Nopeat syö hitaat

Latausnopeus on tärkeässä osassa verkkokaupan käyttökokemusta tarkastellessa. 88 % vastaajista kertoi, että latausnopeus vaikuttaa siihen, käyttääkö kyseistä verkkokauppaa vai ei. Älä siis unohda verkkokauppasi nopeuden optimointia.

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

UX- ja UI-design – mitä sinunkin tulisi tietää web design -jargonista

Työskentely nopeasti kehittyvällä alalla takaa sen, että työ saa jatkuvasti uusia ulottuvuuksia ja trendejä. Myös termistö kehittyy, ja koska trendit lähtevät monesti liikkeelle englantia puhuvan väestön keskuudesta, ovat termit luonnollisesti ensin englanniksi. Ammattislangin ja -termistön kehittyessä hurjaa vauhtia, käännöksiä ei usein tehdä ja termit vakiintuvat suomalaiseenkin suuhun englanninkielisinä. Kaksi tällaista ratkaisevaa työmme uutta ulottuvuutta ja termiä ovat UX- ja UI-design. Tässä blogiartikkelissa avaan perustasolla mitä nämä käsitteet tarkoittavat, ja miten ne liittyvät ratkaisevasti Sinisen Härän verkkosivustoprojekteihin.

UX-design eli User Experience Design

Voidaan vapaasti suomentaa esimerkiksi käyttöliittymän suunnitteluksi, käyttäjäkokemuksen muotoiluksi tai palvelun muotoiluksi. Käyttäjäkeskeinen UX-design kattaa sateenvarjon lailla alleen monia erilaisia alueita, joiden avulla pyritään parempaan käyttäjäkokemukseen. Muutamia mainitakseni:

– Käyttäjätutkimus ja palvelun testaaminen käyttäjillä. Palvelua kehitetään käyttäjille sopivaksi keräämällä dataa käyttäjistä ja heidän preferensseistään, joiden perusteella pystytään tekemään oletuksia ja käyttäytymismalleja kehityksen pohjalle. Datan perusteella voidaan ratkoa niitä ongelmia, mitä käyttäjät kohtaavat. Palvelun testaamisen järjestäminen oikeilla käyttäjillä esimerkiksi prototyyppivaiheessa on myös UX-designia, toimiiko datan perusteella tehdyt hypoteesit oikeasti ja miten käyttäjä kulkee suunniteltuja polkuja.

Informaatioarkkitehtuuri, eli verkkopalvelun hierarkia, vielä käytännöllisemmin valikkorakenteen suunnittelu. Eli miten asiat ja informaatio jäsennellään ja rakennetaan ymmärrettävään muotoon.

Wireframing, eli rautalankamalli on yksi vaihe suunnittelussa. Tässä vaiheessa keskitytään nimenomaan verkkosivuston tai -palvelun toimivuuteen, käyttäjän polkuihin saavuttaa tavoite ja niin edelleen. Rautalankamalli on ikään kuin luuranko, ja visuaalinen UI-puoli on vaatetus.

Analytiikka ja mittarit ovat oma taiteenlajinsa, mutta liittyvät vahvasti käyttäjätutkimukseen. Erilaiset työkalut, kuten lämpökartat, antavat arvokasta dataa käyttäjistä, mikäli sitä osaa tulkita ja hyödyntää palvelun kehityksessä.

Copywriting, eli tekstin tuotto. Tekstisisältö ohjailee ja helpottaa käyttäjää verkkopalveluissa ratkaisevasti, joten myös tekstin suunnittelu on osa UX-designia.

UI-design eli User Interface Design

Vapaasti suomennettuna ulkoasun suunnittelu, eli visuaalinen puoli suunnittelusta. Ulkoasun suunnittelu on myös osa käyttäjäkokemusta ja käyttöliittymän suunnittelua, joten kahtiajako UX:n ja UI:n välillä ei ole tasapuolinen. Maalaisjärjelläkin ajateltuna visuaalinen puoli vaikuttaa ratkaisevasti käyttäjän kokemukseen. Ulkoasun suunnittelu on eriytetty kuitenkin omaksi palveluksi sen takia, että myös tämä suunnitteluprosessi on täynnä omia sääntöjään, lainalaisuuksiaan ja kommervenkkejään, joihin visuaalinen suunnittelija/UI designer/graafikko/tmv. on erikoistunut. Muutamia näistä mainitakseni:

Värien käyttö sivustolla niin, että se on yrityksen graafisen ohjeiston mukaista, mutta myös käyttäjäystävällistä. Esimerkkinä tilauksen lähetys verkkokaupassa: ”Lähetä”-napin ei tulisi koskaan olla punainen, koska miellämme punaisen napin tarkoittavan asioita, kuten keskeytä tai tyhjennä valinnat.

Fonttien käyttö sivustolla jälleen niin, että mukaillaan yleistä ilmettä, mutta ei tuhota käytettävyyttä hankalasti luettavilla fonteilla.

Kuvien käyttö mukaillen tavoiteltavia tunnetiloja ja toimintoja.

– Ulkoasun suunnittelun on tarkoitus toki myös luoda palvelulle arvoisensa ilme, ja olla näin osaltaan tukemassa tavoitteita.

Miten termit liittyvät Sinisen Härän verkkosivustoprojekteihin?

Kuten yllä on avattu, niin UX- ja UI-design eivät ole verkkosivustoprojekteista eroteltavia palveluita, vaan kriittisiä osia verkkopalveluiden suunnittelussa. Kun Sinisellä Härällä asiantuntijuus on kasvanut, on myös UX- ja UI-designin menetelmiä ja toimintatapoja integroitu osaksi prosessejamme. Nykyinen käytäntömme viedä projektit läpi sisältääkin paljon aiempaa enemmän erilaisia ja aiempaa parempia suunnittelun menetelmiä liittyen esimerkiksi wireframingiin, mittareihin sekä hierarkiaan. Näin voimme paremmin taata verkkopalveluiden toimivuuden ja tavoitteisiin pääsemisen. Meille verkkosivut eivät ole vain käyntikortti, vaan tärkeä, joskus ratkaisevakin pala yrityksen markkinointia.

TLDR: et voi rakentaa verkkosivustoja tekemättä UX- ja UI-designia. Se, miten paljon näihin panostetaan vaikuttaa ratkaisevasti lopputuloksen laatuun.

 

Lataa ilmainen verkkosivujen ostajan opas




Onko teidän yrityksessänne verkkosivu-uudistus käsillä? Siinä tapauksessa, lataa ihmeessä ilmainen oppaamme. Opas on tehty auttamaan yrityksiä verkkosivujen ostamisessa, ja siinä käydään läpi kilpailutuksessa huomioon otettavia asioita aina tarjouspyynnön laatimisesta toteuttajien vertailuun.

Lataa ilmainen opas!

Näytä