Käyttöliittymät

 

Tentti 2.5.2000


 
   Palaverivaraukset
   Kurssikuvaus
   Kurssin sisältö
   Suorittaminen
   Luennot
   Laskarit
   Harjoitustyö
   Kurssimateriaali
   Opettajat
   Tuloslistat
-> Tentit
   Kurssipalaute
   Linkit

  Sulje valikko
 

Tehtävä 1 (4 p.)

Tehtävänäsi on suunnitella osa skannausohjelman käyttöliittymäratkaisusta. Oletetaan, että olemme jo määritelleet seuraavat kohdepersoonat, joille softa suunnitellaan:

Marko, 35,
WWW-sivujen tuottaja

Marko on aloittanut oman pienen konsulttibisneksensä kotona: hän tekee asiakkailleen WWW-sivustoja. Hän ei ole tekninen guru eikä ammattigraafikko, mutta hän tuntee tietokoneita ja tietää esimerkiksi sen, että nopeasti latautuvat kuvat ovat WWW-sivuilla parempia kuin hitaasti latautuvat isot kuvat. Hän tarvitsee skanneria saadakseen suunnittelemilleen WWW-sivuille sopivia kuvia.

Kasperi, 10
koululainen

Kasperi skannailee kuvia omille kotisivuilleen ja kouluun tekemiinsä harjoitustöihin. Kouluaineista tulee hienoja, kun niihin saa lisättyä värikuvia.

Esimerkiksi ammattigraafikko tarvitsisi kalliita, korkearesoluutioisia laitteita, joten hänet on päätetty jättää tämän tuotteen ensisijaisten kohdepersoonien ulkopuolelle.

Kumpikaan, Marko tai Kasperi, ei tiedä kuvankäsittelystä kovin paljon. Markoa kiinnostaa kuvankäsittelyä enemmän WWW-sivujen teko ja rahan ansaitseminen. Kasperi ei halua kadottaa kuviaan tiedostojärjestelmän uumeniin. Kummallakaan ei ole mitään erityistä mielenkiintoa säätää pikseleitä, resoluutioita tai muita asetuksia. He molemmat haluavat saada sijoitettua sopivan kokoisiksi rajatut kuvat dokumentteihinsa, joita he ovat tekemässä.

Keskitymme suunnittelussa siihen, että kaikki skannerin hallintaan liittyvät toiminnot poistetaan. Kuvat eivät myöskään saa kadota käyttäjiltään tiedostojärjestelmään, ja niitä pitää olla helppoa sijoittaa dokumentteihin. Jäljelle jää kolme toimintoa, jotka päätämme ottaa käyttöliittymäsuunnittelun ensimmäiseen vaiheeseen mukaan:

  • kuvan rajaaminen (clipping the sides of the image),
  • kuvan koon venyttäminen/kutistaminen (resize) ja
  • kääntäminen (reorient).

Tehtävä: Koska sekä Marko että Kasperi tarvitsevat em. toimintoja jatkuvasti, tehtävänäsi on suunnitella näille kolmelle toiminnolle mahdollisimman tehokas ja helppokäyttöinen käyttöliittymäratkaisu. Oleta, että kuva on juuri skannattu sisään ja se on näytöllä näkyvillä. Suunnittele kuvalle em. kolme toimintoa: rajaaminen, koon muuttaminen ja kääntäminen. Piirrä ratkaisusi seuraavalle sivulle ja kuvaa se niin, että toinen käyttöliittymäsuunnittelija ymmärtää sen toiminnan.

(Laskaritehtävä 4.1.)


Tehtävä 2 (6 p.)

Peruminen (undo) on eräs keskeisimmistä toiminnoista useimmissa järjestelmissä, ja käyttöliittymäsuunnittelijat joutuvat usein ratkaisemaan tämän ongelman. Oletetaan, että olemme suunnittelemassa undo/redotoimintoja piirtoohjelmaan.

Käytä lähtötilanteena seuraavaa käyttäjän tekemää toimintosekvenssiä:

  • 1L: Käyttäjä piirtää punaisen laatikon.
  • 2Y: Käyttäjä piirtää punaisen ympyrän.
  • 3V: Käyttäjä piirtää punaisen viivan.
  • 4L: Käyttäjä vaihtaa laatikon värin mustaksi.
  • 5Y: Käyttäjä siirtää ympyrää.
  • 6V: Käyttäjä lyhentää viivaa.

Voit käyttää koodeja 1L..6V lyhenteinä em. käyttäjän toimenpiteistä.

2.a (4 p.)

Näytä käyttämällä edellä annettua esimerkkisekvenssiä lähtötilanteena, miten Emacsin undo toimisi piirtoohjelmassa. Kuvaile siis yksi undo/redo-operaatioita sisältävä toimintosekvenssi ja visualisoi sopivasti selityksillä höystettynä Emacsin undo/redo-mekanismi em. toimintosekvenssin yhteydessä. Tärkeintä on, että lukija saa esityksestäsi mahdollisimman helposti mahdollisimman oikean sisäisen mallin (mental model).

