Maailmas, kus pea igasugune äritegevus on vähemal või rohkemal määral seotud arvutite ja veebiga, ei saa alahinnata kasutajakogemuse (UX) disaini olulisust. Enam ei piisa sellest, et loodud disain sai tegija arvates vinge ning ka klient jäi rahule. kasutajakogemuse põhitõed seletab lahti veebiagentuuri EasyWeb üks asutajatest, veebiarendaja ja UX disainer Silver Lass.

Pelgalt kõhutunde järgi ilusa ja enam-vähem mugava veebilehe kujundamine ei garanteeri veel selle edukust. Kvaliteetse kodulehe tegemine eeldab läbimõeldud UX strateegiat.

UX disaini eesmärgiks on täita eelkõige kasutaja vajadused, mitte veebimeistri või töö tellija omad. Meeldiv ja kasulik kogemus veebilehe või rakenduse kasutamisel annab külastajale põhjust teinekordki tagasi tulla ja sellest sõbralegi rääkida. Kasutaja vajaduste rahuldamine võidab lojaalseid püsikliente, toob juurde uusi külastajad, tõstab brändi tuntust ning kõige selle tulemusena teenib ettevõttele kasumit.

Kasutajakogemuse disain on ala, mis on väga loominguline ja pidevalt ajas muutuv. Isegi väga headel UX disaineritel on erinevad käekirjad ja lahkarvamused nüansside osas. Siiski on olemas kindlad põhitõed, mida üks tõsiseltvõetav veebimeister eirata ei tohiks.

Neist olulisematel siin peatungi.

1.   Uuri välja, mida kasutaja tegelikult vajab

“Kui ma oleksin küsinud inimestelt, mida nad vajavad, oleksid nad palunud kiiremaid hobuseid.”

• Henry Ford

Veel enne, kui arendamise ja disainimise kallale asuda, tuleks välja selgitada, milline on loodava veebisaidi sihtgrupp ehk kes üldse oleksid need potentsiaalsed tulevased külastajad. Samuti on oluline teada, mis mure neil on ja kuidas veebileht neid aitaks ehk millisele probleemile nad veebist lahenduse leiaksid? Kuidas mõista nende muret?

Muidugi saab ka ise oletada, mõelda ennast kasutaja kingadesse ja arvata, et kõik on selge. See ei ole aga kuigi professionaalne lähenemine ja eksimise hind võib olla suur. Tulemuseks on kallis, kuid oma eesmärki mitte täitev veebileht.

Sellepärast ongi nii oluline tegelike kasutajate tundmaõppimine, nende küsitlemine ja intervjueerimine.

Soovitud tulemusi ei pruugi anda küsimused stiilis: “mida sa soovid, et ma sulle teeks?”. Kasutaja ei pruugi ise täpselt teada, millist funktsionaalsust või disainilahendust ta vajab ja ta ei peagi seda teadma.

Küsima peaks selle kohta, millest kasutajad puudust tunnevad, mida nad tegelikult saavutada soovivad ning mis neid sealjuures takistab.

Uurida tuleks probleemi, mitte lahendust!

Kui sihtgrupi analüüs on tehtud ja probleemi olemus selgunud, saab arendusmeeskond hakata otsima ideid ja meetodeid selle lahendamiseks.

Juba töötava prototüübi või valmis veebilehe puhul on väga soovitatav läbi viia kasutajakogemuse teste. Testimise käigus antakse kasutajale ette kindlad ülesanded ja stsenaariumid ning jälgitakse, kuidas ta neid lahendab. Testi tulemuste analüüs annab väärtuslikku infot veebilehe kasutajate esinevate probleemide kohta.

2.   Ära sunni kasutajat pikalt mõtlema!

“Mina kui kasutaja ei peaks kulutama millisekunditki, et mõista, kas miski on klikitav või mitte!”

• Steve Krug

Kasutajasõbralik veeb on disainitud nii, et selle külastaja saab vaid ühe pilguga aru, millise kodulehega on tegemist. Veebi ja sellel olevate elementide eesmärk on kasutajale kohe selge. Mida rohkem peab mõtlema, seda suurem on oht, et ta lahkub lehelt ja otsib oma muredele lahendusi mujalt.

Veebileht, mis EI pane kasutajat mõtlema, on järgmine:

• Loogilise ülesehitusega, lihtsa ja selge navigatsiooniga. Lehe menüü on ühtlane üle kogu veebisaidi ning nähtaval harjumuspärasel kohal. Värvilahendus tagab menüü tekstide selge loetavuse ja eristatavuse taustast.
• Selge visuaalse grupeeringuga. Tähtsamad elemendid (nt pealkirjad) on selgelt eristuvad. Tähenduse poolest seotud elemendid on grupeeritud kokku ja ühtlase stiiliga.
• “Puhta” välimusega ja ruumikas. Elementide (nt tekstide, piltide, ikoonide, nuppude) ümber on jäetud piisavalt “hingamisruumi”. See annab igale elemendile suurema fookuse.
• Kohe mõistetav. Klõpsatavate elementide (nupud, lingid) funktsioon on lehe külastajale esimesest pilgust selge. Tekstid kirjeldavad linkide funktsiooni nii täpselt, kui võimalik.

