Stanfordin “ihmisen ja tietokoneen vuorovaikutus” -verkkokurssi Courserassa, eli englanniksi Human-Computer Interaction (HCI), päättyi muutama kuukausi sitten ja sen viimeiset pari viikkoa käsittelivät visuaalista suunnittelua, informaatiosuunnittelua, kokeiluiden suunnittelua ja suorittamista laboratoriossa ja webissä ja tulosten analysointia. Kurssin alkuosa oli prototypointipainotteinen. Kokonaisuuteena HCI-kurssin tarkoituksena on opettaa kehittämään käyttäjäkeskeisiä suunnittelutaitoja ja saamaan periaatteet ja keinot erinomaisten käyttöliittymien kehittämiseen millä tahansa teknologialla. Viiden viikon mittaisen kurssin luennot olivat hyviä ja vaikka suoritin kurssista vain ”luennot ja kyselyt” -osuuden, tarjosi se pohdittavaa ja uusia ideoita. Jos kurssista suorittaa myös harjoitustyöt sisältäen muun muassa prototypointia ja arviointia, on se erinomainen kurssi vähääkään käyttöliittymien kanssa tekemisissä olevalla suunnittelijalle tai sovelluskehittäjälle.

”Ihmisen ja tietokoneen vuorovaikutus”, osa 2

Stanfordin “ihmisen ja tietokoneen vuorovaikutus” -verkkokurssi kävi nopealla tahdilla läpi sovelluksen suunnitteluun liittyvät vaiheet idean saamisesta mallintamiseen ja asioiden prototypoimiseen, testaamiseen ja arviointiin. Tarkoituksena on, että kurssin jälkeen opiskelijalla on paremmat taidot käyttäjäkeskeisestä suunnittelusta ja tietää periaatteet ja keinot erinomaisten käyttöliittymien kehittämiseen käytettävästä teknologiasta riippumatta. Viisi viikkoisen kurssin aikana asiat käytiin läpi videoluentojen ja esimerkkien kautta, joiden tukena on vielä käytännön harjoitustyöt ja kokeet. Sekä harjoitustöiden että testien tekijät saivat kurssista “Studio” -todistuksen ja pelkkien pistokokeiden vastaajat “Apprentice” -todistuksen.

HCI-kurssin alkuosa käsitteli tarpeiden ja ideoiden löytämistä, prototypointia, mitä hyvät käyttöliittymät ovat, heuristiikkaa ja informaation esitysmuotoja. Kahden viimeisen viikon aikana käsiteltiin visuaalisen suunnittelun periaatteita tiedon jäsentämiseksi ja esittämiseksi käyttöliittymässä, havaintojen ja kognition periaatteita tehokkaan vuorovaikutuksen saamiseksi ja viimeisenä aiheena oli kontrolloitujen testien suorittaminen ja analysointi.

Viikko 4

Neljännen viikon luennot keskittyivät visuaaliseen ja informaatiosuunnitteluun.

Visuaalinen suunnittelu ja typografia

Visuaalisen suunnittelun osalta käsiteltiin tyhjän tilan merkitystä muun muassa ryhmittelyssä ja koon osoittamaa hierarkiaa. Eli käytä tyhjää tilaa ja lisää (tekstin) koon vaihtelua ja painoa.

Visuaalisen suunnittelun kolme tavoitetta ovat:

• Ohjata: ilmaista rakennetta, suhteellista tärkeyttä, suhdetta
• Tahdittaa: houkutella, ohjata suuntaa, tarjota kohtia syventymiseen
• Viestittää: ilmaista tarkoitusta ja tyyliä, herättää sisältö elämään

Kolme perus välinettä tavoitteiden saavuttamiseksi ovat:

• Typografia
• Asettelu
• Värit

Typografian osuus oli kohtalaisen tylsää, mutta osaltaan kuitenkin tärkeää. Luentoja seuraaville kerrottiin teoriana eri kirjasintyyppien ominaisuuksia ja käyttökohteita. Mitään yleisohjetta kirjasimen valintaan ei ole, sillä se riippuu ihan tarkoituksesta.

”Legibility, in practice, amount simply to what one is accustomed to” – Eric Gill, 1931

