information visualization: navigation
DESCRIPTION
Information Visualization: Navigation. Chris North cs3724: HCI. Review. Shneiderman’s Info. Vis. mantra? Strategies for Multi-D visualization:. 1-D and 2-D Spaces. 1-D: info has strong 1-D organization text doc, slideshows, video, audio, lists, timelines - PowerPoint PPT PresentationTRANSCRIPT
Information Visualization:Navigation
Chris North
cs3724: HCI
Review
• Shneiderman’s Info. Vis. mantra?•
• Strategies for Multi-D visualization:•
1-D and 2-D Spaces
• 1-D: info has strong 1-D organization• text doc, slideshows, video, audio, lists, timelines
• 2-D: info has strong 2-D organization• spreadsheets, graphs, maps, formatted docs, color chooser,
images
PowerPoint Slide Sorter
• Data Space: 1D array of slides
• Visualization: 2D array, nav 1D
Typical Navigation
1D scrollbar 2D scrollbars
What’smissing?
Keyhole Problem
• Where am I?
• Where can I go?
• Where do I want to go?
• How do I get there?
• Lack of context, overview
Text Overviews
(MS Word)
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
Navigation Strategies
• Detail Only
• Overview+Detail• Multiple views
• Zooming
• Focus+Context• Distortion, fisheye
Zooming: 1D
• Lifelines: http://www.cs.umd.edu/hcil/lifelines/
Zooming large 2D spaces
• http://terraserver.homeadvisor.msn.com/image.asp?S=10&T=1&X=2689&Y=20639&Z=17&W=2
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?
Overview+Detail: 1D
• SeeSoft
Overview+Detail: 1D
• Home automation:• Timeline for scheduling, set on/off flags
• Calendar shows overview of schedule
Overview+Detail: 2D
Overview: Detail:
• Zoom factor = 5
Square in overview tightly-coupled to scroll bars of detail
Overview+Detail
• Multiple views:• overview
• detail view
• Views are linked:• Selector in overview navigates detail
• Navigating detail updates selector in overview
Multiple levels = large scale
• Zoom factor = 125
overview intermediate view
intermediate view detail view
Multiple FociLinkit
Focus+Context: 1D
• Fisheye Menu: http://www.cs.umd.edu/hcil/fisheyemenu/
• Perspective Wall
Focus+Context: 2D
Comparison
• Zooming:• natural• 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
Quiz
• Spotfire?
• TableLens?