Kontrastit ja värit

Kontrasti tulisi olla riittävä. Värejä ei tulisi koskaan käyttää ainoana koodaustapana. 

Pienten näyttöjen käyttöliittymistä on tullut ubiikki osa nykypäivän yhteiskuntaa. Pieniä näyttöjä löytyy aina digitaalikelloista autojen näyttöihin saakka. Näyttöjen määrästä huolimatta niiden monimutkaisuus ja käytettävyys vaihtelevat runsaasti eri toteutuksissa. Pienten näyttöjen kehittymisessä on nähtävissä useita eri trendejä, laitteiden koko on pienentynyt, laskentateho on lisääntynyt, ohjelmistojen ja käyttöliittymien kompleksisuus on kasvanut ja ominaisuuksien lähentyminen on parantunut. (Mauney, Masterton, 2008).

Pienten näyttöjen suunnittelu perustuu pääasiassa näköaistiin. Suunnittelussa yleisiä ovat kysymykset siitä, kuinka pieniä dataelementtejä voidaan laittaa näytölle, että ne voidaan vielä kunnolla nähdä ja tunnistaa. Tähän seikkaan vaikuttavat valon määrä, silmän anatomia ja herkkyys, sekä tarkkuus. (Mauney, Masterton, 2008).

Visuaalinen tarkkuus tarkoittaa pienintä yksityiskohtaa, jonka silmä voi havaita tietyltä etäisyydeltä. Kohteen visuaalinen terävyys riippuu sen koosta ja sen etäisyydestä katsojaan. Pieni lähellä oleva objekti voi näyttää suuremmalta kuin kauempana oleva suurempi esine. (Mauney, Masterton, 2008).

Monet asiat vaikuttavat tarkkuuteen, kuten valaistus, kontrasti, aika, ja aallonpituus. Yleisesti ottaen, kun valoisuus ja kontrasti lisääntyvät ja aika, joka kohdetta katsotaan, pitenee, tarkkuus paranee.

Värin suurempi kontrasti parantaa tarkkuutta. Punainen väri on helpoiten nähtävissä tilanteessa, kun on vähän kontrastia, seuraavaksi helpoimpia ovat järjestyksessä vihreä, keltainen ja valkea. Noin 8 prosentilla miehistä ja 0,5 prosentilla naisista on jonkinlainen häiriö värien näkemisessä. Yleisin värisokeus on puna-vihersokeus, jolloin henkilö ei erota punaista ja vihreää väriä toisistaan. Tämän vuoksi väriä ei koskaan tulisi käyttää ensisijaisena tapana erottaa kahta eri asiaa. (Mauney, Masterton, 2008).

Lähteet:
Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Lukeminen pieneltä näytöltä

Pienellä näytöllä kannattaa varata koko näytön leveys tekstin kirjoittamiseen. Pieneltä näytöltä ei ole yhtä helppoa ymmärtää tekstiä kuin suurelta näytöltä.

Pieneltä näytöltä lukeminen on tutkimusten mukaan hieman hitaampaa kuin suurelta näytöltä lukeminen. Kun näytöllä on vain kerrallaan luettavissa vain 1-2 riviä, suoritus on hieman huonompi kuin, jos luettavia rivejä on 4:stä 20:een. Kun näytön rivimäärä nostetaan 1:stä 20:een, lukeminen on ainoastaan 9 % nopeampaa, eikä tekstin ymmärtämisessä ole eroja. (Mauney, Masterton, 2008).

Näytön leveyden vaihtelulla on sen sijaan suurempi merkitys. 1/3 -levyisellä näytöllä lukeminen on 25% hitaampaa kuin 2/3 levyiseltä tai täysleveältä näytöltä. Tämän takia, jos näyttöä käytetään usein tekstin lukemiseen, sen leveydestä kannattaa varata tekstille mahdollisimman paljon tilaa. Tämä löydös tukee myös navigointi- ja muiden kontrollien sijoittamista vertikaalisesti näytöllä. (Mauney, Masterton, 2008).

Kokemusten mukaan käyttäjät lukevat mieluummin suurelta näytöltä ja käyttävät pientä näyttöä vain satunnaiseen lukemiseen. Monesti käyttäjät eivät lue tekstiä pieneltä näytöltä lineaarisesti, vaan enemmänkin silmäilevät sitä ja lukevat vain lyhyitä kohtia. (Mauney, Masterton, 2008).