Emacsin undo = GNU Emacsin tai XEmacsin undo. MikroEmacsissa ei ole undo:ta. Huomaa, että tässä tehtävässä ei tarvitse osata Emacsin komentoja, vaan tuntea käsitteellisesti Emacsin undo-mekanismin toimintaperiaate.

(Laskaritehtävä 6.1.)

2.b (2 p.)

Millaisessa tilanteessa Word- tai WP-tyyppisessä undo/redo-mekanismissa hävitetään käyttäjän tekemiä toimenpiteitä kokonaan siten, että käyttäjän on pakko tehdä ne käsin uudestaan, eikä hän enää pysty mitenkään palauttamaan niitä undo/redo-mekanismilla? (Wordissä ja WP:ssä on periaatteiltaan keskenään samanlainen undo/redo-mekanismi.) Anna tästä yksi esimerkki käyttäen lähtötilanteena edellä esitettyä toimintosekvenssiä.


Tehtävä 3 (3 p.)

Perustele, miksi seuraava väite on virheellinen: "Valikkopalkin (menu bar) pudotusvalikkoon on hyvä sijoittaa noin 7+2 vaihtoehtoa, koska ihmisen työmuistiin mahtuu kerrallaan noin 7+2 muistiyksikköä (chunks)."


Tehtävä 4 (3 p.)

Tässä tehtävässä tarkastellaan sitä sovelluskehitintä, jolla teit harjoitustyösi. Jos et tehnyt työtäsi sovelluskehittimellä, mutta tunnet jostain muusta yhteydestä jonkin sovelluskehittimen, käytä sitä tässä esimerkkinä.

Tuntemasi sovelluskehitin (yleensä se, jolla teit harjoitustyösi):

Anna sovelluskehittimesi käyttöliittymästä jokin konkreettinen esimerkki, jossa sovelluskehittimessä oleva huono käyttöliittymäratkaisu lisää tarpeettomasti käyttäjän työmuistin kuormaa. Perustele: missä kohdassa sitä työmuistia käytetään ja miten. Valitse mahdollisimman hyvä esimerkkitapaus. Piirrä tarvittaessa kuvia.

Käyttäjällä tarkoitetaan tässä sovelluskehittimen käyttäjää, ei syntyneen proton tai ohjelman loppukäyttäjää.


Tehtävä 5 (14 p.)

Tehtävänäsi on suunnitella käyttöliittymäratkaisu käyttäjätarkkailuista kertyvän digitaalisen videomateriaalin editointia ja näyttämistä varten.

Kohdepersoona: Jarkko, 28, käytettävyysasiantuntija

Jarkko on valmistunut muutama vuosi sitten yliopistolta pääaineenaan psykologia. Hän tekee työkseen käyttöliittymäsuunnittelijoiden tukena asiakkailleen käyttäjätarkkailuja eli seuraa loppukäyttäjiä kentällä. Tarkkailujen aikana hän kuvaa tarkkailtavista käyttäjistä, ympäristöstä ja käyttötilanteista paljon videomateriaalia.

Esimerkki tyypillisestä tarkkailutilanteesta:

Tiistaina 18.4. klo 14-17 Jarkko seurasi Ilta-Sanomien (IS) toimittajaa selvittääkseen, miten tämä käyttää kannettavassa tietokoneessaan sähköpostiohjelmaa työpäivänsä aikana. Jarkko kuvasi kolmen tunnin tarkkailusta noin tunnin verran videokuvaa, mm. yleiskuvaa siitä, kun tarkkailtava käyttäjä käveli Sanomatalon pihalla autoonsa lähteäkseen seuraamaan koripallo-ottelua, josta hänen oli määrä kirjoittaa juttu; tietokoneen näyttöön zoomatun pätkän siitä, kun toimittaja vilkaisi uusien sähköpostiviestien otsikot autossa heti perille saavuttuaan; sekä esimerkiksi lähikuvaa toimittajan muistiinpanojen tekemisestä tietokoneella samalla, kun hän haastatteli urheilijaa.

Tarkkailun jälkeen Jarkko haluaisi mennä takaisin toimistolleen ja editoida ottamansa videomateriaalin seuraavasti: Hän haluaa näyttää asiakkaalle (tarkkailututkimuksen tilaajalle) jälkeenpäin joitain hyviä esimerkkejä kiinnostavista tilanteista. Sellaisia olisivat esimerkiksi se, kun tarkkailtava toimittaja luki autossa uusien sähköpostiviestien otsikot, tai se, kun toimittaja kirjoitti muistiinpanoja haastattelun aikana ja sai kesken kaiken ilmoituksia uusista saapuneista sähköpostiviesteistä. Näiden kiinnostavien pätkien kesto on tyypillisesti noin 30 sekunnista 6 minuuttiin.