Informaatiosuunnittelu

Informaatiosuunnittelun osalta syvennyttiin ruudukoihin ja kohdistamiseen. Useat Web-sivut ovat ryhmitelty ruudukoihin, joka helpottaa tiedon organisointia. Tekstin osalta todettiin, että vasemmalle tasattu teksti on nopeampaa selata (jos luetaan vasemmalta oikealle). Tästä voidaan kuitenkin poiketa, jos se on tarkoituksellista. Esimerkkinä käsiteltiin Amazonin sivujen eri tekstintasaukset eri kohdissa sivustoa.

Värien merkitystä käsiteltiin lyhyesti, antaen esimerkkinä Amazonin sivut harmaasävyissä ja Javan ”ilme ja tuntuma” -ohjeen värimääritelmät. Javan (Swing-aikakauden) ohjeet määrittelivät kuusi väriä kahteen ryhmään: violetti = klikkaa, harmaa = ei klikattavissa. Näin se tarjosi puhtaan, yhdenmukaisen ilmeen, joka oli helppo silmille (lähinnä harmaa).

Lähinnä mitä värien käsittelystä voi lyhyesti sanoa, on kolme vinkkiä:

• Kiinnitä huomiota väreihin
• Suunnittele ensin harmaasävyissä
• Säilytä luminanssi samana kuin harmaasävyissä, siirtyessäsi väreihin

Lukeminen ja navigointi

Viikon viimeinen luento keskittyi (Web-sivujen) lukemiseen ja navigointiin, miten helposti kävijät saavat ”hajun” sisällöstä (eng. Information Scent) ja löytävät sivuilta mitä haluavat ja tajuavatko he mitä vaihtoehtoja on tarjolla. Asian helpottamiseksi on muutamia keinoja. Ikonit auttavat, jos ne eivät ole liian yleisiä, avustavat toistuvaa tunnistamista ja jos käyttäjä tietää miltä asia näyttää, mutta ei sen nimeä. Toinen avustava tekijä on käyttää usean sanan linkkejä, joissa on tunnistettavia termejä ja avainsanoja.

Informaation löydettävyyden arvioimiseen voidaan käyttää silmäseurantaa, jolla saadan selvitettyä mihin käyttäjät sivuilla kiinnittävät huomion. Tutkimukset osoittavat, että sisältö pitäisi suunnitella silmäilyä ajatellen, jossa tärkein asia on vasemmassa yläkulmassa ja vähemmän tärkeät oikeassa alakulmassa.

On sanomattakin selvää, että sivujen tärkein alue on niin sanotun taitteen yläpuolelle (mikä mahtuu kerralla näkyviin selaimen ikkunaan), mutta käyttäjät kyllä selaavat alaspäin, jos he ajattelevat sen palkitsevan heitä. Myös tässä asiassa käyttäjät olettavat löytävänsä tärkeät asiat sieltä, jossa ne ovat muillakin sivuilla. On totuttu, että tietyt elementit ovat tietyissä kohdissa. Tämä pitäen mielessä, voi vain miettiä mikä on useiden sanomalehtien Web-sivujen tärkein sisältö, kun yli puolet sivusta on pelkkää mainosta.

Viikko 5

Viimeisellä viikolla keskityttiin kokeiden suunnitteluun, osallistujien olosuhteiden valintaan, kokeiden suorittamiseen ja niiden analysointiin ja vertaamiseen. Testaaminen on paljon muutakin, kuin ”pidätkö käyttöliittymästä” -tasoisten kysymysten kysymistä, ja on tärkeää tietää mitä vasten tuloksia arvioi ja mitä ne merkitsevät. Kokeiden osalta käytiin lyhyesti sanottuna läpi asioita, mitä luotettavilta, toistettavilta ja vertailukelpoisilta mittauksilta vaaditaan. Ei nyt ihan tieteellisellä tarkkuudella, mutta lähes. Tarkoituksena kokeilla on selvittää ”Onko käyttöliittymä X parempi kuin Y?” (ja mitä parempi tarkoittaa), ja usein vastaus on ”se riippuu”, joten kysymys onkin ”mistä?”.

Koejärjestelyt