Nielsen esittelee www-sivuillaan tutkimustuloksen, joka on ristiriidassa sen väitteen kanssa, että tekstin ymmärtämisessä ei ole eroja erikokoisten näyttöjen välillä. Ainakin monimutkaisen tekstin lukemisessa iPhonen näytön kokoiselta näytöltä, käyttäjät saivat 48% vähemmän pisteitä sisällön ymmärtämistä testattaessa kuin tietokoneen näytöltä lukevat käyttäjät. Tämä tarkoittaa, että mobiilin sisällön ymmärtäminen on kaksi kertaa hankalampaa kuin tietokoneen näytöltä. (http://www.useit.com/alertbox/mobile-content-comprehension.html, 2011).

Pieneltä näytöltä lukemisen heikon ymmärtämisen syiksi Nielsen antaa kaksi asiaa: Ensinnäkin, käyttäjät näkevät vähemmän tekstiä annetussa ajassa ja joutuvat luottamaan enemmän muistiinsa. Toiseksi, käyttäjät joutuvat liikuttelemaan ja vierittämään sivuja enemmän. Vierittäminen vie enemmän käyttäjän aikaa ja huomiota itse ongelmasta, sekä aiheuttaa ongelmia edellisen kohdan paikantamisesta sivulla.

Lukemiseen vaikuttavat näytön koon ja vierittämisen lisäksi myös muut seikat, kuten tekstin koko ja tarkkuus.

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Nielsen, J., (2011). Nielsen's Alertbox, February 28, 2011. Www-sivu, saatavilla: http://www.useit.com/alertbox/mobile-content-comprehension.html

Valikot ja niiden suunnittelu

Hierarkkisen rakenteen teossa olisi muodostettava toisensa poissulkevia kategorioita, joissa valinnat sopivat hyvin ainoastaan kyseessä olevaan ryhmään. Otsikoiden pitäisi olla selkeitä ja sisältöä kuvaavia. Käytön yleisyyttä pidetään yleensä parhaana vaihtoehtona järjestää valinnat; muita ovat ”luonnollinen” järjestys (esim. viikonpäivät) tai aakkosjärjestys (valtiot).  Syvempi hierarkia on tehokkaampi kuin laaja hierarkia.

Valikoiden avulla käyttäjä voi valita suuresta määrästä eri vaihtoehtoja. Valikoiden hyvänä puolena on, että käyttäjä voi muistamisen sijaan tunnistaa ja valita tarvittavan toiminnon kirjoittamatta, mikä on hyödyllistä erityisesti silloin, kun laitteessa ei ole täyttä näppäimistöä kirjoittamiseen. (Mauney, Masterton, 2008)

Suunnittelussa tavoitteena on, että käyttäjä löytää haluamansa valinnat nopeasti ja mahdollisimman virheettömästi minimimäärällä näppäilyjä. Useimmiten valikon virheelliset valinnat johtuvat valintojen huonosta luokittelusta, päällekkäisistä luokista tai epäselvistä luokkien otsikoista. (Mauney, Masterton, 2008).

Valikon järjestämisessä pitää tehdä valikon yleisen rakenteen organisointi ja valikon sisäisten valintojen järjestäminen. Tutkimusten mukaan paras tapa valikon järjestyksestä päättämisessä on ottaa käyttäjät mukaan suunnitteluprosessiin. Pyrkimyksenä hierarkkisen rakenteen teossa on muodostaa toisensa poissulkevia kategorioita, joissa ei ole yhteisiä ominaisuuksia ja jotka on selkeästi määritetty niin, että valinnat jokaisessa kategoriassa sopivat hyvin ainoastaan kyseessä olevaan ryhmään. Kategorioiden otsikoiden pitäisi olla selkeitä ja sisältöä kuvaavia. (Mauney, Masterton, 2008)

Valikon sisällä valinnat voidaan järjestää: aakkos- tai aikajärjestykseen, koon mukaan, yhdenmukaisesti (jos samat valinnat ovat useassa eri paikassa, niiden järjestyksen tulisi olla aina sama), kategorioihin ja käytön yleisyyden mukaan (useimmin käytetyt ylös). (Mauney, Masterton, 2008).

Käytön yleisyyttä on monesti pidetty parhaana vaihtoehtona järjestää valikon eri valinnat. Tällainen järjestys voi säästää käyttäjän aikaa ja virheellisiä valintoja, koska syvällä valikkorakenteessa olevia valintoja on usein hankala löytää. Käyttäjät yleensä valitsevat heti ensimmäisenä löytämänsä kategorian, joka voisi sisältää heidän etsimänsä valinnan, joten käytön yleisyyden mukaan lajiteltu valikko helpottaa tällaista etsintää ja myös nopeuttaa jatkuvaa käyttöä. (Mauney, Masterton, 2008)

Jos valinnoilla on jokin ”luonnollinen” järjestys kuten esimerkiksi viikonpäivät, tai kuukaudet, sitä kannattaa hyödyntää. Samoin, jos muualla ohjelmassa on samoja valintoja, niiden järjestys on hyvä pitää yhdenmukaisena. Aakkosjärjestystä hyödyttää käyttää vain, kun valintojen aakkosjärjestys on käytössä vakiintunut, kuten esimerkiksi eri maita sisältävät valinnat. (Mauney, Masterton, 2008)

Valikot voivat olla rakenteeltaan leveitä, jolloin niissä on paljon eri valintoja per kategoria, tai ne voivat olla kapeita, jolloin niissä on vain muutama valinta per kategoria. Valikot voivat olla myös syviä, jolla tarkoitetaan, että niissä on useita alikategorioiden tasoja, tai matalia, jolloin niissä on vain muutama alikategoria. Tätä valikkojen hierarkiaa on tutkittu paljon kirjallisuudessa, pöytätietokoneiden valikoista yleensä leveät hierarkiat ovat tehokkaimpia käyttäjille, erityisesti silloin, kun valinnat ovat selkeitä. Leveät hierarkiat ovat myös parhaita edistyneille käyttäjille. Kuitenkin, tilanteissa joissa virheitä esiintyy paljon, tai ne ovat tuhoisia, kapea hierarkia, joka ohjaa käyttäjiä parhaaseen valintaan voi olla paras valinta. (Mauney, Masterton, 2008)

Lisäksi on tutkittu valikkojen erilaisten muotojen vaikutusta, jolloin huomattiin, että kovera rakenne on navigoinnin kannalta tehokkaampi kuin samankokoinen suhteellisen tasainen valikko. Koveralla valikolla tarkoitetaan, että valikossa on enemmän valintoja ylä- ja alatasoilla kuin keskitasoilla. Tasaisessa valikossa on suurinpiirtein sama määrä valintoja per taso. (Mauney, Masterton, 2008; Jones, Marsden, 2005)

Suurin osa em. tutkimuksista on tehty pöytätietokoneilla, joiden näytöille sopii enemmän tietoa. Jos kaikkia valintoja ei voi näyttää kerralla yhdellä näytöllä, syvyys vs. leveys kompromissi vaihtuu toisin päin. Mauney&Masterton (2008) viittaavat tutkimukseen, jossa aihetta on selvitetty puhelimissa ja pda-laitteissa. Tutkimuksessa havaittiin, että tehokkain hierarkia mobiililaitteissa on vain neljästä kahdeksaan valintaa per taso ja jos paljon valintoja tarvitaan, on parempi kasvattaa tasojen määrää kuin valintojen määrää per hierarkia taso. Siten, syvempi hierarkia on tehokkaampi kuin laaja hierarkia monen tasoisille käyttäjille. (Mauney, Masterton, 2008)

Valikon suunnittelusäännöt Mauneyn & Mastertonin mukaan (2008)

1. Järjestä valikon valinnat toisensa pois sulkeviin kategorioihin, jotka noudattavat tulevien käyttäjien/suurimman osan käyttäjistä hahmottamaa järjestystä.
2. Anna valikoille selkeät otsikot, joista käy hyvin ilmi niiden sisältö.
3. Käytä yksinkertaisia toimintaa kuvaavia verbejä kuvaamaan valintoja.
4. Käytä päätason otsikkoa vaikka otsikkorivillä, kun alivalikon valinta on valittuna.
5. Kun käytetään ympäri kiertävää valikkoa varmista, että käyttäjä tietää milloin valikko on kiertänyt ympäri ja palannut ensimmäiseen kohtaan. Tämän voi tehdä esimerkiksi niin, että sijoittaa ensimmäisen valikon valinnan aina näytön yläreunaan ja kun käyttäjä vierittää valikkoa alaspäin, korostettu valinta siirtyy näytöllä alaspäin ja hyppää taas ensimmäisen valinnan kohdalla näytön alareunasta yläreunaan.
6. Helpota käyttäjien navigointia ylöspäin valikkohierarkiassa. Näin käyttäjä voi nopeasti korjata virheensä, kun hän on valinnut väärän kategorian.
7. Tarjoa käyttäjälle tapa poistua valikosta ilman valinnan tekemistä. Siten käyttäjä voi poistua huomatessaan, että hänen etsimäänsä valintaa ei ole valikossa.

Lähteet: Jones, M., Marsden G., (2005) Mobile Interaction Design. John Wiley & Sons, Ltd.

Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Vähennä käyttäjän työskentelyä

Monimutkaisten tehtävien suorittamista varten wizardit eli velhot ovat tehokas tapa. Moniajoa pitäisi pääasiallisesti käyttää järjestelmän, ei käyttäjän. Esimerkkinä tehokkasta kontaktien hausta kontakteista suodattuu kaikki nimet, joissa näppäimistöltä annettu kirjain on ensimmäisenä joko etu- tai sukunimessä. 

Mauney ja Masterton (2008) antavat kirjassa HCI Beyond the GUI – Design for Haptic, Speech, Olfactory, and Other Nontraditional Interfaces suunnittelusääntöjä mobiililaitteille. Kirjoittajat jakavat suunnitteluohjeet viiteen eri osioon, joista seuraavaksi on esitetty tiivistetysti viides osuus, eli käyttäjän työskentelyn vähentäminen.

Käyttäjän psyykkisen sekä fyysisen työskentelyn määrä käyttäjävuorovaikutuksessa käyttöliittymän kanssa täytyy pitää mahdollisimman vähäisenä. Sen sijaan, että pakotettaisiin käyttäjä tekemään ylimääräistä työtä, hyvä suunnittelu tekee käyttäjän tehtävistä vaivattomia.

Monimutkaisten tehtävien suorittamista varten wizardien eli velhojen käyttäminen on tehokas tapa. Wizard ohjaa käyttäjän läpi asteittain etenevien osatehtävien ja vähentää näin käyttäjän muistikuormaa. Hyvin suunniteltu wizard antaa käyttäjän liikkua eteenpäin ja taaksepäin eri askeleiden välillä ja pitää käyttäjän jatkuvasti tietoisena siitä, missä vaiheessa prosessia ollaan menossa. Wizardien suunnittelussa pienille näytöille keskeistä on eliminoida mahdollisimman monta syöttökenttää käyttäjältä, teettämällä mahdollisimman paljon työstä ohjelmalla. Esimerkiksi osoitteen syöttämisessä, ohjelma voi täyttää kaupungin ja maan tiedot automaattisesti, kun käyttäjältä on ensin kysytty postinumero. (Mauney, Masterton, 2008)

Monet mobiilit käyttöjärjestelmät tukevat moniajoa. Moniajo on ohjelmistokehityksessä todellisessa kasvussa ja sen käytössä on oltava huolellinen käyttöliittymän toteutuksessa. Koska mobiililaitteen käyttäjän huomio kohdistuu vain rajallisesti laitteeseen ja hänellä on todennäköisesti tavoitteena suorittaa yksi tehtävä mahdollisimman nopeasti, käyttäjää ei pitäisi pakottaa ”tekemään moniajoa” tehtävän suorittamiseksi. Moniajo on tehokas apukeino, mutta pääasiallisesti sitä pitäisi käyttää järjestelmän, ei käyttäjän. Esimerkiksi, sellaiset järjestelmän tehtävät, joiden suoritus ei tapahdu sopivaan aikaan, voidaan suorittaa taustalla ilman, että se häiritsee käyttäjän laitteen käyttämistä. (Mauney, Masterton, 2008)

Yksi esimerkki tehokkaasta ja samalla yksinkertaisesta suunnittelusta on Nokian S60 sarjan kontaktien selaaminen. Käyttäjä voi vierittää aakkosjärjestyksessä olevia kontakteja pystysuunnassa, mutta jos kontakteja on paljon, vierittämisen sijaan käyttäjä voi syöttää haluamansa kirjaimen näppäimistöltä. Tämän jälkeen kontakteista suodattuu kaikki nimet, joissa näppäimistöltä annettu kirjain on ensimmäisenä joko etu- tai sukunimessä. Tekniikka on yllättävän tehokas ja helposti käyttäjän opittavissa. (Mauney, Masterton, 2008)

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Noudata standardeja

Käyttöliittymän suunnittelussa olisi noudatettava käyttöjärjestelmän suunnittelustandardeja, samoin kuin yleisesti käytössä olevia metaforeja.  

Mauney ja Masterton (2008) antavat kirjassa HCI Beyond the GUI – Design for Haptic, Speech, Olfactory, and Other Nontraditional Interfaces suunnittelusääntöjä mobiililaitteille. Kirjoittajat jakavat suunnitteluohjeet viiteen eri osioon, joista seuraavaksi on esitetty tiivistetysti neljäs osuus, eli standardien ja metaforien käyttäminen.

Suunnittelun lähtökohtana toimivat olemassa olevat standardit. Monilla kehittyneimmillä pieninäyttöisillä laitteilla, kuten Windows Mobile alustalla, on yksityiskohtaiset käyttöliittymän ohjeistukset, joilla varmistetaan yhdenmukaisuus kaikissa alustalle tehdyissä sovelluksissa. On tärkeää tutustua laitteen standardeihin, jotka koskevat esitystapaa, komponentteja (widget) ja vuorovaikutusta, ennen suunnittelun aloittamista. Näiden käyttöliittymän perusrakennuspalikoiden unohtaminen voi johtaa huomattavaan korjaustarpeeseen, jos käyttäjätestaus paljastaa ongelmia epästandardissa suunnittelussa. Visuaalisen suunnittelun standardeja tulisi rikkoa vain erityistapauksissa, kuten jos olemassa olevat puitteet eivät tue tehtävää. (Mauney, Masterton, 2008)

Oikean maailman metaforat, jotka siirtyvät hyvin ohjelmistomaailmaan, ovat yksi tehokkaimmista käyttöliittymä paradigmoista. Esimerkiksi play, pause, track forward ja track back –painikkeet ovat kaikissa digitaalisissa musiikkisoittimissa ja ovat olleet käytössä nauhasoittimista lähtien. Hyvin ymmärrettyjen metaforien rikkomisessa on omat vaaransa, koska suunnittelijalla ei ole mitään takeita siitä, että uusi käyttöliittymä toimii tehokkaasti ennen käytettävyystestien tekemistä. Sama sääntö koskee muidenkin olemassa olevien ja vakiintuneiden kontrollien, kuten valintaruutujen tai radiopainikkeiden, muokkaamista. (Mauney, Masterton, 2008)

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Pari muuta käytettävyysblogia

Tiedoksi kiinnostuneille pari muutakin käytettävyysaiheista blogia:

• yleisiä käytettävyysasioita (ei spesifisti mobiililaittesiin liittyviä) kirjoittelen Käytettävyysnavigoija-blogissa: http://kaytettavyysnavigoija.blogspot.com/
• Erikoisteemaa "Käytettävyys hankinnoissa" käsitellään Hanki käytettävyyttä! -blogissa http://hankikaytettavyytta.blogspot.com/

Anna hyödyllistä palautetta

Palautteen antaminen tärkeää. Kuitenkin esimerkiksi äänimerkkejä tulisi käyttää säästeliäästi, jotta laite ei turhaan herätä huomiota. Jos vasteaika on yli 200 ms, tulisi sen kuluminen ilmaista. Aina, kun käyttäjä joutuu odottamaan, hänelle pitäisi tarjota myös mahdollisuus peruuttaa tehtävä. 

Mauney ja Masterton (2008) antavat kirjassa HCI Beyond the GUI – Design for Haptic, Speech, Olfactory, and Other Nontraditional Interfaces suunnittelusääntöjä mobiililaitteille. Kirjoittajat jakavat suunnitteluohjeet viiteen eri osioon, joista seuraavaksi on esitetty tiivistetysti kolmas osuus, eli hyödyllisen palautteen antaminen käyttäjälle.

Käyttäjälle annettavan palautteen tulee olla hyvin erottuvaa, koska käyttäjän huomio on jakaantunut ympäristön kanssa. Käyttäjän täytyy tietää jatkuvasti, mitä järjestelmä tekee, kun hän käyttää järjestelmää. Käyttäjän tarpeisiin nähden kriittinen palaute pitää tunnistaa ja antaa käyttäjälle ainoastaan se. (Mauney, Masterton, 2008).

Mobiililaitteiden eri aisteihin perustuva palaute voi olla hyvin erottuvaa. Ääneen tai kosketukseen perustuva palaute on standardi tekniikkaa monissa pieninäyttöisissä laitteissa, koska käyttäjän huomio on harvoin täysin laitteen käytössä. Vaihtoehtoisen palautteen antamista kannattaa kuitenkin harkita tarkkaan, koska käyttäjät eivät halua kääntää huomiotaan laitteeseen turhaan, jollei jotain tärkeää ole tapahtunut, siksi esimerkiksi äänimerkkejä tulisi käyttää säästeliäästi. (Mauney, Masterton, 2008).

Jos jonkin operaation suorittaminen kestää niin kauan, että käyttäjä joutuu odottamaan järjestelmän vastausta, olisi sen suoritus hyvä tehdä taustalla. Jos niin ei voida tehdä, käyttäjälle pitää antaa yksityiskohtaista palautetta operaation kestosta. Hyvä palaute sisältää arvion operaatioon kuluvasta ajasta. Tähän tarkoitukseen soveltuu hyvin tilapalkki, joka näyttää arvion ajasta ja sen lisäksi antaa palautetta käyttäjälle operaation edistymisestä. RIM:n tyylioppaan mukaan vasteajan pitäisi olla enintään 200 ms. eli 1/5 sekuntia. Aina, kun käyttäjä joutuu odottamaan, hänelle pitäisi tarjota myös mahdollisuus peruuttaa tehtävä. (Mauney, Masterton, 2008).

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Suunnittelu pienelle näytölle

Käyttäjän tekemä tiedon syöttö pitäisi minimoida; kun mahdollista, tiedon syöttämistä kannattaa kokonaan välttää. Hyperlinkkejä kannattaa käyttää hyödyksi. Tärkein informaatio tulisi näyttää ensimmäisenä. Virheilmoitusten tulee olla hyödyllisiä. Suositeltavaa käyttää mieluummin pystysuoraa kuin vaakasuuntaista vieritystä.

Mauney ja Masterton (2008) antavat kirjassa HCI Beyond the GUI – Design for Haptic, Speech, Olfactory, and Other Nontraditional Interfaces suunnittelusääntöjä mobiililaitteille. Kirjoittajat jakavat suunnitteluohjeet viiteen eri osioon, joista seuraavaksi on esitetty tiivistetysti toinen osuus, eli suunnittelu pienille näytöille.

Käyttäjän tekemä tiedon syöttö pitäisi minimoida, siksi uusien tiedon syöttämistä tarvitsevien vimpaimien lisäämistä kannattaa aina harkita tarkkaan. Kun mahdollista, tiedon syöttämistä kannattaa kokonaan välttää, esimerkiksi jos laite antaa käyttäjälle ei-kriittistä palautetta, voi olla järkevää käyttää dialogi laatikkoa, joka häviää näytöltä automaattisesti tietyn ajan kuluttua. (Mauney, Masterton, 2008).

Silloin, kun tiedon syöttämistä on pakko käyttää, se kannattaa toteuttaa niin, että siitä on käyttäjälle mahdollisimman vähän vaivaa esimerkiksi, jos käyttäjän pitää syöttää kaupungin nimi, on parempi vaihtoehto käyttää jotain tunnistukseen perustuvaa menetelmää, kuten radiopainikkeita, alasvetovalikoita tai valintaruutuja. Esimerkissä kaupungin nimen syöttämiseen olisi tehokkaampaa käyttää joko valintaa, tai postinumeron syöttämistä. (Mauney, Masterton, 2008).

Hyperlinkkejä voidaan käyttää hyödyksi, kun yhdelle sivulle ei saada mahtumaan riittävästi tekstiä esimerkiksi, kun joku virheilmoitus vaatii yksityiskohtaista tekstimuotoista ohjetta. Hyperlinkkien hyvänä puolena onkin, että niiden avulla jokin tieto voidaan piilottaa, mutta pitää silti helposti saatavilla. Varsinkin tilanteissa, joissa sama tieto näkyy käyttäjälle usein, hyperlinkit ovat käteviä. (Mauney, Masterton, 2008)

Jos tietoa näytöllä ei ole esitetty tarkoituksenmukaisesti, voi jopa vähäinen sisältö näytöllä aiheuttaa sekaannusta. Tärkein informaatio tulisi näyttää sivulla ensimmäisenä ja suurimmalla koolla, riippuen käyttäjän kulloisestakin tehtävästä. Jos tietoa ei voi priorisoida, se kannattaa laittaa loogiseen järjestykseen, (joko aakkostaen tai aikajärjestyksessä), jotta käyttäjän muistikuormaa ei lisätä ja tehokkuus olisi parempi. Tiedon ryhmittely tekee lisäksi tiedon visuaalisesta skannaamisesta nopeampaa. (Mauney, Masterton, 2008).

Virheilmoitusten täytyy olla hyödyllisiä myös mobiiliohjelmistoissa. Virheilmoituksen tulisi koostua kolmesta eri osa-alueesta 1) virheen ainutkertaisesta tunnisteesta, jotta käyttäjä voi etsiä apua jostakin toisesta lähteestä, kuten asiakaspalvelusta. 2) Ongelman kuvauksesta ja 3) mahdollisesta ratkaisusta ongelmaan. Kohdat kaksi ja kolme pitää kirjoittaa käyttäjän ymmärtämällä kielellä. (Mauney, Masterton, 2008)

