Focus Context - PowerPoint PPT Presentation

1 / 45
About This Presentation
Title:

Focus Context

Description:

May only be able to highlight particular cases or particular variables, but ... Deja Vu all over again. Spring 2005. CS 7450. 3. Challenge ... – PowerPoint PPT presentation

Number of Views:25
Avg rating:3.0/5.0
Slides: 46
Provided by: JohnSt8
Category:
Tags: context | deja | flip | focus | video | vu

less

Transcript and Presenter's Notes

Title: Focus Context


1
Focus Context
  • CS 7450 - Information Visualization
  • February 22, 2005
  • John Stasko

2
Fundamental Problem
  • Scale - Many data sets are too large to visualize
    on one screen
  • May simply be too many cases
  • May be too many variables
  • May only be able to highlight particular cases or
    particular variables, but viewers focus may
    change from time to time

Deja Vu all over again
3
Challenge
  • Have context/overview seamlessly and smoothly
    co-exist with focus/detail
  • Why?
  • Easier to move between the two, helps assimilate
    view updates, less jarring,
  • Not all overview and detail techniques are good
    at this

4
Focus Context Views
  • Same idea as overview and detail, with one key
    difference
  • Typically, the overview and the detail are
    combined into a single display
  • Mimics our natural vision systems more closely

5
How?
  • What techniques have we seen so far that would
    help accomplish focuscontext?

6
Possible Methods
  • Filtering
  • Selective aggregation
  • Micro-macro readings
  • Highlighting
  • Distortion

7
Prototypical Example
  • When people think about focuscontext views, they
    typically think of the Fisheye View (distortion)
  • Introduced by George Furnas in 1981 report, more
    famous article is 1986 SIGCHI paper

8
Definition
  • Fisheye View -
  • Provides detailed views (focus) and overviews
    (context) without obscuring anythingThe focus
    area (or areas) is magnified to show detail,
    while preserving the context, all in a single
    display.
  • -(Shneiderman, DTUI, 1998)

9
Example
(Not really a good one. Can you see why? ---just
a Photoshop trick---)
10
Everyday Life Example
11
Kinda Fisheye - Natural 3D Perspective
12
Why is it called Fisheye?
  • Fisheye Camera Lens

13
Real fisheye camera lens
Atlanta Journal
14
Fisheye Terminology
  • Focal point
  • Level of detail
  • Distance from focus
  • Degree of interest function

Can someone explain?
15
Focal Point
  • Assume that viewers focus is on some item, some
    coordinate, some position,...

1.0, 1.0
Focal point
0.8, 0.1
0.0, 0.0
16
Level of Detail
  • Some intrinsic value or quantity on each data
    element
  • How important is it to you in a general sense?
  • Simplest example is that all data items have same
    level of detail

17
Distance from Focus
  • Calculation of how far each data item is from the
    focal point

1.0, 1.0
Query position

0.8, 0.1
Focal point
0.0, 0.0
18
Degree of Interest Function
  • Function that determines how items in display are
    rendered
  • Degree of Interest Level of Detail - Distance
    from Focus Level
    of Detail / Distance from Focus

1.0, 1.0
0.8, 0.1
Focal point
0.0, 0.0
19
DoI Function
  • Can take on various forms
  • Continuous - Smooth interpolation away from focus
  • Filtering - Past a certain point, objects
    disappear
  • Step - Levels or regions dictating rendering
    0ltxlt.3 all same, .3ltxlt.6 all same
  • Semantic changes - Objects change rendering at
    different levels

20
Applications
Text/program viewing Furnas original example Sh
own here are examples from Gutwin and
Greenberg Step function
21
Applications
Shared text editor for CSCW
Gutwin and Greenberg, HCI 96
22
Applications
Viewing nodes in networks Gutwin and Greenberg
23
Applications
Fisheye menu Uses a focus-lock mode (move cursor
to right) Demo www.cs.umd.edu/hcil/fisheyemenu
Bederson UIST 00
24
Graphical Fisheye Views
  • Apply fisheye techniques to 2D graph
  • Experiment with a variety of distortion factors
  • Interactive tool that allows user to browse
    display and change focus

Sarkar and BrownCACM 94
25
Graphical Fisheye Views
26
Example
Original
27
Example
Focal point
Video
28
Constraining Changes
  • Continuous zoom
  • Can change focal point smoothly in graph
  • Other nodes give up space
  • Bartram et al, UIST 95
  • Constrained fisheye
  • Make transitions in focus more aesthetically
    pleasing and easier to track
  • Storey et al, JVLC 99

Video
Simon Fraser Univ.
29
Alternative Methodology
  • We can think of focus and degree of interest as
    distorting or warping the space upon which data
    is presented
  • Such pliable surfaces can provide another form of
    focuscontext display

Carpendale, Cowperthwaite, Fracchia, IEEE
CGA97 Carpendale and Montagnese, UIST 01
Video
30
Excellent Survey
  • Review and Taxonomy of Distortion-Oriented
    Presentation Techniques
  • Leung and Apperly, ToCHI 94
  • Surveys systems
  • Presents unified theory

31
Bifocal Display
  • Interesting application of fisheye view
  • View office documents
  • Take items in periphery and fold back in 3-space
  • Project onto front viewing screen

Spence Apperly BIT 82
32
Bifocal Display
Fold
Project
33
Bifocal Display
Fold
Project
34
Table Lens
From Xerox PARC and Inxight
A bifocal display
Rao CardCHI 94
Video
35
Perspective Wall
  • Computerized, automated 3D implementation of
    Bifocal display
  • Map work charts onto diagram, x-axis is time,
    y-axis is project

Video
Mackinlay, Robertson, Card CHI 91
36
Other 3D Approaches
Cone Trees 3D views of hierarchies such as
file systems
Robertson, Mackinlay, Card CHI 91
37
Another Cone Tree Example
38
Small Displays (PDAs)
  • FocusContext technique for web browsers
  • Flip-Zooming
  • Cards hold contextFocus is in centerItems
    before andafter are in corners

Björk et al, UIST 99
39
Calendar Management
FishCal
Bederson et al CHI 03 demo
Video
40
Panacea?
  • Are there any disadvantages of focuscontext or
    fisheye techniques?

41
Disadvantages
  • Distortion can be annoying
  • Can be very difficult to implement
  • Any change in focal point potentially requires
    recalculation of DoI for all objects and hence
    re-rendering of all objects -gt Expensive!

42
More to Come...
  • Will discuss fisheye and focuscontext techniques
    more when we cover trees and distortion techniques

43
Project Proposals
  • Due Thursday (1 copy, 1 page)
  • You must get alternative topics approved a priori

44
Upcoming
  • Panning and Zooming
  • Reading
  • Chapter 7
  • Bederson, Hollan et al
  • Hierarchies and trees

45
References
  • Spence and CMS texts
  • Shneiderman, B. Designing the User Interface,
    1998
  • All referred to papers
  • http//www.csi.uottawa.ca/ordal/papers/sander/main
    .html
  • http//www.cpsc.ucalgary.ca/grouplab/papers/1996/9
    6-Fisheye.GI/gi96_fisheye.html
  • Pan Wang and Green Lafond-Favieres F 99
    slides
Write a Comment
User Comments (0)
About PowerShow.com