Tarjolla tänään Suorakäyttö Saila Ovaska Informaatiotieteiden yksikkö Tampereen yliopisto Suoravaikutteisen käyttöliittymän historia ensimmäisiä suorakäyttöisiä järjestelmiä 1960-luvulta: Sketchpad, GRAIL, NLS, Dynabook kunnes sitten WIMP-käyttöliittymät tuotteistettiin: Xerox Star 1981, Mitä on suorakäyttö? Keskeisiä käsitteitä: Työpöytämetafora WYSIWYG-periaate (What You See Is What You Get) Tavoitteina spatiaalisen ja temporaalisen siirtymän minimointi kognitiivisen rasituksen minimointi, suorakäyttöisyyden tuntu Esimerkkejä suorakäyttöisistä järjestelmistä Tasaustoiminto eri tavoin Kaksikätinen vuorovaikutus Hiirikursoriin liittyvät kehitysehdotukset 1 2 Suoravaikutteisen käyttöliittymän historiaa: Sketchpad Suoravaikutteisen käyttöliittymän historiaa: NLS Ivan Sutherland, 1963: Sketchpad Olioperustaisuus, ikkunat, graafinen käyttöliittymä Lähteet: Doing with images makes symbols video, http://video.google.com/videoplay?docid=-533537336174204822 http://en.wikipedia.org/wiki/sketchpad sekä http://toastytech.com/guis/guitimeline.html ja http://www.youtube.com/watch?v=495nczxm9pi 3 Douglas Engelbart Stanford Research Institute Hiiri, hyperteksti, tietokonetuettu yhteistyö, jaetut näytöt,... The mother of all demos San Francisco, Dec 1968 With live connection to Menlo Park (30 miles away) http://sloan.stanford.edu/mousesite/1968demo.html NLS (on-line System) developed and used at SRI 4 Muita saavutuksia, 1968 GRAIL Graphical input language RAND tablet Kynäkäyttöliittymä Yliopistoista kaupallisiksi tuotteiksi DynaBook Ideoitu vaan ei toteutettu 1968 Nykyisen sylikoneen pahvimalli, litteä paneelinäyttö, kevyt ja mukana kannettava, lapsillekin http://www.youtube.com/watch?v=r36nngznvjo 5 Brad A. Myers, A Brief History of Human Computer Interaction Technology. ACM interactions. Vol. 5, no. 2, March, 1998. pp. 44-54. http://www.cs.cmu.edu/~amulet/papers/uihistory.tr.html 6 Saila.Ovaska@uta.fi 1
Graafisen käyttöliittymän kaupallinen kehitys Xerox 8010 Graafinen käyttöliittymä Xerox Star, 1981 Apple Macintosh, 1984 The best way to predict the future is to invent it. Alan Kay, Xerox PARC eli Xerox Star, 1981 Ominaisuuksia kuvakkeet, ikkunointi, dialogiruudut, fontit, ja 1024*768 monokromaattinen näyttö Työpöytämetafora Kuvakkeet näkyvissä Suorakäyttö Kohteiden osoittaminen Hiiri + näppäimistön komentopainikkeet Xerox PARC: Alto 1972-73 Ei kaupallinen tuote Xerox PARC: Xerox Star, 1981 Hinta n. 17000 USD Apple: Macintosh, 1984 Hinta n. 2500 USD 7 WYSIWYG http://www.digibarn.com/friends/curbow/star/retrospect/sidebar.html http://www.digibarn.com/friends/curbow/star/retrospect/index.html http://www.digibarn.com/collections/movies/digibarn-tv/gui-movies/xerox/index.html#intro 8 Direct manipulation Suorakäyttöisyys Shneidermanin mukaan Direct manipulation = suorakäyttö Termin isä on Ben Shneiderman, joka otti termin käyttöön 1980 luvun alussa Shneiderman, B. Direct Manipulation: A Step Beyond Programming Languages. IEEE Computer, August 1983, 16(8), 57-68. Työpöytämetaforan rinnakkaiskäsite: Kohteita voidaan käsitellä suoraan ja tuloksen näkee heti Myös esim. taulukkolaskenta on suorakäyttöistä numeroiden muokkausta verrattuna esim. tietokantaohjelmaan, jossa päivitykset tehdään komentokielellä tai täyttämällä ja lähettämällä lomake Shneiderman (Marylandin yliopisto, HCIL) kehitti etenkin suorakäyttöisiä informaation visualisointityökaluja Visuaalisuus: käyttäjälle esitetään kuva maailmasta sen sijaan, että käyttäjän pitää kuvitella maailma Suoruus: käyttäjä manipuloi (osoittaa, siirtää) suoraan objekteja sen sijaan, että kuvaisi haluamansa toimenpiteen jollakin kielellä Toimintojen toteutuvuus: toiminnot toteutetaan yleensä välittömästi, usein vähän kerrallaan, ja ne voidaan yleensä peruuttaa Analogia: auton ajaminen vs. autonkuljettajan käyttö 9 10 Suorakäyttöisyys Suorakäytön etuja (?) Vertaa Normanin hyvän suunnittelun periaatteisiin Näkyvyys (visibility): tee asiat näkyviksi Kytkennät (mappings): tee ohjainten ja toimintojen yhteys selväksi Käsitemalli (conceptual model): tarjoa selkeä käsitemalli Palaute (feedback): anna palautetta Virheiden käsittely (to err is human): varaudu virheisiin Käyttäjät pääsevät nopeasti alkuun, usein jonkun toisen opastamana Kokeneet käyttäjät pystyvät työskentelemään erittäin nopeasti Satunnaiskäyttäjät pystyvät muistamaan käytön perusteet (tunnistaminen helpompaa kuin muistaminen) Virheilmoituksia tarvitaan harvoin Käyttäjät näkevät heti, johtavatko toimenpiteet haluttuun tulokseen Käyttäjät ovat tyytyväisiä: he tuntevat hallitsevansa "koko" järjestelmän ja samalla työnsä suorittamisen haluavat oppia lisää kokeilemalla järjestelmän kaikkia piirteitä esittelevät mielellään järjestelmää toisillekin 11 12 Saila.Ovaska@uta.fi 2
Xerox Star työpöytä: ensimmäiset ideat TYÖPÖYTÄMETAFORA Tim Mott: Office schematic työpöytä-hahmotelma Yksinkertainen kaksiulotteinen ikoninen representaatio toimistosta Fyysiset metaforat Mistä kuvakkeet tulivat työpöydälle? Larry Teslerin haave: Vuorovaikutteinen järjestelmä, jota kuka tahansa voi Käyttää Ikonit muistuttavat ihmisiä käsitteistä ja he ymmärtävät niiden idean nopeasti lukematta sanaakaan 13 Kuvan lähde: Moggridge, Designing interactions http://www.designinginteractions.com/interviews/timmott http://www.designinginteractions.com/chapters/1 14 Xerox Star: työpöytä Star-järjestelmän ja sen seuraajien suunnittelun taustalla oli työpöytämetafora Metaforan tai paremminkin analogian merkitys suunnittelussa: yritetään käyttää systemaattisesti hyväksi käyttäjällä muusta ympäristöstä olevaa tietämystä ihmiselle luonteenomainen tapa orientoitua uuteen tilanteeseen on verrata tilannetta aikaisemmin koettuun metafora on hyvä perusta sisäisen mallin rakentamiselle, oppimiselle mutta metaforat ovat aina puutteellisia 15 16 Työpöytämetaforan toimivuus Työpöydällä (toimistossa) voi olla Dokumentteja (tiedostoja) Kansioita Apuvälineitä, kuten laskin Roskakori Työpöydällä olevia kohteita voi liikutella (raahata) ja järjestellä Miten ikkunat liittyvät työpöytään? Ja onko roskakorin paikka työpöydällä Ja pitääkö käyttäjän ymmärtää, mitä tapahtuu raahatessa? Jos raahattava kuvake on Esimerkki: raahausoperaatio (Macintosh) ja raahauksen määränpää on niin aikaansaatu toiminta on dokumentti kansio samalla levyllä dokumentin siirtäminen dokumentti kansio eri levyllä dokumentin kopiointi dokumentti ohjelma-ikoni dokumentin avaaminen ohjelmalla levy eri levy levyn kopiointi dokumentti roskakori dokumentin siirtäminen roskakoriin levy roskakori levynpoistokoneesta Vrt. Windows: myös pikakuvakkeen luonti mahdollinen toiminto raahauksen tuloksena. 17 18 Saila.Ovaska@uta.fi 3
Raahausoperaation semantiikka Osasyy raahausesimerkissä kohdattuun ongelmaan: raahaaminen (drag and drop) on samanlaista kohteesta tai sen sijainnista riippumatta samanlainen komennon syntaksi mutta erilainen tulos kuvakkeessa ei ole visuaalista indikaattoria, joka kertoisi, millä levyllä sen edustama dokumentti sijaitsee Esimerkiksi eri levyillä (ja levykkeillä) on Windows- ja Macintosh-ympäristössä oma roskakori WYSIWYG JA SUORAKÄYTÖN ONGELMAT 19 20 Tekstinkäsittely ja WYSIWYG Teksti Emacs-editorissa (Unix-pääteyhteys) vs. muotoiltuna Word-ohjelmassa Tekstinkäsittelyn suorakäyttöisyys WYSIWYG-periaate: What You See Is What You Get Teksti näyttäytyy käyttäjälle näytöllä sellaisena kuin sen lopullinen ulkoasu on paperille tulostettaessa 21 WYSIWYGin etuja Ei tarvita muunnosta sisäisen mallin ja käyttöliittymän välillä Komentojen vaikutuksen näkee heti Virheiden korjaus on helppoa vai: What you See Is All You Get WYSIWYGin heikkouksia Ei erota dokumentin loogista rakennetta sen ulkoasusta 22 Dokumentin sisältö vs. rakenne Suorakäytön ongelmia Luonti ja muokkaus teksturissa mukana tekstin sisällön lisäksi: - looginen rakenne (luvut, ) - muotoilukomentoja - ristiviittaukset sisällön perusteella Valmis sivu tekstin ja komentojen prosessoinnin jälkeen: - muutokset vaativat uuden prosessoinnin - yhtenäisten muutosten tekeminen helppoa 23 Suorakäyttöiset liittymät soveltuvat huonosti monta kertaa toistettaviin operaatioihin Suurten ryhmien valinnassa osoittaminen ei ole kätevä tapa Vrt. jokerimerkki, *.txt Suorakäyttöiset järjestelmät perustuvat käyttäjän tunteman maailman visualisointiin Voi rajoittaa uusien käyttömahdollisuuksien keksimistä Toteutus on vaativaa Hiiren käyttäminen vaatii käyttäjiltä joskus liikaa tarkkuutta Mikä on hiiren kursorin tartuntapiste, ns. hot spot? 24 Saila.Ovaska@uta.fi 4
Tehtävänä kohteiden tasaus (alignment) Kahden kohteen tasaus keskiakselin suhteen piirrosohjelmassa: SUORAKÄYTTÖISEN TYÖKALUN SUUNNITTELU 25 Kappaleiden tasaukseen on tarjolla erilaisia tapoja (kohteiden raahaus: työlästä ja epätarkkaa) Valikko Dialogi Paletti Snapping, kohdistusapujen käyttö tasaukseen Suorakäyttöinen puikkotyökalu 26 Tasaus valikkokomennon avulla Tasaus dialogin avulla Windows Draw MacDrawPro 27 28 Tasaus paletin avulla Tasaus kohdistusapujen avulla ClarisDraw Snapping Kohteiden kohdistus joko ruudukkoon tai toisiinsa käyttäen apuna magnetismia Magneettinen kohta imaisee puoleensa Kohdan lähellä vetovoima on niin suuri ettei kohteita voi laittaa ihan viereen http://patrickbaudisch.com/projects/snapandgo/ 29 30 Saila.Ovaska@uta.fi 5
Esimerkki: Microsoft PowerPoint Mistä tasaustoiminnot löytyvät? valikosta tai paletista Snap-to-grid toiminnallisuus Tasaus Snap-and-Go -tekniikalla kohdistusapujen käytössä kohdistus on asetettava erikseen päälle ja pois päältä jos se on päällä, käyttäjä voi olla ymmällään, miksi kohteet pudotettaessa hyppivät (warp) Snap-and-Go idea (Baudisch) Kohde voidaan asettaa myös lähelle tasauskohtaa Tasaus kohdistuskohtaan hieman hitaampaa kuin perinteisellä tavalla, mutta Snap-and-Go tuo lisää vapautta ja yksinkertaistaa käyttöä Office 2007 versiosta (valintanauhasta) lähtien ei ole irtirevittäviä valikoita 31 Lähteenä: Baudisch, Snap-and-go: Helping Users Align Objects Without the Modality of Traditional Snapping. CHI 2005. http://patrickbaudisch.com/projects/snapandgo/ 32 Tasaus puikkotyökalulla Luonnollisin tasaustapa? luonnollisin tasausväline Suorakäyttöinen työkalu Taustalla viivainmetafora Kohteita ei tarvitse valita (?) Kaksikätinen vuorovaikutus (hiiri + ohjauspallo) Vertailussa paletti, valikko ja puikko 22 testihenkilöä 100 % 80 % 60 % 40 % 20 % 0 % 3 5 9 10 7 14 10 6 2 I valinta II valinta III valinta puikko valikko paletti Roope Raisamo and Kari-Jouko Räihä, Design and evaluation of the alignment stick. Interacting with Computers 12 (2000), 483-506. 33 34 Ratkaisu eri tehtävissä musta pylväs: keskimääräinen suoritusaika ylempi käyrä: testihenkilöiden tekemät toiminnot alempi käyrä: optimisuoritus SUORAKÄYTÖN SUUNNITTELUN HAASTEITA JA MALLEJA 35 36 Saila.Ovaska@uta.fi 6
Suorakäytölläkin on syntaksi Myös suoravaikutteisella keskustelulla on syntaksi Tavallisimpia syntakseja: Kohde Työkalu Työkalu Kohde Työkalu Kohde (Veto) Kohde (Kaksoisklikkaus) Ongelmana työkalujen käytössä: monien erilaisten syntaksien sekoittaminen Käyttäjän voi olla vaikea ymmärtää perusteita toiminnalle, jos tulee ongelmatilanne Raahaus kansiossa (kansiota vierittäen) vai ulos kansiosta? Suoravaikutteisen käyttöliittymän suunnittelun haasteita Ikoniperustaisissa liittymissä suunniteltava Kuvakkeet Kohteen mahdollisuuksien (affordance) esittäminen käyttäjälle: tartuttavuus, kahvat, mahdollinen paikka raahattavana olevan kohteen pudottamiselle, Hiiren kursoriin liitettävät kuvakkeet toiminnon eri vaiheissa ja niiden avulla annettava palaute Vrt. kuvakkeet-kalvosetissä ollut esimerkki kalustusohjelman suunnittelusta: ensimmäinen idea työkalupalkin käytöstä ratkaisuna ei ollut toimiva paremmin toimi suorakäyttöinen ratkaisu, jossa liitettiin kohteeseen kahvoja kun kohde aktivoitiin kahvan muoto vinkkinä siitä, mitä sen avulla tehdään Sopivien syötelaitteiden käyttö Montako nappia hiiressä pitäisi olla? Vai tarvitaanko hiirtä... Miten saada molemmat kädet käyttöön? 37 38 Design Patterns Suunnitteluohjeita suorakäyttöön (Tidwell 1/2) Käyttöliittymän suunnittelumallit (UI Design Patterns) kokoavat hyviä suunnitteluideoita eri käyttöliittymistä Design Pattern idea alunperin peräisin arkkitehtuurin piiristä Malleillakin hierarkkinen suhde: Kaupunki Lähiö Asuintalo Keittiö Istuin Alexander, C., Ishikawa, S., Silverstein, M., Jacobson, M., Fiksdahl-King, I. & Angel, S. (1977), A Pattern Language, Oxford University Press, New York. esim. Welie: Interaction Design Pattern Library http://www.welie.com/patterns/ http://www.welie.com/papers/welie-interact2003.pdf Jotkut suunnittelumallit liittyvät suorakäytön suunnitteluun seuraavien mallien lähde: UI Patterns and Techniques by Jenifer Tidwell http://designinginterfaces.com/ UI Patterns and Techniques, Jenifer Tidwell Edit-in-Place Smart Selection Edit-in-place Smart selection 39 Lähde: http://designinginterfaces.com/ 40 Suunnitteluohjeita suorakäyttöön (Tidwell 2/2) Muitakin suunnittelumalleja on UI Patterns and Techniques, Jenifer Tidwell Edit-in-Place Smart Selection One-off Mode When a mode is turned on, perform the operation once. Then switch back automatically into the default or previous mode. Constrained Resize Supply resize modes with different behavior, such as preserving aspect ratio, for use under special circumstances. Yahoo! Developer Network Design Pattern Library Verkkosivujen suunnittelu suoravaikutteisiksi Esimerkiksi kategoria Drag and drop : http://designinginterfaces.com/ 41 http://developer.yahoo.com/ypatterns/richinteraction/dragdrop/index.html 42 Saila.Ovaska@uta.fi 7
Kuinka suoraa on suorakäyttö? Työskentely WIMP-liittymän kanssa: Valitse kohde napsauttamalla sitä hiirellä Valitse komento valikosta tai näppäimistöltä Täytä viestiruudun kentät ja Paina OK-painiketta jotta näet lopputuloksen Mikä tässä on välitöntä, suorakäyttöistä vaikuttamista kohteeseen? SUORAKÄYTTÖ WIMP-KÄYTTÖLIITTYMÄSSÄ? Ei mikään! Tällainen työtapa ei ole suorakäsittelyä VAAN vastaa työskentelyä komentokielellä! 43 Michel Beaudouin-Lafon, Instrumental Interaction: An Interaction Model for Designing Post-WlMP User Interfaces. CHI 2000, 446-453. 44 Kuinka suoraa on suorakäyttö? Kuinka suoraa on suorakäyttö? Suorakäyttöisessä liittymässä kohteiden tulisi olla suoraan näkyvissä Kohteet ovat saavutettavissa jossakin jotenkin Ikkunan vieritys vierityspalkin avulla (scrolling) Zoomaus kuvaan sisälle ja ulospäin (zooming) Näkymän vieritys, panorointi sivu- ja pystysuunnassa (panning) Käyttöliittymän paisuminen Tarvittavien kohteiden löytyminen on vaikeutunut toimintopalettien, kuvakekokoelmien ja valikkopalkkien suuren joukon vuoksi On tullut käyttöön joukko uusia kohteita, joista käyttäjän tarvitsee huolehtia Esimerkiksi erilliset tyylimäärittelyt tekstinkäsittelyyn Toiminto toteutetaan usein vasta sitten kun käyttäjä on jo sulkenut dialogiruudun On hankalaa esim. asetella tekstiä sivulle jos tekstin fonttikokoa ei voi muuttaa kuin dialogiruudussa Hiukan välittömämpi tapa: property box työkalupalkissa Dialogiruutu Vs. työkalupalkki 45 46 Suorakäyttöisyyden tavoite Suoravaikutteisuusmatriisi Spatiaalisen siirtymän tarve Jotkut toiminnot liittyvät tiettyyn paikkaan ikkunassa (esimerkiksi vierityspalkki) Toiminto on joskus kaukana kohteesta Vaatii tilaa ruudulta! Temporaalisen siirtymän tarve Jotkut toiminnot alkavat toimintopainikkeen painamisesta ja loppuvat tehtävän tultua valmiiksi (esimerkiksi suorakaiteen piirto) Tällaista tilaa on kutsuttu moodiksi Epäsuora aktivointitapa (tarve osoittaa jotain painiketta jossain kaukana) tekee toiminnon suorittamisesta hitaan Joskus toiminto voidaan lisätä oheislaitteeseen, esimerkiksi vieritys hiiren keskinapilla nopeuttaa 47 Temporaalinen siirtymä raahaa ja pudota kahvat vierityspalkit Michel Beaudouin-Lafon, Instrumental Interaction: An Interaction Model for Designing Post-WlMP User Interfaces. CHI 2000, 446-453. dialogiruudut property box Spatiaalinen siirtymä 48 Saila.Ovaska@uta.fi 8
Suorakäytön tehostamistavoite TAVOITTEENA SPATIAALISEN JA TEMPORAALISEN SIIRTYMÄN MINIMOINTI Miten työskentelyyn saataisiin käyttäjän kumpikin käsi mukaan? Esimerkki 1: tasauspuikko - ohjauspallolla skaalattiin puikkoa ja muutettiin sen kaltevuutta, hiirellä liikutettiin sitä Esimerkki 2: taikalinssit ja työkalupaletit työkalu siirretään toisella kädellä lähelle työskentelykohdetta ja työkalulasin läpi voidaan klikata See-Through interface Miten näytön ja hiiren asettamista rajoitteista päästään eroon? Ensi luennolla esimerkkejä pöytäpinnalle siirrettävästä tietojenkäsittelystä (virtuaalityöpöydät) 49 50 Työkalulasi ja taikalinssit Työkalut samoja eri sovelluksissa esimerkki liittymästä, jossa spatiaalinen ja temporaalinen siirtymä on minimoitu kohdetta käsitellään työkalulasin läpi suoraan kaksikätistä työskentelyä (työkalulasia liikutetaan esimerkiksi ohjauspallon avulla, valinta hiirellä) taikalinssi näyttää kohteen erilaisena, työkalun avulla sitä voidaan muokata Läpinäkyvät linssit ja työkalut eri tilanteisiin Työkalut pysyvät samoina eri sovelluksissa Linssit toimivat suodattimina Työkaluja esimerkiksi tekstin muokkaukseen työkalulasin (tai -paletin) perusidea: hiiren kursori työkalupaletti Demo http://www2.parc.com/istl/projects/magiclenses/simpledemo.html Video http://www.open-video.org/details.php?videoid=4563 sovellusohjelma 51 Bier, Stone, Fishkin, Buxton & Baudel, A Taxonomy of See-Through Tools. Proc. CHI'94, 358-364. Bier, Stone, Pier, Buxton & DeRose, Toolglass and Magic Lenses: The See-Through Interface. Proc. ACM SIGGRAPH Conference 1994, 73-80. 52 Vertailututkimus Vertailututkimus Tutkimusasetelma: Tehtävänä yhdistää pisteet värillisillä viivoilla Piste kerrallaan paljastettiin Pisteen väri kertoi sen, millä värillä viiva piti vetää Neljä väriä: red, green, yellow, blue Vertailtavat käyttöliittymät Left-Tearoff Menu: samanlainen paletti, kaksi hiirtä ja kaksi kursoria vasen hiiri: värin valinta oikea hiiri: piirtäminen, paletin siirtäminen Käytössä liikuteltava väripaletti (kuvassa) Kuvan tekstit eivät olleet osa koeasetelmaa Perusversio käyttöliittymästä: Right-Tearoff Menu kelluva paletti, hiiri oikeassa kädessä, vain 1 käsi käytössä Palette Menu: palettia siirrettiin vasemmalla kädellä (ei erillistä hiiren kursoria), värin valinta tehtiin oikealla kädellä jossa normaali hiiri Toolglass Menu: läpinäkyvä paletti, jonka läpi voi aloittaa viivanpiirron 2 kättä, luonnolliset käsien tehtävät? Paul Kabbash, William Buxton, and Abigail Sellen, Two-handed Input in a Compound Task. Proc. CHI'94, 417-423. Paul Kabbash, William Buxton, and Abigail Sellen, Two-handed Input in a Compound Task. Proc. CHI'94, 417-423. ACM DOI. 53 54 Saila.Ovaska@uta.fi 9
Vertailututkimuksen havaintoja Kursoriin liittyviä kehitysideoita R-tearoff L-tearoff Palette Wait times 0.231.489.207 Left hand use 2.90 Toolglass.037 83% 2.43 Huomionarvoista Toolglass-vaihtoehdossa vasen käsi käytössä 83% ajasta, muissa alle 50% Left-Tearoff Menu kaikkein hitain: kognitiivinen kuorma kasvaa eri käsille ei pitäisi antaa toisistaan riippumattomia tehtäviä kaksi kättä voi olla hitaampi kuin yksi käsi, jos ohjaustapa on huonosti suunniteltu Paul Kabbash, William Buxton, and Abigail Sellen, Two-handed Input in a Compound Task. Proc. CHI'94, 417-423. ACM DOI. NA 49% 47% Total time 2.89 2.96 55 Työkalulasit ja taikalinssit toimivat hyvin tilanteissa, joissa on kaksi syötelaitetta toinen työkalun siirtämiseen ja toinen työskentelyyn Seuraavissa ideoissa muutetaan kursoria niin että sillä valitsisi helpommin: Bubble Cursor niin että siirtyminen toiminnosta toiseen onnistuisi pelkän kursorin avulla: Pie Cursor (2008) 56 Kursorin aktiivinen alue (hot spot) Kuplakursori eli Bubble cursor Kursorin aktiivinen alue viestitään visuaalisesti käyttäjälle Nuoli, ristikko, ympyrä, Minkä kokoinen aktiivisen alueen tulisi olla? Tavallisessa kursorissa (point cursor) aktiivinen alue on yksi piste Aluekursorissa tietyn kokoinen ja muotoinen alue kursorin aktiivisen alueen kasvattaminen helpottaa vaadittavaa motorista suoritusta Ongelmana: Ison kursorin alle mahtuu monta kohdetta mikä niistä tulee valituksi? 57 Bubble cursor on aluekursori, jonka koko riippuu ympäröivien kohteiden läheisyydestä Alueelle osuu aina vain yksi kohde (kursorin keskustaa lähinnä oleva kohde) Kursori muuttaa tarvittaessa muotoaan Suoriutuminen osoitustehtävässä nopeampaa kuin tavallisella kursorilla http://www.youtube.com/watch?v=jubxkd_8zeq Grossman & Balakrishnan (2005). The bubble cursor: Enhancing target aquisition by dynamic resizing of the cursors activation area. Proc. of CHI 05. 58 Valikko aina lähellä kursoria Tracking Menu FItzmaurice et al., Tracking Menus. Proc. UIST 2003. ACM DOI. http://www.youtube.com/watch?v=nrif2gz2g_0&nr=1 PieCursor Fitzmaurice et al., PieCursor: merging pointing and command selection for rapid in-place tool switching. Proc. CHI2008. ACM DOI. http://www.youtube.com/watch?v=saiknailcsw TAKAISIN SUORAKÄYTÖN MÄÄRITELMÄÄN TAVOITTEENA SUORAKÄYTÖN TUNTU 59 60 Saila.Ovaska@uta.fi 10
Suorakäytön määritelmä siis? Normanin määritelmä suorakäytölle Shneiderman: visuaalisuus kohteiden suora manipulointi vähän kerrallaan toteutettavat toiminnot Beaudouin Lafon: minimoi temporaalinen ja spatiaalinen siirtymä; suorakäyttöön ei kuulu dialogiruutuja Norman: suorakäyttöisyys kuormittaa käyttäjän kognitiivista kapasiteettia vähän ( tuntuu suoralta) Suorakäyttöisessä järjestelmässä on oltava Lyhyt etäisyys (short distance): prosessin, joka muodostaa tehdyn päätöksen perusteella tarvittavat toimenpiteet, tulee kuormittaa kognitiivisia resursseja mahdollisimman vähän Osallistumisen tuntu (direct engagement): käyttäjän täytyy tuntea käsittelevänsä suoraan kohteen objekteja Taustalla Normanin Action Cycle malli Vrt. JoVuoT-luennot 61 62 Havainnon tulkinta Tulkinnan arviointi Tuloksen havainnointi Osallistumisen tuntu Tavoite Aikomus Toimenpiteen määrittely Suoritus Lyhyt etäisyys Normanin mukaan Suoravaikutteisuuden tunteeseen vaikuttaa Oppiminen Aloittelija vai kokenut Tehtävä Kokeneellekin voi tulla vastaan uusia tehtäviä Suoravaikutteisen käyttöliittymän tulee olla näkymätön! Lähde: Norman, 1990 63 64 Suorakäytön määritelmä: Yhteenveto Suorakäyttö: yhteenveto Shneiderman Visuaalisuus Kohteiden suora manipulointi Vähän kerrallaan toteutettavat toiminnot Beaudouin Lafon Minimoi temporaalinen ja spatiaalinen siirtymä; suorakäyttöön ei kuulu dialogiruutuja Norman Suorakäyttöisyys kuormittaa käyttäjän kognitiivista kapasiteettia vähän ( tuntuu suoralta) Käyttäjälle suoravaikutteisuuden tuntu tärkeää Luonteva (ja johdonmukainen) vuorovaikutuksen syntaksi Visuaalinen palaute Välitön palaute antaa käyttäjälle vaikutelman suoravaikutteisesta toiminnasta ja oman toiminnan seurausten välittömästä näkymisestä ruudulla Kaksikätisyys tavoitteena Vertauskuvien suunnittelu ja valinta Reaalimaailma vs. tietokoneen mahdollisuudet Mitä työpöytämetaforan jälkeen? 65 66 Saila.Ovaska@uta.fi 11