Ihannetapauksessa sivu mahtuu kokonaisuudessaan näytölle. Monesti tämä ei ole kuitenkaan mahdollista, esimerkiksi ohjetekstin tai muun informaation takia. Ohjetekstit pitäisi olla mobiilisovelluksissa lyhyitä sovellusten yksinkertaisuuden takia. Pitkät ohjeteksti voivat olla merkki siitä, että käyttöliittymä on liian monimutkainen. (Mauney, Masterton, 2008).

Monimutkaisemmissa sovelluksissa tai www-sivuilla vieritystä on mahdotonta välttää. Tuolloin on suositeltavaa käyttää mieluummin pystysuoraa vieritystä kuin vaakasuuntaista vieritystä, koska Internetin käyttö on tehnyt alaspäin vierityksestä tuttua suurimmalle osalle käyttäjistä. Vaakasuora vieritys taas on vaikeampi ymmärtää, koska lukijan on hankalampi hahmottaa se visuaalisesti. Kun vaakavieritystä kuitenkin tarvitaan, esimerkiksi suurten kuvien tai karttojen yhteydessä, ”vieritysrajojen” käyttö on kannattavaa. (Mauney, Masterton, 2008).

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Suunnittele yksinkertaista

Useimmiten suoritettavat tehtävät pitäisi olla parhaiten näkyvillä. Poista toiminnallisuutta, jota käytetään vain satunnaisesti. Pidä käyttöliittymän tietohierarkia sekä kapeana että matalana.  On tehokkaampaa suunnitella syvempi rakenne kuin leveämpi. Osita monimutkaiset tehtävät erillisiin helpommin ymmärrettäviin osiin. Asteittainen paljastaminen parantaa käyttäjän tehtävien suoritusnopeutta. 