3. Anna kasutajale suurem kontroll!

Läbimõeldud disaini ja struktuuriga veebileht tekitab kasutajas tunde, et ta saab lehel toimetamisega ise hästi hakkama. See annab talle kindluse – lubab eksida ja proovida, tunnustab õnnestumisi ja annab seeläbi kontrollitunde. Enesekindel ja mugavustsoonis tegutsev lehekülastaja teeb suurema tõenäosusega veebilehel tehinguid ning hakkab püsikliendiks.

Mõned kasutaja kontrollitunnet mõjutavad tegurid on järgmised:

• “Tagasi” või “back” nupp töötab õigesti. See nupp peab andma kasutajale võimaluse liikuda tagasi eelmisele lehele. Lihtsaim näide: liigi Back nupuga kassast ostukorvi tagasi, kui tahad midagi muuta. See võimaldab kasutajal tegutseda lehel ilma hirmuta vigade tegemise ees. Kui kasutaja teab, et saab alati oma sammu tagasi võtta, on ta julgem lehel katsetama ja toimetama.
• “Tühista” või “Cancel”. Sarnaselt eelmisega saab iga tegevuse tühistamise võimalus suurendada kasutajas tunnet, et ta kontrollib asjade käiku.
• Arusaadav navigatsioon. Ära disaini oma veebisaiti nii, et kasutaja võiks sellel surfates kuhugi “ära eksida”. Tee talle lehel navigeerimine võimalikult lihtsaks, kasutades loogilist struktuuri ja tugipunkte, et kasutaja teaks alati, kus ta hetkel on, kust ta tuli ja kuhu saab edasi minna.
• Anna tagasisidet. Teavita kasutajat õnnestunud või ebaõnnestunud toimingute kohta. Näiteks peale kontaktivormi täitmist ja “saada” nupu vajutust kuva kasutajale teade, et tema kiri on kohale toimetatud. See annab kindlustunde, et tema oluline sõnum jõudis kindlasti adressaadini.

4. Kasuta lehel harjumuspärast paigutust ja disaini

“Kasutajad veedavad enamuse oma ajast teistel veebilehtedel. Seega eelistaksid nad, et ka sinu leht toimiks samamoodi, kui kõik teised.”

• Jakobi seadus

Selleks, et külastaja kogemus lehel oleks sujuv ning tegevused kiired, intuitiivsed ja efektiivsed, peab veebisait olema üles ehitatud talle harjumuspäraseks. Me kõik oleme harjunud navigatsiooni-nuppe otsima veebilehe ülaosast. Kui paljud satuksid segadusse, kui need paigutada näiteks paremale alla nurka? Veebilehe logo otsime ju samuti ikka esmalt ülevalt vasakust, mitte paremast nurgast.

Hea disainer on kursis üldlevinud tavadega elementide paigutamisel ja kujundamisel. Kui kasutajatel on juba välja kujunenud kindlad käitumismallid, ei ole mõtet hakata ratast leiutama ning uusi ja mittetöötavaid lahendusi välja mõtlema. Ära ürita olla liiga uuenduslik – vahel on kasulikum jääda selle juurde, mis töötab.

5. Vähem on rohkem

Minimalismi rakendamine veebidisainis on viimaste aastatel olnud üks läbivamaid UX-i trende ja seda põhjusega – üle disainitud ja elementidest kubisev veebisait toob selle kasutajale kaasa liigse aja- ja energiakulu. Sinu fantastiline ja keerukas disainilahendus võib praktilisest vaatepunktist hoopis suure karuteene teha.

Kujunduse ja struktuuri juures on tähtis keskenduda olulisele – veebisaidi sisule ja funktsioonile. Kasutaja jaoks olgu asjad tehtud selgeks, teekond lehel sirgjooneliseks, vähendatud ebaolulist “disainimüra” ning üleliigseid tekste. Pealegi, ka minimalistlik disain võib olla rabavalt ilus.

Mõned näpunäiteid minimalismi kasutamiseks:

• Kuva lehel ainult olulist. Mõtle hoolega, kas lisatud pilt või kirjutis aitavad kaasa kasutaja eesmärkide saavutamisele.
• Kasuta negatiivset ruumi. Tühi ruum elementide ümber koondab kasutaja tähelepanu olulisele ning suunab ta õigesse kohta.
• Kirjastiil on tähtis. Mida vähem on lehel elemente, seda tähtsamaks muutub kasutatav font. Vali kirjastiil, mis sobib kokku lehe sisulise poolega ja tekitab õigeid emotsioone.
• Pildid on veel tähtsamad. Minimalistlikku disaini iseloomustab piltide hulga piiramine lehel. See tähendab, et iga pildi tähtsus on tavapärasest suurem. Vali pilte hoolega ja analüüsi, millist sõnumit nad edastavad ja milliseid tundeid tekitavad.
• Vali värve hoolega.Ära kasuta lehel rohkem kui 2-3 värvitooni. Salvesta nende värvide täpsed (RGB) koodid ja kasuta neid üle kogu lehe.