Kokeiden yksi tärkeä osa-alue on osanottajien valinta eri koejärjestelyihin, miten he testaavat eri vaihtoehtoja vai kaikkia ja miten suoriutumista mitataan? Kokeen suorittamisen osalta pitää pohtia, testaavatko puolet käyttäjistä toista vaihtoehtoa ja loput toista, vai kummatkin ryhmät molempia ja missä järjestyksessä, että testattavat kohteet tai käyttäjien ominaisuudet eivät vaikuta lopputulokseen.

Koejärjestelyitä käsiteltiin teoriapainotteisesti ja niiden osalta päädyttiin kolmeen päästrategiaan:

• Osallistujien sisällä: Kaikki kokeilevat kaikkia vaihtoehtoja. Toimiva vaihtoehto, jos eri versioiden testaus ei sotke toisten tuloksia.
• Osallistujien välillä: Jokainen kokeilee yhtä. Vaatii enemmän henkilöitä ja tarkkaavaisuutta tasapuoliseen testien jakoon. Etuna on, että osallistujat eivät ole alttiita vaikutuksille toisesta testistä.
• Tasoittamalla olosuhteita ja osallistujien järjestystä (esitestillä, raja-arvoilla), voidaan pienentää osallistujien välistä vaihtelua.

Koehenkilöiden kanssa tehtäviä kokeita käsiteltiin yhden luennon verran ja aiheessa keskityttiin muun muassa käytännön asioihin, sekä miten koe pitäisi suorittaa, tallentaa, käytiin läpi ”ajattele ääneen” -metodiin liittyviä asioita ja miten kokeen tuloksia pitäisi prosessoida, analysoida ja mitata. Hieman turhan pikkutarkkoja asioita tässä käytäväksi läpi. Erilaiset mitattavat asiat, kuten suoritusaika tai virheiden määrä ovat selkeitä tuloksia.

Kokeiden suorittaminen Internetissä

Pääpaino kokeiden suorittamisessa oli niiden tekemisessä Webin kautta, jota käsiteltiin kolmen luentokappaleen verran. Webissä suoritettavien kokeiden osalta käsiteltiin pääasiassa A/B -vaihtoehto -tyylisiä testejä, eli joissa osa kävijöistä saa erilaisen käyttöliittymän eteensä ja kokeilla selvitetään miten se vaikuttaa kävijän toimiin.

Esimerkkinä käsiteltiin Barack Obaman edellisen presidentinkampanjan Web-sivua, jossa oli neljä eri tekstivaihtoehtoa napissa (sign up, learn more, join us now, sign up now) ja kuusi erilaista visuaalista toteutusta (get involved, family, change, video obama greeting, video of campaign, sam’s video). Erot tekstivaihtoehtojen osalla olivat prosentuaalisesti pieniä ”learn more” -vaihtoehdon ollessa tehokkain, mutta kävijämäärään suhteutettuna suuria ja videovaihtoehdot toimivat kuvaa heikommin. Loppupäätelmänä esitettiin, että pienet muutokset aiheuttavat isoja eroja ja oletuksemme (mikä toimii parhaiten) ovat usein vääriä.

Toisena esimerkkinä esitettiin käyttäjien houkuttelemista seuraamaan henkilöä Twitterissä, muuttaen napin tekstiä. Kokeen lopputuloksena saatiin: ”I’m on Twitter” 4,7%; ”Follow me on twitter” 7,31%; ”You should follow me on Twitter” 10,09%; ”You should follow me on Twitter here” 12,81%. Eli mitä selkeämmäksi teet sen, mitä haluat käyttäjän tekevän, sitä useammin he tekevät sen.

Small distractions
like extra fields
can yield big changes

Periaatteina tehokkaiden online-kokeiden suorittamiseen esitettiin seuraavat asiat:

• Kokeiden ajaminen 50/50%: vaikutuksen havaitsemiksi tarvitaan riittävä määrä osallistujia
• Suorita nousevasti: rajaa koe alkuun 0.1% käyttäjistä ja varmistu, että se ei tuota ongelmia
• Peruuta koe automaattisesti: määritä mittarit, joiden perusteella koe peruutetaan sen ollessa selkeästi heikompi esim. sivujen luontiajan suhteen
• Aja koetta riittävän pitkään: ensimmäinen käyttö ei ole sama kuin mihin käyttäjät ovat tottuneet
• Satunnaisen koejaon säännöt: johdonmukainen, eli sama käyttäjä saa saman kokeen, kestävä, riippumaton