Mauney ja Masterton (2008) antavat kirjassa HCI Beyond the GUI – Design for Haptic, Speech, Olfactory, and Other Nontraditional Interfaces suunnittelusääntöjä mobiililaitteille. Kirjoittajat jakavat suunnitteluohjeet viiteen eri osioon, joissa Mauney ja Masterton esittelevät yhteensä 19 eri suunnittelusääntöä. Seuraavaksi on esitetty tiivistetysti ensimmäinen osuus, eli pyrkimys yksinkertaisuuteen.

Käyttöliittymän päätavoitteena on pyrkiä yksinkertaisuuteen. Ensimmäinen askel yksinkertaistamisprosessiin on ymmärtää, mitä käyttäjä haluaa laitteen tekevän, toisin sanoen erityisen tärkeää on ymmärtää käyttäjän tarpeet.

Useimmiten suoritettavat tehtävät ja ne tehtävät, joita suurin osa käyttäjistä käyttää, pitäisi olla parhaiten näkyvillä käyttöliittymässä. Toisaalta käyttöliittymää voidaan pyrkiä pelkistämään, eli poistetaan toiminnallisuutta, jota käyttävät vain muutamat käyttäjät satunnaisesti. Tämä vaatimus koskee myös yksittäisiä näyttöjä, jotka täytyy pitää yksinkertaisina. (Mauney, Masterton, 2008).