6. Kirjuta nii, et ka viienda klassi laps saaks aru!

Nii nagu lihtsus ja arusaadavus on tähtis visuaalse disaini puhul, on see ka kirjatükkide puhul oluline. Kasuta  selgelt ja üheselt mõistetavat sõnastust. Tänapäeva inimestel on kiire, nad tegelevad mitme asjaga korraga ning liiguvad ringi. Mida rohkem peavad nad pingutama, et loetava teksti mõttest aru saada, seda halvem.

Arvamus, et põhikooli tasemel kirjutis on suunatud vaid rumalale kasutajale, on vale. Pigem edastab lihtne sõnastus informatsiooni selgelt ja kiirelt, on ülevaatlik ja mugavam – ole siis geenius või mitte.

Mõned nipid lihtsamaks eneseväljenduseks:

• Kasuta lihtsat sõnastust. Ära kasuta ilma mõjuva põhjuseta keerulisi võõrsõnu või tehnilisi termineid.
• Liigenda teksti. Jaota pikk sisu väiksemateks osadeks.
• Kirjuta sihtgruppi silmas pidades. Arvesta lugeja eeldatavate taustateadmistega. Tunne oma sihtgruppi ja räägi nendega sama keelt.
• Kasuta sõbralikku tooni. Kirjuta nii, et lugeja tunneks end hästi. Ole soe, julgustav ja motiveeriv.
• Too näiteid. Näited aitavad kasutajal paremini seoseid luua ja sinu tekstist aru saada.
• Kirjuta võimalikult lühidalt. Ole konkreetne ja ära raiska lugeja aega.

7. Arvesta kõigiga, ka erivajadustega inimestega

Disainimisel tuleks mõelda ka erivajadustega inimestele. Sõltuvalt veebisaidi eesmärgist on võimalik, et seda kasutab laps, vanur, liikumis-, nägemis- või kuulmispuudega isik.

Tehes asjad kättesaadavaks ka neile gruppidele, suureneb lehe võimalik külastajaskond. Ka otsingumootorid on hakanud premeerima ligipääsetavaid lehekülgi, tõstes nende kohta otsingutulemuste seas ettepoole.

Mõned nõuanded ligipääsetavuse parandamiseks UX-i vaatepunktist:

• Kasuta värvivalikul kontrasti. Disaini tekstide värv nii, et kiri oleksid taustavärvist selgelt eristuv.
• Ära erista ainult värvidega. Halva nägemisega või värvipimedatel inimestel võib tekkida raskusi info mõistmisel, kui eristamiseks on kasutatud ainult värvitoone. Näiteks graafikute ja diagrammide puhul kasuta lisaks värvile ka kirjeldavad silte, mustreid, erinevaid mõõtmeid ja kujutisi. Linkide teksti sees nähtavamaks muutmiseks võiks neile lisada alljoone või suurendada kirjastiili paksust.
• Vormide juures kasuta silte ja selgitusi. Ära kasuta kontaktivormi või muu vormi väljade juures selgitava tekstina ainult placeholderit. Selle tekst on enamasti hallikat tooni ja raskesti loetav. Lisaks vaegnägijatele mõeldud ekraanilugejad ignoreerivad tavaliselt placeholder’i teksti. Välja kirjeldav tekst võiks olla kuvatud sildina ning nähtav ka kirjutamise ajal. Vajadusel lisa veebivormi juurde ka juhendavaid ja selgitavad tekste.
• Piltide ALT tekstid on tähtsad. See omadus on oluline ekraanilugejat kasutavate vaegnägijate jaoks. Pildi sisu kirjeldav ALT (ehk alternatiiv-)tekst tuleks kindlasti lisada igale pildile, mille juures ei ole selgitavat teksti.
• Võimalda klaviatuuri abil navigeerimist. Osad liikumis- või nägemispuudega inimesed saavad oma seisundi tõttu kasutada lehel navigeerimiseks ainult klaviatuuri. Veendu, et sinu leht on TAB ja ENTER klahve kasutades navigeeritav ilma hiirt kasutamata. TAB (tabulaator-) klahviga aktiivseks muutuvate linkide järjekord võiks liikuda loogilises suunas – vasakult paremale ja ülevalt alla.

Lõpetuseks: uuri seda valdkonda põhjalikumalt

Ilmselgelt on käesolevas artiklis kasutajakogemuse põhimõtetest räägitud vaid kõige üldisemas võtmes. Loodetavasti andis see aga hea ülevaate sellest, kuidas veebi tehes mõelda just kasutaja vajadustest lähtudes.

UX temaatikast on detailsemalt kirjutatud pikki internetiartikleid ja isegi raamatuid ning soovitan kõigil, kes veebiga seotud, antud valdkonda põhjalikumalt uurida.

Artikkel ilmus algselt veebimajutus.ee blogis.