MELD: A PATTERN SUPPORTED METHODOLOGY FOR VISUALISATION DESIGN by BARRY WILKINS A thesis submitted to The University of Birmingham for the degree of DOCTOR OF PHILOSOPHY School of Computer Science The University of Birmingham March 2003 Abstract The quantity and complexity of data that users are being exposed to is increasing. This is especially evident in domains such as the World Wide Web, software engineering, medical systems, etc. There is a need for the user to be supported in the analysis of this data, which may incorporate tasks such as data exploration, navigation, and manipulation. Visualisation is an area that can provide tools and techniques that support these tasks.
However, due to the complexity of these domains, designing effective visualisations is difficult. Recently user interface designers have started to record their successful design experiences in a structured format known as patterns. These patterns help designers develop interfaces that use solutions that have proven to work in past designs. This thesis describes a methodology that uses patterns, in particular visualisation specific patterns, as a mechanism for providing visualisation designers with appropriate design knowledge at each stage in the development of a visualisation.
In addition, we propose the use of visualisation heuristics as a way of evaluating alternative visualisation designs in terms of their usability. Acknowledgements I would like to thank my supervisor, Bob Hendley, for his support and encouragement throughout my PhD. I’d like to thank Claire Macklin, Liz Fricker, Shan Cook, and Mark Channer at QinetiQ for their help designing and conducting the cognitive walkthroughs and empirical trials. I would also like to thank Jim Beadle for his patience, ideas, confirmations and suggestions during our numerous discussions about class design.
I’d also like to thank him for looking over the visualisation patterns and confirming that they at least seem sensible. I also greatly appreciate the time and effort he took proofreading my thesis. I’d like to thank ‘The Chief’ a. Rachel Harris for being the other heckler, our across the office email conversations and always being prepared to have a cuppa tea.
I also thank Mr Chu-Ming Du for his words of wisdom. Thanks also to Rachel Harris and Dave Gurnell for proofreading key chapters. Finally, I’d like to thank my parents and my brother for putting up with me, knowing I’d get there in the end, and being proud of me no matter what. Jobs a good ‘un, Barry.
Table of Contents Chapter 1: INTRODUCTION .2 Problems faced by Visualisation Designers.3 Aims of this Research .3 Development and use of Patterns.7 Chapter 2: VISUALISATION OVERVIEW.1 What is Visualisation? .2 Why do we need it? .3 Visualisation in Action .1 The Information Mural .4 Business Data Visualisation.7 Physiologic Data Visualisation .4 Why Visualisations work.2 Experiments to Determine Pre-Attentive Features .6 Examples of Perceptual Guides Applied to Visualisation Design.7 Limitations on the use of the perceptual system.2 Type, Range, Reliability .8 Visualisation Design and Visualisation Techniques.1 Using three dimensions.2 Overview and Detail .3 Focus and Context .4 Large numbers of items, Visual Clutter and Occlusion.6 Multiple Linked Views .8 Visualisation techniques summary .53 Chapter 3: METHODOLOGIES, MODELS, HEURISTICS AND PATTERNS .2 Human-Computer Interaction .3 Software Engineering meets Human-Computer Interaction.4 Generic Design Methodology.3 Visualisation Reference Models .4 Automatic Visualisation Generators .1 History and Evolution.2 Problems with Automatic Visiualisation Generators.3 Benefits of Patterns .4 Pattern Approach to Design .77 Chapter 4: A PATTERN SUPPORTED VISUALISATION DESIGN METHODOLOGY .1 Pattern Supported Methodology .112 Chapter 5: APPLICATION OF THE METHODOLOGY .2 Command and Control.2 Military Task Requirements .4 Application of the Design Evaluation Methods.2 Design Evaluation Constants .3 Heuristic Evaluation Tool .5 Summary of Predictions.146 Chapter 6: EVALUATION, RESULTS, AND ANALYSIS .1 Objectives and Approach.1 Aims and Measures.3 General Experiment Design.4 Simple Task Experiment Design .5 Complex Task Experiment Design .4 Ranking of Perceived Usability .179 Chapter 7: CONCLUSIONS AND FUTURE WORK .3 Design Evaluation Techniques .192 Appendix B: HEURISTIC CLASSIFICATION.1 Heuristic effect on Usability Factors .209 Appendix C: VISUALISATION PATTERNS .221 Appendix D: ANALYSIS FACTOR QUESTIONS .254 Appendix E: MILITARY TASK SCENARIOS .1 Mission Plan Problems .265 List of References .267 List of Figures Figure 1.1: The power of visual representations.3: CyberGeo Map example of website document changes.5: Business data visualisation.8: Traditional physiologic data display.9: Real-time physiologic data visualisation.11: Basic model of human visual processing system.12: Response times for pre-attentive and non-pre-attentive targets.13: Target detection using hue.14: Target detection using shape.15: Boundary detection using hue.18: Model of perspective.20: Shading depth cue.21: Focus depth cue.22: Proximity: (a) row dominant, (b) column dominant.25: RGB Colour Cube.28: A set of symbols for a military command and control display.29: Salmon tracking simulation.30: Mackinlay’s (1986) ranking of visual features to data type.31: MRI data superimposed onto a model of a human head.32: TreeMap visualisation of a file system.33: Network visualisation – Arc Map.34: Example of occlusion in a 3D data space. Anchor line and shadow techniques.36: Overview and detail.37: Hyperbolic browser distorted space focus and context technique.39: Fisheye lens distortion.40: Table Lens collapsed space focus and context technique.42: Viewing detailed information using a temporary ‘pop up’ window.43: Small multiples in Web Analysis Visualisation Spreadsheet.44: Small multiples in VisDB.45: Snap-Together Visualisation.47: Bounding box technique used in Microsoft Windows ExplorerTM.48: Selective Dynamic Manipulation (SDM).1: Software Development Life Cycle.4: Generic design methodology.5: Basic visualisation process.7: Integrated visualisation model.8: Extended visualisation process.9: Mackinlay’s ranking of visual features to data type.10: The Pattern Supported Approach Framework.1: Overview of methodology.7: Pattern Supported Visualisation Methodology .8: Structure pattern language.9: Interaction pattern language.10: Stages of the methodology.11: Stages of the methodology including supporting patterns.12: Methodology including usability engineering life cycle elements.13: The complete pattern supported visualisation design methodology.1: Situation awareness visualisation.2: Resource Checks visualisation.3: Parallel Coordinates visualisation.4: Route Checks visualisation.6: Mission Execution visualisation.7: Mission Dependencies visualisation.8: Heuristic Evaluation tool.9: Resource Checks – wow-vis version.10: Resource Checks – just-a-vis version.11: Power level colour assignments.12: Base resource layout comparison.13: Parallel Coordinates – wow-vis version.14: Parallel Coordinates – just-a-vis version.15: Route Checks – wow-vis version.16: Route Checks – just-a-vis version.17: Legends used in the wow-vis Route Checks visualisation.1: Comparison of intuitiveness to preference.2: Presentation blocks for simple tasks.3: Presentation blocks for complex tasks.4: Similarity dimension counterbalancing.5: Resource Checks – simple tasks – reaction time (correct answers only).6: Resource Checks – simple tasks – reaction time vs.7: Resource Checks – simple tasks – SUMI scores.9: Resource Checks – complex tasks – SUMI scores.10: Parallel Coordinates – simple tasks – reaction time.11: Parallel Coordinates – simple tasks – reaction time vs.12: Parallel Coordinates – simple tasks – SUMI scores.13: Parallel Coordinates – complex tasks – reaction time.14: Parallel Coordinates – complex tasks – SUMI scores.15: Route Checks – simple tasks – reaction time.16: Route Checks – simple tasks – reaction time vs.17: Route Checks – simple tasks – SUMI scores.18: Route Checks – complex tasks – reaction time.19: Route Checks – complex tasks – SUMI scores.1: Structure pattern language.2: Interaction pattern language.223 List of Tables Table 2.3: Upper limit of values that can be encoded by various visual features.1: Usability Engineering Life Cycle.2: How the generic methodology relates to the usability engineering life cycle.3: Example usability heuristics.5: Borchers’ application of patterns to the usability engineering life cycle.1: The relationship between patterns and elements of the usability engineering life cycle in the design stage.2: Heuristics and sources.5: Heuristic effect on usability factors.6: Rationale for heuristic 9.7: Overview and Detail structure pattern.8: Example data factor question and solution.9: Comparison between Mackinlay (1986) and Salisbury (2001).10: Heuristic score values and descriptions.11: Heuristic score matrix.12: Example usability factor weight assignments.13: Example of n-to-1 mapping.14: Dimensional score mapping assignments.1: Typical military scenario used for task analysis.2: Example task scenario.3: Usability factor weight assignments for command and control.4: Mapping evaluation for visual features used in Resource Checks visualisation.5: Heuristic score matrix for Resource Checks visualisation.6: Resource Checks – just-a-vis usability scores.7: Resource Checks – wow-vis usability scores.8: Resource Checks visualisation ratings.9: Heuristic score matrix for Parallel Coordinates visualisation.10: Parallel Coordinates – just-a-vis usability scores.11: Parallel Coordinates – wow-vis usability scores.12: Parallel Coordinates visualisation ratings.13: Colour assignments used in Route Checks visualisations.14: Mapping evaluation for visual features used in Resource Checks visualisation.15: Heuristic score matrix for Route Checks visualisation.16: Route Checks – just-a-vis usability scores.17: Route Checks – wow-vis usability scores.18: Route Checks visualisation ratings.19: Summary of ratings using the mapping evaluation.20: Summary of visualisation ratings using the heuristic evaluation.21: Summary of visualisation rankings using each design evaluation technique.1: Tasks used in cognitive walkthroughs.2: Subjective usability of visualisations.3: Average intuitiveness ratings for each visualisation.4: Visualisations ranked by perceived intuitiveness.5: Average preference ratings for each visualisation.6: Visualisations ranked by preference.7: Task categories supported by visualisations.8: Task category tasks.9: Latin Square Design counterbalance for five factors (A-E).10: Counterbalanced presentation order for the complex task experiment.11: Resource Checks usability ratings using heuristic evaluation.12: Resource Checks observed results for simple and complex tasks.13: Parallel Coordinates usability ratings using heuristic evaluation.14: Parallel Coordinates observed results for simple and complex tasks.15: Route Checks usability ratings using heuristic evaluation.16: Route Checks observed results for simple and complex tasks.17: Ranking of perceived usability for simple tasks.18: Ranking of perceived usability for complex tasks.1: Heuristic effect on usability factors.208 Chapter 1: INTRODUCTION In this thesis we explore ways in which the visualisation designer can be guided to develop visualisations that use well-established techniques. To accomplish this we have reviewed three main areas, visualisation, human computer interaction, and software engineering. This review has focused on the methodologies and techniques used in each of these disciplines, the mechanisms they use to capture and deliver design knowledge, and the methods by which designs can be evaluated.
This has led to the development of a methodology that focuses on the factors relevant to visualisation design and that is supported at each stage by appropriate design knowledge. This chapter briefly introduces the concept of visualisation and why we need it, the problems that visualisation designers are faced with, the aims of this research with respect to those problems, and finally an overview of the structure of the remainder of the thesis.1 Visualisation Visualisation could be defined as the visual representation of data. This includes traditional representations such as pie charts, bar charts, and scatter plots. However, through the use of computers visualisation provides something more.
Software based visualisations are capable of supporting large datasets and, via interaction, give the user the freedom to explore the data, test theories, discover patterns, monitor dynamic events and perform a wide variety of tasks that are simply not possible with traditional static displays. Visualisations can be created for any domain and, as such, can take many forms. Scientific visualisations are often based on the physical model from which the data is gathered. For example, global ozone-levels can be presented using a model of the Earth, medical imaging data can be displayed using a map of the human body, and so on.
In contrast to this, information visualisation tends to use more abstract data such as document collections, software modification logs, file systems, etc., and so has no physical model upon which to base the display. Chart-based representations may still be applicable but often more novel visualisation designs are required to support this abstract data. There remains the question of why we need visualisation. To answer this we need to ask why we use chart-based displays rather than lists of items.
Consider the following example. Imagine trying to find the highest value in a list of ten two-digit numbers by visual inspection. This is a fairly straightforward serial search task and could be completed quite easily. However, what if the number of items increased from ten to one hundred, or one thousand, or the size of the numbers increased from two to four digits? To attempt this by reading each 1 1.1 Visualisation value and comparing it to the highest value held in your short-term memory would be a tedious, time consuming, and in all likelihood, error prone task.
Performing the same task using a simple visualisation such as a bar chart or scatter plot is much easier.