Jinwook Seo
Pad++: A Zoomable Graphical
Sketchpad For Exploring
Alternative Interface Physics
Benjamin B. Bederson, James D.
Hollan, Ken Perlin, Jonathan Meyer,
David Bacon, George Furnas
Jinwook Seo
Paper Outline
•
•
•
•
•
•
•
•
•
Introduction : Motivations
Descriptions of Pad++ features
Visualization : Visualization Example with Pad++
Space-Scale Diagrams : Analytical tool
Procedural Animation : Smooth animation
Implementation
Physics-Based Strategies For Interface Design
Future Directions
Availability
Jinwook Seo
Motivations
• Limited space vs. Infinite space
– Elastic stretchable infinite sheet
• Metaphor-based approach
vs. Physics-based approach
– beyond the desktop metaphor
– new computer-based mechanisms
• Interface Design
Informational
physics
Material
physics
activity
use
representation
wear
= Development of a physics of appearance and
behavior for informational objects
Jinwook Seo
Motivations
• View information at multiple scales
– Semantic zooming
• Tap into natural spatial ways of thinking
– Central focal area + periphery in detail
• Make it more intuitive and easier to find
specific information in large dataspaces
 Filter or recommend a subset of the data
Provide a useful substrate to structure information
Jinwook Seo
What is Pad++?
• A general-purpose substrate for creating
and interacting with structured information
based on a zoomable interface
Applications
TCL/TK
API
Substrate
(C++)
KPL
Jinwook Seo
Features of Pad++
• Semantic Zooming
– Change the way things look depending on their
size
• Portals and Lenses
– Provide views onto other areas(+filtering)
– Index : sticky portal
– Lenses: change only the way objects are
presented
• Visual searching + Context-based search
Jinwook Seo
Visualization Experiments
• Multiple-resolution space
vs. Fixed-resolution layout
– There is always more room to put information
“between the cracks”.
– Suitable for visualizing hierarchical data
• Deeper the hierarchy, smaller the size
Jinwook Seo
Visualization Experiments
• HTML Browser
– Graphical depiction of semantic relationship
between windows
– Tree structure : Parent-child relationship
– Overview Lense
– Arbitrary cyclic graph
• Choose the root node, and BFS
Jinwook Seo
Visualization Experiments
• HTML Browser
Jinwook Seo
Visualization Experiments
• Directory Browser
Jinwook Seo
Visualization Experiments
• Timeline
Jinwook Seo
Visualization Experiments
• Oval Document layout
Jinwook Seo
Space-Scale Diagram
Jinwook Seo
Space-Scale Diagram
Basic pan-zoom trajectories
Jinwook Seo
Space-Scale Diagram
Solution to the simple joint pan-zoom problem
Jinwook Seo
Space-Scale Diagram
Shortest path in pan-zoom parameter space
Jinwook Seo
Space-Scale Diagram
Semantic Zooming
Jinwook Seo
Procedural Animation
• To support an informational physics in
which objects animate naturally
• KPL : fast post-fix stack language
• Morphing : Transition between two actions
having different tempos
• Example : Zoomable Choice Widget
• Example : Mouse and Cheese
Jinwook Seo
Procedural Animation
A zoomable choice widget
Jinwook Seo
Implementation
• 600,000 Objects : 10 frames/sec
• Rendering times  # of visible objects
Applications
TCL/TK
API
Substrate
(C++)
KPL
Jinwook Seo
Efficiency Methods in Pad++
•
•
•
•
•
•
•
•
•
•
Spatial Indexing : bounding box
Clustering : balanced tree
Refinement : skip detail while navigating
LOD : render item depending on its size
Region Management : changed region update
Clipping
Adjustable Frame Rate
Interruption
Ephemeral Objects
Optimized Image Rendering
Jinwook Seo
Physics-Based Strategies
For Interface Design
• Effective complement to traditional
metaphor-based approaches
• Exploit radical new computer-based
mechanism (zoom/scale)
• appearance and behavior  knowledge
• Large and complex information needs scale
Jinwook Seo
My favorite sentence
If interface designers are to move beyond window,
icons, menus, and pointers to explore a larger space
of interface possibility,
additional ways of thinking about interface that go
beyond the desktop metaphor are required.
Jinwook Seo
Contributions
• A new strategies for interface design
– Physics-Based Strategy
– Exploring more effective computer-based
mechanisms
• Space-Scale Diagram
– analytical tool for multiscale spaces
Jinwook Seo
Notes on the references
• Sketchpad, Sutherland, MIT,1963
– The first interactive computer graphics
– TX-2 : 320KB, 9 inch CRT, lightpen
– 2000:1 scale many acres of drawing space
• Constraint-Based Drawing, Borning, 1979
• Pad, Ken Perlin and David Fox, NYU, 1993
– Semantic Zooming, Portal
Jinwook Seo
Notes on the references
• Generalized Fisheye Views by Furnas
• Perspective wall by Mackinlay
• Information Visualizer by Stuart Card
– Information workspace
– E.g. Cone-tree
Jinwook Seo
Critique
• Strengths
– Alternative strategies for interface design
– Space-Scale Diagram
– Well organized, easy to read.
• Weaknesses
– Limitations of ZUI ? (lost in space, irreversible)
– Usability test/Performance analysis ?
Jinwook Seo
What has happened to this topic?
• Pad++ version 0.9 available in UCSD
• Jazz in UMD
– General-purpose 2D graphics toolkit for
creating ZUI
– Monolithic Design vs. Minilithic Design
• KidPad (Jazz Application)
– a collaborative story authoring tool for children