Jarkko haluaisi valita kaikista kuudesta sähköpostitarkkailuun osallistuneesta käyttäjästä parhaita paloja asiakaspalaverissa näytettäväksi. Palaverissa hän aina ensin kuvailee tilanteen taustaa suullisesti ja näyttää sitten valitsemansa lyhyen videopätkän. Hän ei halua tehdä videopätkistä minkäänlaista valmista "lyhyttä elokuvaa" tai koostetta, vaan hän näyttää pätkiä aina muun esityksensä ohessa havaintomateriaalina.

Palaveriesitysten lisäksi Jarkko tarvitsee videopätkiä koulutuskeikoillaan. Hän pitää käytettävyyden arviointimenetelmiä käsitteleviä lyhyitä yrityskoulutuskursseja ja haluaa usein havainnollistaa tosielämän esimerkkejä näyttämällä autenttista videomateriaalia. Tällöin hän valitsee näytettäväksi osittain eri pätkiä kuin asiakaspalaverien tapauksessa, mutta näissä koulutustilaisuuksissakin hän aina ensin selittää tilannetta suullisesti ja vasta sitten näyttää yhden havaintoesimerkin ko. tilanteesta. Tarvetta minkäänlaisten videokoosteiden tekemiseen ei ole. Jarkon tarpeet videopätkien näyttämiseen koulutuksissa ovat vastaavanlaisia kuin esimerkiksi Käyttöliittymät-kurssin luentojen videoesimerkkien näyttämisessä, vrt. esim. käytettävyystestiesimerkit. Joskus on tarpeen pysäyttää video ja selittää kesken kaiken vähän lisää. Joskus on näytettävä nopeasti ohi vilahtanut kiinnostava kohta uudemman kerran.

Kumpaankin tarkoitukseen (tarkkailututkimuksen tilanneen asiakkaan palavereihin ja yrityskoulutukseen) Jarkko haluaa etukäteen etsiä sopivat videopätkät ja merkitä niiden yhteyteen taustatietoja siitä, mitä asioita videopätkässä tulee esiin, esim. "IS:n toimittaja katsoo sähköpostiensa otsikot autossa kisahallin parkkipaikalla." tai "IS:n toimittaja tekee haastattelusta muistiinpanoja. Eudora katkaisee työn kaksi kertaa: You have new mail. Äänimerkki mukana."

Tehtävä: Suunnittele Jarkolle käyttöliittymä videoeditointiohjelmaan, jolla hän pystyy (1) valitsemaan digitaalisesta videomateriaalistaan kiinnostavat pätkät asiakaspalavereitaan ja koulutuskeikkojaan varten ja (2) näyttämään valitsemansa pätkät palavereissa ja koulutustilaisuuksissa siten, että hän voi aina ensin vilkaista muistiinpanojaan, esim. "IS:n toimittaja katsoo sähköpostiensa otsikot autossa" ja sitten näyttää ko. videopätkän yleisölle.

Piirrä ja selitä ratkaisusi seuraaville tyhjille paperiarkeille siten, että toinen käyttöliittymäsuunnittelija ymmärtää sen toiminnan.

Jarkon korkean tason tavoitteita tiivistetysti ja yleistetysti:

  • Tyypillisesti 2-15 (noin 30 s - 6 minuutin pituisen) videoesimerkin valitseminen ja tekstimuotoinen kommentointi noin 1-6 digitaaliselta videonauhalta (tiedostosta) palaveria tai koulutusluentoa varten.

  • Tammikuussa pidettyä tilaisuutta varten kootun materiaalin ottaminen pohjaksi toukokuun tilaisuutta varten. Osa kamasta heitetään nyt pois ja joistain esimerkkivideoista näytetäänkin nyt hieman pidempi pätkä kuin viimeksi, esim. enemmän johdantoa ko. tilanteeseen. Lisäksi mukaan otetaan joitain uusia pätkiä uusilta videonauhoilta.

  • Etukäteen valittujen videoesimerkkien näyttäminen tilaisuuden aikana yksi kerrallaan siten, että Jarkko selittää ensin, mistä on kyse, ja näyttää sitten yhden videon. Kesken videon näyttämisen on usein tarvetta selittää hieman lisää tai katsoa jokin kohta uudelleen. Toisinaan on tarvetta palata näyttämään samassa tilaisuudessa aiemmin katsottua videopätkää vertailun vuoksi.

 
   

Päivitetty 21.12.2000 / Sari A. Laakso, email: salaakso@cs.helsinki.fi
Sivun URL: http://www.cs.Helsinki.FI/~salaakso/kl-2001/tentti-2.5.2000.html
Näiden WWW-sivujen hallintajärjestelmän kehitti Tero Pekkanen