Yksinkertaisuuteen voidaan pyrkiä myös pitämällä käyttöliittymän tietohierarkia sekä kapeana (vähemmän valintoja per taso), että matalana (vähemmän tasoja valittavana hierarkian juureen). Jos valintojen määrä välttämättä ylittää kapean ja matalan hierarkian, mobiileissa sovelluksissa on tehokkaampaa suunnitella syvempi rakenne kuin leveämpi. Myöskään räätälöinti ei sovellu tai ole edes tarpeellista pienille näytöille, koska räätälöinti lisää monimutkaisuutta ja mobiilisovellukset ovat tyypillisesti perinteisiä sovelluksia yksinkertaisempia. (Mauney, Masterton, 2008).

Ehkä kuitenkin tehokkain keino yksinkertaistaa käyttöliittymää on osittaa monimutkaiset tehtävät erillisiin helpommin ymmärrettäviin osiin. Tässä ns. asteittaisessa paljastamisessa jokainen askel jaetaan yksittäiselle ruudulle, jotka johtavat yhdessä käyttäjän tavoitteeseensa. Esimerkkinä on hierarkkinen navigointi, jossa käyttäjälle annettavat valinnat on jaettu tarkoituksen mukaisiin ryhmiin ja aliryhmiin. Päällisin puolin asteittainen paljastaminen näyttää rikkovan tehokkuuden vaatimusta, mutta käytännössä se parantaa käyttäjän tehtävien suoritusnopeutta. (Mauney, Masterton, 2008).

