Helppokäyttöisen web-käyttöliittymän suunnittelu perustuu maalaisjärkeen

0

Nykyään iso osa arkisista palveluista on saavutettavissa internetin kautta, ja yhteys löytyy lähes jokaisen taskusta. Oli kyseessä sitten ajanvaraus, yhteydenotto, videoiden katselu tai ostosten teko, siihen on olemassa vähintäänkin tusina erilaista web-sovellusta. Ihmisillä on luontainen taipumus valita aina helpoin ja vaivattomin tapa asioida, mikä on ajanut asiakaskokemuslähtöistä palvelumuotoilua siirtymään mahdollisimman saavutettaviin palvelukokonaisuuksiin.

Tarkoituksesta liikkeelle, nopeus tärkeintä

Käyttöliittymiä suunniteltaessa on hyvä alkuun kartoittaa sovelluksen tarkoitus. Valitettavan usein näkymät ahdetaan niin täyteen tietoja ja epäolennaisia toimintoja, että käyttäjä eksyy loputtomiin valintoihin ja pahimmassa tapauksessa turhautuu. Liian suppea käyttöliittymä taas puolestaan ei tarjoa käyttäjän vaatimia toimintoja, mikä myös vaikuttaa negatiivisesti käyttäjäkokemukseen. Jos sovelluksen tarkoitus on nopeuttaa toistuvia työvaiheita, kannattaa käyttöliittymä rakentaa yleisimmän käyttötarkoituksen ympärille ja hyödyntää automaattista täyttöä niihin kenttiin, jotka eivät yleensä muutu käyttökertojen välillä.

Kaikkein tärkein ominaisuus on nopeus. Pahimmassa tapauksessa osa käyttöliittymästä tarjoaa käyttäjälleen katsottavaksi pyörivää himmeliä ja koko ruudun muu käyttöliittymä on hyytynyt. Käyttäjä ei voi kuin pyöritellä sormiaan ja odotella.

Käyttökokemukseen voi vaikuttaa

Värit, tekstinkorostus ja liike kiinnittävät huomiota, joten niiden hyödyntäminen esimerkiksi syöttökentissä ohjaa käyttäjiä korjaamaan virheelliset tiedot. Huvin vuoksi ei animoituja elementtejä kannata käyttää, koska ne vievät tarpeettomasti käyttäjän huomion. Väreihin liittyy yleisiä assosiaatioita. Länsimaissa punainen on virheen väri, joka vaatii välitöntä huomiota. Keltainen varoittaa mahdollisista ongelmista, ja vihreä kertoo onnistuneesta vuorovaikutuksesta. Näkymien eteneminen tulisi rakentaa lukusuunnan mukaan. Jos käyttäjäkunnan kulttuurin lukusuunta on vasemmalta oikealle, kannattaa seuraava näkymä tulla oikealta. Länsimaissa myös ajatellaan, että varhaisemmat tapahtumat ovat vasemmalla ja tulevat oikealla.

Tekstin, käyttöliittymäkomponenttien ja taustan kontrastin tulee olla riittävä. Suosittu väriyhdistelmä eli keskiharmaata tai vaalean harmaata valkoisella pohjalla voi näyttää hyvältä pimeässä huoneessa tai normaalissa huonevalaistuksessa normaalinäköiselle, mutta ei voida olettaa, että sovelluksia käytetään aina ideaalisissa olosuhteissa. Heikko kontrasti tekee kirkkaassa auringonvalossa käyttöliittymästä käyttökelvottoman jopa normaalinäköiselle. Tekstin koko ei saisi koskaan olla alle oletuskoon. Kirjasinten tulee olla sellaisia, että oleelliset merkit eroavat toisistaan ja tekstin luettavuus säilyy hyvänä.

Tärkeimmät asiat kannattaa sijoittaa sivun yläosaan. Missään nimessä niitä ei pidä sijoittaa sivun loppuun niin, että varsinaisen sisällön ja tärkeän linkin tai alhaalla sijaitsevan napin välissä on paljon tyhjää tilaa. Näin jollain ruudulla käyttäjä ei edes näe linkkiä tai alhaalla sijaitsevaa nappia. Käyttäjä voi luulla, että sisältö loppui tyhjään ja ei edes tajua vierittää ruutua riittävän alas. Sitä paitsi ruudun vierittäminen tärkeitä toimintoja varten on raskasta.

Ikonien käytössä kannattaa pitäytyä yleisesti tunnetuissa ikoneissa. Esimerkiksi suurennuslasi liitetään yleensä hakutoimintoon, rattaan kuvake asetuksiin. Sen sijaan, mikä on oikea kuvake vaikkapa viestin lähettämiseen, onkin jo monitulkintaisempi. Entä mikä kuvake peruuttaisi viestin? Tuolloin teksti on parempi vaihtoehto.

Painikkeiden ja käyttöliittymän elementtien tulee sijaita sopivalla etäisyydelle toisistaan. Moni käyttää nykyään web-sivuja älypuhelimen ruudulta puhelin pystyasennossa. Jos elementit ovat liian pieniä, sormi voi osua väärään elementtiin.

Tärkeää on myös yhteensopivuus erilaisten laitteiden kanssa. Sivuston kaikki oleelliset toiminnat tulee testata yleisimmillä selaimilla. Ruutukoko ja kuvasuhde vaihtelee laitteesta riippuen. Responsiivinen käyttöliittymä toimii suoraan isolla osalla eri ruuduista. Helppo tapa lähestyä responsiivista käyttöliittymää on kartoittaa käyttäjäkunnan suosima laite ja rakentaa ensisijaisesti sen ympärille käyttöliittymä. Pieni ruutukoko on myös hyvä lähtökohta, sillä se on helppo levittää isommallekin ruudulle.

Ideaalinen käyttöliittymä on intuitiivinen

Ideaalinen käyttöliittymä on niin hyvin tehty, ettei se ole käyttäjän tiellä, vaan on intuitiivinen ja jossa eniten tarvittavat operaatiot saa tehtyä mahdollisimman vähillä klikkauksilla.

Varsinaiset ”säännöt” käyttöliittymien suunnitteluun ovat kuitenkin pitkälti havaintoihin perustuvia malleja, joiden kanssa kannattaa käyttää maalaisjärkeä. Käyttäjäkokemusten kerääminen ja analysointi onkin tärkeää. Hyvä käyttöliittymä on tehty käyttäjää varten, eikä niin, että käyttäjän täytyy sopeutua käyttöliittymän metkuihin.

Teksti:
Petri Kuittinen, tieto- ja viestintätekniikan lehtori, HAMK
Jaakko Jääskeläinen, Cloud Solutions -arkkitehti, Riihisoft Oy

Leave A Reply