Lopuksi luennolla esitettiin, että Internet-ajalla suunnittelussa on huomioitava, että ihmiset ovat usein liian varmoja itsestään, suunnittelijan rooli siirtyy olemisesta useiden vaihtoehtoisten ratkaisujen tekemiseen ja nopean kokeilemisen mahdollisuus tarkoittaa, että ensimmäinen versio (joskus) on vähemmän tärkeä.

Tulosten arviointi

Viimeisellä luennolla päästiin arvioimaan ja vertailemaan kokeiden tuloksia ja niiden dataa. Datan analysointiin esitettiin kolme kysymystä: 1. Miltä datani näyttää? 2. Mitkä ovat luvut kokonaisuudessaan? 3. Ovatko eroavaisuudet oikeita? Eli kannattaa tutkia dataa graafisesti eri yhteenvedoin ja menetelmin, sekä ryhmittää eli olosuhteiden tilastoja.

Erojen merkityksen arviointiin käytettiin eniten aikaa, esittelemällä Pearsonin Khii-toiseen -testi (Chi-squared), jolla vertailtiin odotettuja arvoja havaittuihin arvoihin esimerkiksi klikkausten määrän kehittymisessä. Tilastolliset menetelmät auttavat vahvistamaan, että ”olemme melkein varmoja” ja yleistämään tai olla yleistämästä pienestä testidatasta. Ja kannattaa huomioida, että data ei yleensä ole normaalia, vaan voi painottua eri tavoilla, joten testien ja niiden arvioinnin pitää ottaa se huomioon. Aika matemaattispainotteinen luento.

Yhteenveto

Viiden viikon mittainen Stanfordin “ihmisen ja tietokoneen vuorovaikutus” -kurssi oli aiheeltaan mielenkiintoinen ja tarjosi myös aihetta tuntevalla uusia ajatuksia ja ideoita. Kurssilla läpikäydyt aiheet olivat mielenkiintoisia ja tarjosivat sopivasti teoriaa ja esimerkkejä, vaikkakin muutamien ensimmäisten ja viimeisten luentojen aiheet olivat hieman tylsiä. Ainakin teoriassa osaan nyt selvittää ideoita ja tarpeita, suorittaa prototypointia eri tekniikoilla, arvioida eri vaihtoehtoja, ymmärrän miksi prototypointi ja vertaileva arviointi ovat oleellisia asioita erinomaisen vuorovaikutuksen suunnitteluun ja hahmotan miten tiedon eri esitysmuodot vaikuttavat käyttäjäkokemukseen.

Coursera-verkkokurssiympäristö toimi ihan asiallisesti, vaikka muutamia ongelmia sen kanssa kuulemma oli ainakin vertaisarviointiin liittyen, foorumien käytön mielekkyydestä voi olla montaa mieltä ja osallistumistodistusta sai odottaa pari kuukautta. Kuormittavuudeksi kurssisivuilla kerrotaan 8-10 tuntia/viikko, josta luentojen seuraamiseen ja pistokokeiden tekemiseen meni arviolta noin pari tuntia. Ei paha rasti, mutta kurssin parhainta antia olisi tehdä myös harjoitustehtävät, joiden avulla opittua asiaa saa harjoiteltua ideoinnista prototypointiin, testaamiseen ja arviointiin. Tämä jäi itseltäni harmillisesti väliin.

Useat Courserassa olevat kurssin pyörivät useamman kerran ja niin myös HCI, jonka seuraava toteutus alkaa syyskuun 24. päivä. Suosittelen kurssia kaikille, jotka vähääkään sivuavat käyttöliittymiä suunnittelun tai sovelluskehityksen ohessa, vähintään luentojen ja pistokokeiden osalta. Itse suunnittelin käyväni samaan aikaan käynnistyvän Scalalla toteutettavan funktionaalisen ohjelmoinnin -kurssin, joten HCI:n kattavampi suoritus jää myöhemmäksi.