Lähteet: Mauney, D.W., Masterton, C., (2008). Small-Screen Interfaces in HCI Beyond the GUI. Design for Haptic, Speech, Olfactory and Other Nontraditional Interfaces. Ed. Kortum, P., Morgan Kaufman.

Suunnittelusääntöjen tunteminen on käyttöliittymäsuunnittelijan perusosaamista

Suunnitteluohjeistot antavat yleisiä, sovelluksesta riippumattomia ohjeita vuorovaikutusratkaisujen (käyttöliittymän) suunnitteluun. 

Blogin aluksi keskitytään mobiilien laitteiden käyttöliittymien suunnittelusääntöihin (-ohjeistoihin).

Suunnittelusäännöt tukevat erityisesti vuorovaikutuselementtitason suunnittelua, käyttöliittymän "pintatasoa". Ohjeistot antavat peruslaadun käyttöliittymiin, mutta eivätkä korvaa tehtävätasoa ja käytettävyysaktiviteetteja. (näistä tasoista enemmän kirjassa "Navigoi oikein käytettävyden vesillä"; ks. linkki alla)

Suunnitteluohjeistolla on kaksi käyttötapaa. Tärkein on (1) ohjata suunnittelijaa suunnitteluratkaisujen tuottamisessa.  Toinen on (2) toimia tarkistuslistoina ulkopuolisen tekemissä  tarkistuspohjaisissa käytettävyysarvioinneissa. 

