1. No category

Informaation visualisoinnin laadukkuustekijät
Hypermedian jatko-opintoseminaari
Informaation visualisointi
3.5.2013
Jukka Paukkeri
TTY/IISLab
1
Visualisoinnin laadukkuuden arviointi sidottuna
visualisointiprosessin referenssimalliin
(mukautettu Card et al., 1999.)
2
Informaation visualisoinnin laadukkuustekijät
●
Havainnointi
●
Merkityksellistäminen
●
Käytettävyys
●
Saavutettavuus
3
Havainnointi
(1/3)
●
●
●
●
●
Visualisoinnin elementeillä on yhdistelmä piirteitä,
visuaalisia vihjeitä, joilla kuvataan kohteen
ominaisuuksia ja jotka yhdessä antavat elementille
merkityksen.
Samanlaisia visuaalisia vihjeitä sisältävien
elementtien nähdään liittyvän jotenkin yhteen,
erilaisten vihjeiden nähdään erottavan ne
toisistaan.
Jokaisen elementin piirteen on kuvattava jotakin
kohteensa ominaisuutta ja lisätyn koristeellisuuden,
esitetyn datan näkökulmasta täytedatan,
asiayhteyttä (vrt. Angeli et al., 2006; Tufte, 2001;
van Wijk, 2005).
(Mackinlay, 1986.)
Ihminen havaitsee ensin tietyt visuaaliset vihjeet
(kts. kuva).
Mitä merkittävämpi kuvattava ominaisuus on, sitä
tehokkaampaa visuaalista vihjettä tulee käyttää.
4
Havainnointi
(2/3)
●
Jos arvojoukko on ennustamaton tai sen hajonta hyvin suuri, usein
joko arvojoukkoa tai koordinaatistoa on tarkoituksenmukaista
käsittellä ennen arvojen visuaalista kuvaamista.
–
Suhteellinen ero on esitettävissä esimerkiksi logaritmisella
asteikolla tai neliöjuurikuvauksella.
–
Yleensä kannattaa käsitellä mieluummin elementtiä kuin
koordinaatistoa, koska suhteellinen koordinaatisto voi
hämmentää käyttäjää.
–
Asioiden suhteellinen ero on esitettävissä selkeästi ilman, että
esimerkiksi suurimmat arvot näkyvät liian suurina tai pienimmät
eivät näy ollenkaan.
–
Alkuperäinen lukuarvo täytyy olla saatavissa.
Alkuperäinen kokoero
Epälineaarinen kokoero
(neliöjuurikuvaus)
5
Havainnointi
(3/3)
●
●
●
●
●
●
Väreillä on kromaattinen (kylläisyys) ja luminaattinen (valotiheys) ominaisuus, jotka havaitaan toisistaan
erillään.
Pelkkää kromaattista eroa ei tulisi koskaan käyttää esitettäessä kohteen muotoa, liikettä tai
lisäinformaatiota, kuten tekstiä.
Värikoodauksella esitetyn informaation valotiheyden tulee olla hyvin suuri, etenkin pienissä kohteissa.
Valkoinen tai musta reunus värillisessä elementissä erottaa sen valotiheyden kontrastin ansiosta
paremmin muista ympäröivistä väreistä.
Ihminen havaitsee värien kontrastieron nopeasti, mutta visuaalinen havaintojärjestelmä tunnistaa vain
kontrastin suhteellisen eron.
Koska väristä havaitaan suhteellinen ero, sillä on tehokasta kuvata järjestystä, esimerkiksi
valotiheydellä veden syvyyttä kartalla.
(Ware, 2004)
6
Informaation visualisoinnin laadukkuustekijät
●
Havainnointi
●
Merkityksellistäminen
●
Käytettävyys
●
Saavutettavuus
7
Merkityksellistäminen
(1/5)
●
●
●
●
Ihmisen ajattelu perustuu asiayhteyksien verkostoon, josta poimittuun asiaan liitetään siihen sidoksissa
olevat muut asiat (Hornbæk & Frøkjær, 2002).
Mielikuva havainnoista muodostetaan yhdistämällä ja jäsentämällä ne aiemmin opittuun sekä
tiivistämällä ja pelkistämällä asiat ymmärrettävämpään muotoon.
Sekä havainnoinnilla että havaintojen merkityksellistämisellä on kulttuurisia eroja
–
Aasialaiset silmäilevät suhteellisen kauan kokonaisuutta, länsimaalaiset siirtyvät pian yksityiskohtiin
(esim. Dong & Lee, 2008).
–
Väreillä on suuria tunnepohjaisia ja asianyhteyteen liittyviä eroja kulttuurien välillä (esim. Aslam,
2005; Cooper et al., 2007, s. 291).
Erityisesti värisuunnittelussa on huomioitava kohderyhmä ja asiayhteys:
–
Aasiassa valkoinen yhdistetään kuolemaan ja musta kalleuteen (Aslam, 2006).
–
Yhdysvalloissa kirjanpitäjä yhdistää punaisen värin negatiiviseen ja mustan positiiviseen ja
arvopaperikauppiasta sininen väri kehottaa ostamaan ja punainen myymään (Cooper et al., 2007,
s. 291).
8
Merkityksellistäminen
(2/5)
●
●
●
●
Ihminen täydentää aiempaa tietämystään havaintojensa perusteella yhdistämällä uudet asiat aiemmin
opittuun ja tarkkailemalla ja korjaamalla vääriä käsityksiään (Hullman et al., 2011).
Lisäämällä dataohjautuvaa tiedostamatonta ajattelua ja rakenteen paljastavaa vuorovaikutusta voidaan
lisätä visualisoinnin ymmärrettävyyttä (Berg, 2012).
Ajatusprosessin vaiheiden määrää voidaan minimoida tukemalla rakentavaa, itseohjautuvaa ajattelua
(Hullman et al., 2011).
–
Suunnitteluratkaisuilla käyttäjää voidaan ohjata asettamaan oikeanlaisia kysymyksiä ja oletuksia
sekä innostaa luontaiseen visualisoinnin tutkimiseen.
–
Sopiva ympäristö rohkaisee käyttäjää hyödyntämään aiempaa tietämystään ja tarkkailemaan ja
testaamaan oletuksiaan.
Itseohjautuvaa ajattelua voidaan tukea
–
johdonmukaisuudella (tuttuus, muistettavuus)
–
kielikuvilla (merkityksen siirtäminen tunnetusta tuntemattomaan)
–
vuorovaikutteisuudella (käyttäjän osatavoitteet, kognitiivisen kuormituksen vähentäminen)
9
Merkityksellistäminen
(3/5)
●
Jotta asioiden merkitys olisi ymmärrettävissä, opittavissa ja muistettavissa, niitä tulee kuvata tutusti ja
johdonmukaisesti:
–
sijoittelu
–
ryhmittely
–
hahmolait (väri, muoto, koko, sijainti...)
10
Merkityksellistäminen
(4/5)
●
●
●
●
●
●
●
Vaikka usein viitatut teoriat korostavat toisteisen tiedon ja taulukkoroskan välttämisen tärkeyttä, useat
viimeaikaiset tutkimukset todistavat tarkoituksenmukaisen koristeellisuuden auttavan oivaltamisessa ja
asioiden palauttamisessa mieleen (Hullman et al., 2011).
Positiivinen mielentila nopeuttaa aivojen välittäjäaineen dopamiinin liikettä, jolloin ajatteluprosessi
tehostuu ja muuttuu joustavaksi (Ashby et al., 1999).
Norman (2004) päättelee tästä kauniiden tuotteiden auttavan luovassa ajattelussa, oppimisessa ja
ongelmanratkaisussa ja edelleen parantavan tehtävien suoritusta.
Tarkoituksenmukainen ja huolellinen koristelu edistää esteettistä kokemusta ja asiayhteyden
ymmärtämistä (esim. Tractinsky, 2000; Bateman, 2010).
Koristeellisuudella saadaan käyttäjä ymmärtämään asiayhteys, mutta käytettävyys ja informaation laatu
heikkenee (Angeli et al., 2006).
Käyttöliittymässä on hyödyllistä käyttää vertauskuvaa sellaisen löydettäessä, mutta käyttöliittymää ei
saa sovittaa mielivaltaisesti valittuun vertauskuvaan (Cooper et al., 2007, s. 279).
Vertauskuva on hyödyllinen käyttäjien ollessa lapsia, vanhemmille ihmisille selkeä käyttöliittymä on
käytettävämpi (Angeli et al., 2006).
11
Merkityksellistäminen
(5/5)
●
Koristeellisuus voi aiheutua laatuongelman, jos koristeellisuutta ei ole lisätty datan ymmärtämisen
tarkoituksessa. (vrt. Angeli et al., 2006; Tufte, 2001)
–
●
Kaiken lisätyn koristeellisuuden pitäisi olla tarkoitettu helpottamaan datan ymmärtämistä
kuvaamalla datan kohdealuetta, asiayhteyttä.
Lisätty koristeellisuus voi aiheuttaa myös luotettavuusongelma, jos koristeellisuus vääristää dataa
kuvaavia visuaalisia vihjeitä. (vrt. Tufte, 2001; Ware, 2004)
–
Koristeellisuus voi aiheuttaa sekä mittasuhteiden vääristymistä että havaitsemishäiriöitä.
12
Informaation visualisoinnin laadukkuustekijät
●
Havainnointi
●
Merkityksellistäminen
●
Käytettävyys
●
Saavutettavuus
13
Käytettävyys
(1/5)
●
●
Suunnittele keskivertokäyttäjälle ja tarjoa ohjeet aloittelijalle ja tehokkaat oikopolut kokeneelle käyttäjälle
(vrt. Cooper et al., 2007, s. 569; Hullman et al., 2011).
Visuaalinen informaatio tulisi olla ymmärrettävissä puutteellisilla tiedoilla ja olisi esitettävä myös
vaihtoehtoisella tavalla (vrt. Hornbæk & Frøkjær, 2002).
–
Visuaalisen vihjeen tulkinnan oikeellisuus tulisi olla tarkistettavissa lähtöarvoista (Heer &
Shneiderman, 2012).
–
Vaihtoehtoisella esitystavalla voidaan lisätä todennäköisyyttä, että käyttäjä hyödyntää oikeaa
aiempaa tietämystään (Hullman et al., 2011).
14
Käytettävyys
(2/5)
●
●
●
●
●
●
Käyttäjä muodostaa ymmärrystään visualisointijärjestelmästä silmäilyn lisäksi osoittamalla esityksen
elementtejä ja käyttämällä järjestelmän toimintoja (vrt. Berg, 2012; Burmester et al., 2010; Heer &
Shneiderman 2012).
Vuorovaikutteisuutta lisäämällä voidaan estää kognitiivista kuormitusta (Hullman et al., 2011).
Vuorovaikutteisuuden suunnittelu ei saa perustua arveluihin, sen sijaan käyttäjän tavoitteisiin pohjautuva
vuorovaikutteisuus kuvastaa luotettavammin käyttäjän käsitemallia (Cooper et al., 2007, s. 569).
Shneiderman (1996) on esittänyt käyttäjän osatavoitteita kuvaavan haun mantran: yleisnäkymä, zoomaus,
suodatus ja lisäinformaatio.
Osatavoitteet toistuvat samassa järjestyksessä käyttäjän tutustuessa uuteen visualisointiin, joten voidaan
–
sitoa osatehtävässä vaadittu ymmärrys aiemmista vaiheista hankittuun ymmärrykseen
–
esittää vain se informaatio, jota käyttäjä voi kyseisellä hetkellä tarvita
Osatavoitteiden tehokasta suoritusta voidaan tukea informatiivista kuormitusta ehkäisevillä toimenpiteillä (vrt.
McShane, 2008, s. 324; Shneiderman, 1996): suodatuksella, osittamisella ja tiivistämisellä.
–
Informatiivisen kuormituksen vähentäminen nopeuttaa tulkintojen ja estää väärintulkintoja.
15
Käytettävyys
(3/5)
●
●
●
●
●
Osatehtävien välillä vaarana on keskittymiskyvyn häiriintyminen (vrt. Shneiderman, 1996; Shneiderman
& Bederson, 2005).
Keskeytykset voivat poistaa tietoa lyhytaikaisesta muistista, jolloin käyttäjä joutuu palauttamaan asiat
muistiin ennen tehtävän jatkamista.
Keskittymiskyvyn häiriintymistä voidaan estää kolmella toimintamallilla:
–
Lyhytaikaisen ja työmuistin kuorman vähentäminen
–
Informatiivisen käyttöliittymän tarjoaminen
–
Automaation lisääminen
Vähentämällä muistin kuormitusta tehokkaalla näkymäsuunnittelulla käyttäjälle voidaan tarjota nopeasti
päätöksentekoon tarvittava informaatio.
Johdonmukaiset elementtien sijoittelut, ryhmittelyt, värit, nimeämiset ja peräkkäiset toiminnot
nopeuttavat päätöksiä ja estävät häiriötekijöiden vaikutusta.
(Shneiderman ja Bederson, 2005)
16
Käytettävyys
(4/5)
●
●
Jos käyttäjä on sidottavissa läheisesti visualisointiin, yleisnäkymän esittämisen sijasta
tarkoituksenmukaisempaa voi olla esittää ensin vain käyttäjään itseensä liittyvät asiat ja niiden yhteydet
ja vasta pyydettäessä yleisnäkymä datasta (Van Ham & Perer, 2009).
–
Vaikka visualisoinnin merkitys olisi jo tuttu käyttäjälle, yleensä käyttäjä on ensisijaisesti kiinnostunut
itseensä liittyvistä asioista.
–
Läheisen suhteen muodostuttua visualisoinnin datan osajoukkoon ymmärrys on laajennettavissa
kokonaisuuteen.
Jos aluksi esitetään vain datan osajoukko ja vasta pyydettäessa haetaan loput datasta yleisnäkymään,
käyttökokemus paranee laskenta-ajan lyhetessä.
17
Käytettävyys
(5/5)
●
●
●
●
●
Visualisointijärjestelmän käyttäjän tulisi olla aina selvillä toimintansa syy-seuraus -suhteista (esim. Nakakoji et al.,
2001).
Animaatiolla on neljä vahvuutta (Heer & Robertson, 2007):
–
Kiinnittää tehokkaasti käyttäjän huomion myös havainnoinnin reuna-alueella
–
Kuvaa alkutilan ja lopputilan yhteyttä
–
Kuvaa syy-seuraus -suhdetta
–
Voi olla lumoava ja lisätä kiinnostusta esitykseen
Visualisoinnin muutosta tilasta toiseen voidaan esittää animaatiolla (esim. Heer & Robertson, 2007; Shneiderman,
1996), mikä ei pelkästään helpota tilojen muutoksen vaan myös koko datajoukon ymmärtämistä.
Koska ihminen havaitsee animaation myös näkökentän ääreisalueella (Heer & Robertson, 2007), animaatiolla voi
tehokkaasti siirtää katsojan huomion merkittävään muutokseen.
Sulavalla animaatiolla on esteettisesti miellyttäviä piirteitä, mikä osaltaan voi johtaa luovaan ajatteluun ja edelleen
visualisoinnin kokonaisvaltaiseen ymmärtämiseen (vrt. Ashby et al., 1999; Heer & Robertson, 2007; Norman, 2004).
18
Informaation visualisoinnin laadukkuustekijät
●
Havainnointi
●
Merkityksellistäminen
●
Käytettävyys
●
Saavutettavuus
19
Saavutettavuus
(1/1)
●
●
●
Visualisointijärjestelmää voi käyttää hyvin erilaiset yksilöt erilaisissa ympäristöissä ja erilaisilla
päätelaitteilla.
Laadukkaan visualisoinnin tekniikka on dynaamista ja tuettua useimmissa yleisimmistä päätelaitteista.
–
Laadukkaita tekniikoita ovat esimerkiksi Javascript ja standardisoidut svg-grafiikka ja css.
–
Heikkouksia on havaittu Flashissa, etenkin sen tukemisessa mobiililaitteissa.
Jotta värisiirtymät olisivat toistettavissa mahdollisimman samalla tavalla eri päätelaitteissa, valotiheyden
kontrastieron tulee olla mahdollisimman suuri ja eri värikylläisyyksiä ja -sävyjä tulisi olla mahdollisimman
vähän (Ware, 2004, s. 138).
20
Kiitos!
21
Lähteet
●
●
●
●
Ashby, F. G., Isen, A.M. & Turken, A.U. (1999). A neuropsychological theory ofpositive affect and its influence on cognition. Psychological Review, 106,
529-550.
Aslam, M. (2005). Are You Selling the Right Colour? A Cross-Cultural Review of Colour as a Marketing Cue. In I. Papasolomou (Eds.), Developments
and Trends in Corporate and Marketing Communications: Plotting the Mindscape of the 21st Century: Proceedings of the 10th International
Conference on Corporate and Marketing Communications, pp. 1-14. Cyprus: InterCollege, Marketing Department, School of Business Administration.
Bateman, S., Mandryk R.L., Gutwin, C., Genest, A., McDine, D. & Brooks, C. (2010). Useful Junk? The Effects of Visual Embellishment on
Comprehension and Memorability of Charts. Saatavissa: http://hci.usask.ca/publications/view.php?id=173
Berg, M. (2012) Human abilities to perceive, understand, and manage multidimensional information with visualizations. Doctoral Dissertations 30/2012.
Helsinki: Aalto University publication series. Saatavissa: http://lib.tkk.fi/Diss/2012/isbn9789526045498/isbn9789526045498.pdf
●
Card, S. K., Mackinlay, J. D. & Shneiderman, B. (1999). Readings in Information Visualization: Using Vision to Think. Academic Press, San Diego, CA.
●
Cooper, A., Reimann, R. & Cronin, D. (2007). About Face 3: Essentials of Interaction Design. Indianapolis: Wiley Publishing.
●
●
●
Heer, J & Robertson, G. (2007) Transitions in Statistical Data Graphics. IEEE Trans. Visualization & Comp. Graphics (Proc. InfoVis), 13(6), 1240–
1247. Saatavissa: http://vis.stanford.edu/papers/animated-transitions
Hornbæk, K. & Frøkjær, E. (2002). Evaluating user interfaces with metaphors of human thinking. Universal Access Theoretical Perspectives, Practice,
and Experience Lecture Notes in Computer Science, 2615, pp 486-507. Saatavissa: http://link.springer.com/chapter/10.1007%2F3-540-36572-9_38
Dong, Y. & Lee, K-M. 2008. A Cross-Cultural Comparative Study of Users' Perceptions of a Webpage: With a Focus on the Cognitive Styles of
Chinese, Koreans and Americans. Industrial Design Department, KAIST, Daejeon, Korea. IJDesign, 2:2. Verkkosivu. Saatavissa (viitattu 17.4.2013):
http://www.ijdesign.org/ojs/index.php/IJDesign/article/view/267/163
22
●
●
●
●
●
●
●
●
●
●
●
Hullman, J., Adar, E. & Shah, P. (2011). Benefitting InfoVis with Visual Difficulties . Visualization and Computer Graphics, IEEE Transactions on.
Saatavissa (rajoitettu käyttöoikeus): http://ieeexplore.ieee.org/xpls/abs_all.jsp?arnumber=6064986
McShane, S & Von Glinow, M. A. (2008). Organizational Behavior. 4th Edition, McGraw-Hill.
Mackinlay, J. (1986). Automating the design of graphical presentations of relational information. Journal ACM Transactions on Graphics (TOG). 5:2.
Pages 110 – 141. Saatavissa (rajoitettu käyttöoikeus): http://dl.acm.org/citation.cfm?id=22950
Nakakoji, K, Takashima, A. & Yamamoto, Y. (2001). Cognitive effects of animated visualization in exploratory visual data analysis. Information
Visualisation, 2001. Proceedings. Fifth International Conference. oo. 77-84. Saatavissa:
http://ieeexplore.ieee.org/xpl/articleDetails.jsp?arnumber=942042
Norman, D. (2002). Emotion & Design: Emotion and design: Attractive things work better. Interactions Magazine, ix (4), 36-42. Viitattu (30.4.2013).
Saatavissa: http://www.jnd.org/dn.mss/emotion_design_at.html
Shneiderman, B. (1996). The eyes have it: a task by data type taxonomy for information visualizations. Saatavissa (rajoitettu käyttöoikeus):
http://ieeexplore.ieee.org/xpls/abs_all.jsp?arnumber=545307
Shneiderman, B. & Bederson, B.B. (2005). Maintaining concentration to achieve task completion. DUX '05 Proceedings of the 2005 conference on
Designing for User eXperience Article No. 9. Saatavissa: http://dl.acm.org/citation.cfm?id=1138246
Tractinsky, N., Katz, A.S. & Ikar, D. (2000). What is beautiful is usable. Interacting with Computers 13:127–145. Saatavissa:
http://www.sciencedirect.com/science/article/pii/S095354380000031X
Tufte, E. (2001). The Visual Display of Quantitative Information. Toinen painos. Graphics Press.
van Wijk, J.J. (2005). The Value of Visualization. Visualization, 2005. VIS 05. IEEE, pages 79–86. Conference Publications. Saatavissa (rajoitettu
käyttöoikeus): http://ieeexplore.ieee.org/xpls/abs_all.jsp?arnumber=1532781
Ware, C. (2004). Information Visualization: Perception for Design. Toinen painos. Saatavissa (rajoitettu käyttöoikeus):
http://www.sciencedirect.com/science/book/9781558608191
23