qualities of perceived aesthetic in data...
TRANSCRIPT
Qualities of Perceived Aesthetic in Data Visualization
Abstract Through results gathered from a large-scale online survey, this paper empirically investigates the assessment of aesthetic in 11 common data visualization techniques. Visualizations represented in this study were generated from an identical hierarchical dataset and visually normalized to avoid unwanted implications of default application parameters or personal preferences. Results from subjective participant response shows data visualizations that portray non-orthogonal, organic qualities, receive higher aesthetic rankings. Provided rationale further correlate these qualities with animate attributes of motion, growth and evolution, positively affecting the perception of their beauty.
Keywords Data visualization, online survey, perceived aesthetic, interfaces, user preferences
ACM Classification Keywords H5.2. [Information Interfaces]: Evaluation/methodology.
Copyright is held by the author/owner(s).
CHI 2007, April 28 – May 3, 2007, San Jose, USA
ACM 1-xxxxxxxxxxxxxxxxxx.
First Author
Nick Cawthon
University of Sydney
Sydney, Australia
Second Author
Dr. Andrew Vande Moere
University of Sydney
Sydney, Australia
2
Introduction Data visualization is commonly defined as “the use of computer-supported, interactive, visual representations of data to amplify cognition” [1]. Through abstract presentation methods, data visualization helps to reduce the mental load in which users have to undergo to understand meaningful properties within a large dataset. By presenting this data graphically, the human perceptual system augments the initial processing of information, rather than relying entirely on the viewer’s cognitive abilities. Unlike other screen-based interfaces, the display of large datasets requires special consideration for assessment, beyond the standard metrics of efficiency and effectiveness [2]. Data visualization presents unique challenges for empirical evaluation given an inherent level of abstraction. A further understanding of aesthetic needs to be addressed in order for data visualization to achieve greater appeal [2].
One can look at the antonym anesthetic to begin to derive a suitable definition for the word aesthetic. An anesthetic is used to dull or deaden, causing sleepiness and numbness. In contrast, aesthetic is seen as something that enlivens or invigorates both body and mind, awakening the senses. Previous studies have attempted to quantify aesthetic through an analytical methodology, discovering mathematical ratios and dimensions that routinely associate with perceived beauty for objects such as polygons or vases [3, 4]. Instead, this paper investigates the notion of aesthetic through pragmatic, subjective opinion – one that does
not rely on a quantitative and absolute judgment of beauty. The approach used in this investigation construes the commonalities in viewer aesthetics as being subjective – an ‘indirect consequence of the high degree of similarity between the cognitive abilities of different personas’ [4]. This is based on this belief that the notion of beauty is not a normative element. Previous research has shown, ‘an object cannot be judged in isolation, but instead must be viewed according to its socio-cultural context, or relevance and familiarity with the user, taking into account elements such as patterns previous exposure and past individual experience’ [5]. Moreover, this study is not to be seen as an online ‘beauty contest’ for different display methods, instead its’ purpose aims to better understand the aesthetic of data visualization by identifying patterns found in subjective response.
Methodology An online survey gathered data from users on their subjective responses of aesthetic beauty for 11 different data techniques (see figure 1, next page). These visualizations were chosen for diversity in display method. Factors of proportion, color palette, canvas size and positioning were normalized in order sensitize against personal user preference. From the total of 11 visualizations, randomized sets of seven were chosen for each participant, also varied in their order of display. The survey was limited to set of seven as not to overwhelm the participant’s cognitive capacity for differentiation between the techniques.
3
figure 1. Eleven different tested data visualization techniques, generated from an identical dataset and normalized by color, dimension, balance and scale. Please see Appendix for author details.
TreeMap IcicleTree SpaceTree Windows Explorer
BeamTrees StarTree
Dendogram Tree Reingold Tilfer Polar View
StepTree Botanical Viewer SunBurst
4
figure 2. Example of the scale used to gauge relative aesthetic ranking. Thumbnail representations of visualizations were dropped onto this scale, allowing clustering, variable spacing and overlap.
Visualizations were generated from a dataset that consisted of a parent/child hierarchy containing 53 total files (i.e. graphic and text files) and folders. A common palette consisting of 10 different colors were incorporated across each visualization, derived from the default colors used in the Windows Explorer folder icon. This portion of the study looks only at the representation of the technique and removes any utilized typography and interaction elements from the display’s native state, keeping this survey’s primary focus on visual design.
Individual Ranking - Using either their keyboard or mouse, participants were asked to rate their perceived visual beauty of a display using a slider interface as shown in figure 3. Along with a quantitative aesthetic ranking, reasoning as to why each visualization held beauty was queried. Following the individual ranking task, participants were asked to pause for six seconds to “reflect on the aesthetic quality of the image” as they “would with a painting or illustration”. Participants then were given instructions to conceive of a set of three single-word descriptors that transcended the obvious visual qualities of a display, ignoring reference to the use of a specific shape, color or layout. This task was repeated for each of the seven displays in the participant’s testing set.
Group Ranking - Subsequently, the online survey incorporated a group ranking of the same set of seven
data visualizations for each participant. This relational method was chosen to rank visualizations against one-another. It allowed participants to directly compare visualizations to one another within the group, and permitted for similar assessments to overlap when participants deemed different techniques as equally aesthetic. This approach recorded the clustering and commonalities between multiple visualizations.
Participants were invited to rank and group displays by dragging and dropping thumbnails on a horizontal scale (figure 2, above) based on their perceived, relative level of aesthetic quality. The extremes of this scale were labeled ‘ugly’ and ‘beautiful’, similar to the ends of the slider bar in the individual ranking method (figure 3, below). Following this task, and while perceiving their own resulting scale, participants were requested to rationalize their judgments as well as describe their reasoning behind any clusters that might have resulted. These opinions were entered through a standard text input form. Finding commonalities within this collection of subjective response text was accomplished through use of an algorithm that ascertained frequency of use for any provided keywords.
figure 3. Slider interface used to determine individual aesthetic rank. Absolute values of ugly and beautiful measured as 0 and 100, respectively.
5
Results An eight-week testing period resulted in 285 valid participants whose responses have been incorporated for the purposes of this paper. A participant’s results were omitted if they were considered as duplicate, indicated by the combination of the provided name and the recorded IP address. Participants who did not complete any one section or question within the survey, regardless of order, had their results removed. Over 50% of total survey visitors canceled their process once reaching the registration page. Subsequently, 45% of the registered survey participants were removed due to duplication, abandonment or response impropriety. Valid participants originated from 37 different countries as diverse as Peru, Nepal and Sweden. Due to selected postings amongst information architecture and design community sites, many participants were those with formal design backgrounds. However, due to the viral nature of the internet, the occupation of participants has ranged widely and participants have shown an interest in visualization from data-laden fields such as Epidemiology, Economics and Library Sciences. Approximately 2000 individual aesthetic rankings were performed as a result of this survey, generating a descriptive keyword set of 4650 valid responses.
Quantitative Aesthetic Ranking – Aesthetic ranking was scored on of 0-100 for both individual and group ranking scales. However, participants were not shown the quantitative rank, only given a spectrum between ugly and beautiful. In both the individual and group rankings, the SunBurst technique ranks highest. Additionally, SunBurst has the widest range of discrepancy between the group and the individual metric is the visualization technique, showing an 8% increase between the individual and group ranking averages. Logical groupings of displays by categorical
appearance did not necessarily occur. TreeMap and IcicleTree, similar in their orthogonal, space-filling technique, received significantly different rankings, with TreeMap continually toward the bottom of the testing set in both ranking queries. The use of three-dimensional perspective rendering did not appear to play a factor, in that for StepTree, BeamTree and Botanical Viewer, the results are widespread. Additionally, similar graph node-linking techniques of SpaceTree and PolarView did not appear as like elements in participant response. The visualization technique of PolarView performed slightly better than the similar method of StarTree, contradicting the notion in the related discipline of graph drawing and class diagrams which states that ‘edge-crossings should be avoided for optimal aesthetic’ [6]. Calculated through confidence intervals and shown in figure 4, the greatest discrepancy in opinion is associated with Botanical Viewer (±3.86%, ±4.86%) in both the individual and group ranking averages.
Slightly higher scores for the group ranking tasks are likely due to differences in the interface elements used to rate the visualizations. The slider scale (figure 3) is prone to a more absolute maximum and minimum value of ranking than the drag-and-drop interface of the group method (figure 2). In the individual ranking task, 32 absolute 0 (ugly) score rankings were assessed across the 11 visualizations, compared to none in the group rankings. This totality was seen on the high (beautiful) end of the scale as well, with 4 visualizations receiving an optimal 100 score a total of 15 times. Only two of the possible 22 absolutes being reached in the group rankings, Polar View and Botanical Viewer receiving high scores of 100.
6
figure 4. Comparison of individual (leftmost of each pair, darker) and group aesthetic (rightmost, lighter)
rankings, overlaying confidence intervals.
SunBurs
t
Icic
leTr
ee
Space
Tree
Win
. Exp
lore
r
Beam
Tre
e
Bota
nic
al Vie
wer
TreeM
ap
Sta
rTre
e
Den
dogra
m T
ree
Pola
r Vie
w
Ste
pTr
ee
80
70
60
50
40
30
20
10
0
7
Qualitative Response Well exemplified in figure 5, a sense of familiarity with abstraction method proved to be an integral part of the acceptance process. Many participants, whom had no stated background on data visualization techniques, were likely seeing these abstractions of data for the first time, the one notable exception being Windows Explorer.
figure 5. Subjective pairs of familiarity: participants stated similarities between the Borobudur temple1 and StepTree (top), vascular networks2 and Botanical Viewer (bottom).
1 http://acrossindonesia.com/Java_Photo_Gallery.htm 2 http://visualsunlimited.com/browse/vu164/vu164384.html
We construe that if the participant could attribute the visualization technique with something they recognized, it performed better. Visualizations using simple data-nodes shapes and linking connectors (e.g. StarTree, PolarView, Dendogram Tree, SpaceTree) were perhaps more decipherable in that their presentation is familiar to common graph drawing methods. However, in the case of BeamTrees, when the display looked like nothing else, minimal attachment could be made with familiar concepts (e.g. ‘it looks like…’), possibly hampering emotional investment.
Following reference to a method’s familiarity, the reference that surfaced through subjective response questioning was the resemblance of data visualizations to organic qualities. As shown through figure 6 (next page), the keyword ‘organic’ was the most commonly cited descriptor, occurring a total of 85 times out of the sample set of approximately 4650 words. The second most often used keyword being its’ derivative, ‘organized’ (62 occurrences). It should be noted, however, that these occurrences are independent of whether or not these attributes were used to identify positive or negative qualities. The prominence of keywords such as ‘confusing’ (55 occurrences) and ‘boring’ (52 occurrences) likely reflect the test process itself to some extent, as many participants took the opportunity to provide candid feedback on both the difficulty and length of the survey.
Compounding this notion, visualizations that were the most alive, organic, were more likely to suggest the actions of growth and expansion. There exists a desire for elements of animation: valid requests given that a majority of these displays originally incorporated animation elements through interactivity. Motion has
8
been previously shown to increase the usability of data [7]. Whereas this survey was not technically able to provide the full interactive experience of rotating, delving and zooming through many of these displays, the nature of these responses suggest that organic displays are better at embodying these essential elements of data visualization. Two of the top three aesthetically ranked visualization techniques, Botanical Viewer (27% organic-related keywords) and Polar Viewer (19%) also receive the highest percentage of attribution to organic qualities. An ‘organic quality’ was loosely defined as a keyword relating to nature, or organism-based. For the display holding the highest level of aesthetic ranking, SunBurst, 24 of the 300 keywords were assessed as relating to the adjective organic, a ratio of 8%. Participants found the display to have a ‘sunny’, ‘leafy’ and ‘feathery’ appearance. Reversing, BeamTrees, ranked lowest quantitatively, and was thought to look ‘engineered’ and ‘mechanical’ in appearance. BeamTrees received only 3 out of a total of 279 (>1%) keywords referencing organic qualities. Comments for BeamTrees unimaginatively refer to the ‘cylindrical’, ‘pipes’ form of the visual shapes being used. Participants who scored BeamTrees favorably through aesthetic ranking seemed to have a hard time finding suitable analogies, citing ‘interesting’ and ‘obscure’ as positive descriptors to accompany even the highest of aesthetic rank.
Group Rationale Semantic analysis of the group rationale statements revealed that growth and movement were noticeable motivators for high appraisal, a logical connection given a majority of these displays incorporate animation in their native state. One participant reported that he “liked the feeling of movement in some of the other
pictures…that I could identify something organic about them e.g. petals of a flower, flower buds, a diamond or crystal – even tentacles”. This attribute of organic, as identified earlier through individual descriptors, was commonly referenced as the display having possession of animate qualities, the potential to evolve and expand. Whereas this survey was not technically able to provide the full interactive experience of rotating, delving and zooming through many of these displays, the nature of these responses suggest that organic displays are better at embodying these characteristics.
figure 6. Keyword occurrence of a 4650-word response set, prioritized in color and size by frequency of use.
9
Similar to the aesthetic ranking and description, displays that exhibited organic qualities proved to invoke imagination on a more profound level. We realize that this is somewhat of a subjective assessment. Participant descriptions of their emotive connections forming the basis of their aesthetic evaluation became quite imaginative. For example, “the organic looking examples seem to attract me more. Due to the centre where the folders and files are grouped around the root folder like children sitting around a fire, causing confidence while watching them.” Past exposure to more recognizable techniques such as Windows Explorer and, to a lesser extent TreeMap, also portrayed familiarity in a negative view – as stated, “organic appearance was what appealed to me most; it was also the most unusual. The nodes and wires diagrams were relatively familiar, but not as attractive; the boxes are hard-edged and less appealing”.
Discussion & Future Work According to Tufte [8], the human eye finds nature’s color palette harmonious, and thus advises the use of greens, blues, and browns for information displays. If the existing earth-toned color palette was not used in this online survey, an emphasis of ‘organic’ would not likely have occurred. Further, perhaps BeamTrees would have not faired so poorly in aesthetic rank, comparatively, if vibrant palette was removed and the survey limited to a utilitarian greyscale. Contrastingly, SunBurst may not have faired so well if the hierarchy of files and folders had not been either so shallow or so balanced. We claim that different datasets are better portrayed by different visualizations; future work might vary the dataset being visualized to explore further.
It is acknowledged that the full advantage of these visualization techniques are leveraged through the use of interaction, something we were technically not able to provide for this online survey. As there exists both a joy and aesthetic in playful interaction with a system which raises the level of affect and emotion [9], this is an area of significance. Other designers have begun to champion the cause, launching comparative evaluations online of fully interactive visualization techniques [10].
Participants in this survey were instructed to look at these displays as a work of art, perceiving them based only upon their visual qualities. This categorization of beauty may indeed change when participants are asked to utilize the displays to accomplish data retrieval tasks. Past studies of interactive systems suggest that ‘beautiful is good’, drawing correlations between quantitative aesthetic and usability [4, 5, 11-18]. Yet to what effect aesthetic has on usability metrics of efficiency and effectiveness within the field of data visualization is not yet known.
Conclusion Through the results gathered this survey, a correlation has been shown to exist between data visualizations displaying organic qualities and those perceived to hold a high level of aesthetic. Participant rationalization goes on to suggest organic qualities imply animate characteristics of growth and expansion, an inherent component of data. This study hopes to encourage visualization designers to consider the incorporation of organic qualities, as well as aesthetic as a whole, in both their conception and evaluation of data visualization techniques.
10
Acknowledgements The authors would like to thank all participants who took this survey. We would also like to also acknowledge the authors of each visualization, without whom this study would not have been possible. The survey website can be visited at the URL: http://aesthetic-effect.com.
Appendix
TreeMap University of Maryland C. Plaisant, B. Shneiderman G. Chintalapani, A. Aris
IcicleTree INRIA Futurs/LRI J. Fekete
SpaceTree University of Maryland J. Grosjean C. Plaisant B. Bederson
Windows Explorer Microsoft Corp http://www.microsoft.com
BeamTrees Eindhoven University of Technology F. van Ham
StarTree Inxight Software http://www.inxight.com
Dendogram Tree INRIA Futurs/LRI J Fekete
Reingold Tilfer Polar View INRIA Futurs/LRI J. Fekete
StepTree Lulea University of Technology T. Bladh
Botanical Viewer Eindhoven Univ. of Technology E. Kleiberg, H. van de Wetering, J.J. van Wijk
SunBurst Georgia Tech University J. Stasko
11
References
[1] S. K. Card, Readings in Information Visualization : Using Vision to Think. San Francisco, California: Morgan Kaufmann Publishers, 1999. [2] C. Chen, "Top 10 Unsolved Information Visualization Problems," IEEE Computer Graphics and Applications, pp. 12-16, 2005. [3] G. Birkhoff, Aesthetic Measure. Cambridge, Massachusetts: Harvard University Press, 1933. [4] R. Scha and R. Bod, "Computationele Esthetica," Informatie en Informatiebeleid, vol. 11, pp. 54-63, 1993. [5] M. G. Petersen, O. S. Iversen, P. G. Krogh, and M. Ludvigsen, "Aesthetic Interaction: A Pragmatist's Aesthetics of Interactive Systems," presented at Proceedings of the 2004 conference on Designing interactive systems: processes, practices, methods, and techniques, Cambridge, MA, USA, 2004. [6] H. Purchase, J. A. Allder, and D. Carrington, "Metrics for Graph Drawing Aesthetics," Journal of Visual Languages and Computing, vol. 13, pp. 501-516, 2002. [7] L. Bartram, "Enhancing Visualizations with Motion," vol. Ph. D. Thesis: Simon Fraser University, Canada, 2001. [8] E. Tufte, Envisioning Information. Cheshire, Conn. U.S.A.: Graphics Press, 1990. [9] N. Cawthon and A. Vande Moere, "A Conceptual Model for Evaluating Aesthetic Effect within the User Experience of Information Visualization," in Tenth International Conference on Information Visualisation (IV'06) London, England, 2006, pp. 374-382. [10] M. Wattenberg, J. Kriss , F. Viégas, F. van Ham, and M. McKeon, "http://Many-Eyes.com," 2007.
[11] P. Desmet and E. Dijkhuis, "A Wheelchair Can Be Fun: A Case of Emotion-Driven Design," in Proceedings of the 2003 international conference on Designing pleasurable products and interfaces. Pittsburgh, PA, USA: ACM Press, 2003. [12] B. J. Fogg, J. Marshall, O. Laraki, A. Osipovich, C. Varma, N. Fang, J. Paul, A. Rangnekar, J. Shon, P. Swani, and M. Treinen, "What Makes Web Sites Credible?: A Report on a Large Quantitative Study," presented at Proceedings of the SIGCHI conference on Human Factors in Computing Systems, Seattle, Washington, U.S.A, 1998. [13] J. Hartmann, "Assessing the Attractiveness of Interactive Systems," in CHI '06 extended abstracts on Human factors in computing systems. Montreal, Quebec, Canada: ACM Press, 2006. [14] M. Kurosu and K. Kashimura, "Apparent Usability Vs. Inherent Usability," presented at CHI'95, New York, 1995. [15] D. Ngo and J. G. Byrne, "Another Look at a Model for Evaluating Interface Aesthetics," Int. J. Appl. Math. Comput. Science, vol. 11, pp. 515-535, 2001. [16] Z. Ping and L. Na, "The Importance of Affective Quality," Commun. ACM %@ 0001-0782, vol. 48, pp. 105-108, 2005. [17] A. Sutcliffe, "Heuristic Evaluation of Website Attractiveness and Usability," in Interactive Systems: Design, Specification, and Verification : 8th International Workshop, Dsv-Is 2001, vol. 2220/2001: Springer Berlin / Heidelberg, 2004, pp. 183. [18] N. Tractinsky and M. Hassenzahl, "Arguing for Aesthetics in Human-Computer Interaction," i-com. Zeitschrift fur interaktive und kooperative Medien, vol. 4, pp. 66-68, 2005.