Yleisiä käyttöliittymien suunnittelusääntöjä on esimerkiksi standardisarjassa ISO 9241.
Mobiililaitteille suunnittelusääntöjä ja heuristiikkoja on kehitetty erityisesti 2000 -luvun alkupuolella. 

Suunnittelusääntöjen kehityksen taustalla on ollut joko tunnettujen asiantuntijoiden perinteisille tietokoneille tehdyt säännöt, kuten esimerkiksi Nielsenin heuristiikat tai Schneidermanin kahdeksan kultaista sääntöä, mutta niitä on kehitetty myös perustuen eri asiantuntijoiden kokemukseen tai käyttäjätutkimuksiin.

Osa vakiintuneista suunnittelusäännöistä ja heuristiikoista soveltuu sellaisenaan myös mobiililaitteille, osaa säännöistä joudutaan muokkaamaan sopiviksi ja osa mobiililaitteiden/sovellusten ohjeista on täysin uniikkeja.

Tyypillistä suunnittelusäännöissä on se, että ne ovat usein vain osittaisia tai niitä ei esitetä kovin tarkalla ja konkreettisella tasolla. Ne voivat olla myös niin spesifisiä, keskittyen vain tietylle osa-alueelle (kuten esimerkiksi mobiileja opetusportaaleja, tai mediagallerioita varten), jolloin niitä ei suoraan soveltaa muihin tapauksiin.


- Seuraavissa kirjoituksissa siis esitetään eri lähteistä löytyviä suunnittelusäätöjä. 


Lähteet:


Bertini, E. Catarci, T. Kimani, S., Dix, A., (2005). A review of standard usability principles in the context of mobile computing. Studies in Communication Sciences, 5(1):111–126, 2005.


Jokela, T. (2010). Navigoi oikein käytettävyyden vesillä. www.kaytettävyyskirja.net