Presentation is loading. Please wait.

Presentation is loading. Please wait.

Information Visualization 2: Overview and Navigation Chris North cs3724: HCI.

Similar presentations


Presentation on theme: "Information Visualization 2: Overview and Navigation Chris North cs3724: HCI."— Presentation transcript:

1 Information Visualization 2: Overview and Navigation Chris North cs3724: HCI

2 Review Shneiderman’s Info. Vis. mantra? Mapping data to graphics?

3 The Problem Data Screen

4 Typical Navigation 1D scrollbar2D scrollbars What’s wrong?

5 Keyhole Problem Where am I? Where can I go? Where do I want to go? How do I get there? Lack of context, overview

6 Keyhole Problem

7 Context is Important!

8 E.g: 3 Overviews of Text (MS Word) Advantages?

9 E.g. SeeSoft 1 line of pixels / line of code

10 Reduce Even More Stasko, “Information Mural”

11 Visual Overview Show me the data! Map, organization (spatial layout of concepts) What information is (not) available? Adds context info, relationships Enables direct access Encourages exploration HCI metrics: Improves user performance, learning time, satisfaction Insight

12 Information Scent Hint at what data is hiding behind each item in the overview Enable users to ‘sniff’ out data of interest What data to bubble up to overview? What data to push down into the details?

13 TableLens

14 Aggregation with Zooming Rayson, “Aggregate Towers”

15 Zoom

16 Navigation Strategies Detail Only Overview+Detail Multiple views Zooming Focus+Context Distortion, fisheye

17 Zooming large 2D spaces Powers of 10 http://terraserver.homeadvisor.msn.com/image.asp?S=10&T=1&X=2689&Y=20639&Z=17&W=2

18 Zooming: 2D KidPad, HiNote, Jazz http://www.cs.umd.edu/hcil/jazz/ Semantic zooming: Don’t just show things at different size change objects to make sense E.g. add/remove detail info Powers of Ten Controls?

19 Overview+Detail: 1D SeeSoft

20 Overview+Detail: 2D Overview:Detail: Zoom factor = 5 Square in overview tightly-coupled to scroll bars of detail

21 Multiple levels = large scale Zoom factor = 125 overviewintermediate view detail view

22 Multiple Foci Linkit

23 Focus+Context: 1D Fisheye Menu: http://www.cs.umd.edu/hcil/fisheyemenu/http://www.cs.umd.edu/hcil/fisheyemenu/ Perspective Wall

24 Focus+Context: 2D

25 Comparison Zooming: Overview+Detail: Focus+Context:

26 Comparison Zooming: Screen space efficient Infinite scalability Lose overview when zoom in Overview+Detail: Good scalability, chaining Multiple foci Disconnect between views, back-n-forth Focus+Context: Integrated overview with detail, connected Least scalable Distortion, overview unstable

27 Quiz Spotfire? TableLens?

28 Design Exercise


Download ppt "Information Visualization 2: Overview and Navigation Chris North cs3724: HCI."

Similar presentations


Ads by Google