torstai 26. toukokuuta 2011

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.