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 = Development of a physics of appearance and behavior for informational objects Informational physics Material physics activityuse representationwear

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 Substrate (C++) TCL/TK API KPL Applications

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 A zoomable choice widget Procedural Animation

Jinwook Seo Implementation 600,000 Objects : 10 frames/sec Rendering times  # of visible objects Substrate (C++) TCL/TK API KPL Applications

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,1963Sketchpad –The first interactive computer graphics –TX-2 : 320KB, 9 inch CRT, lightpen –2000:1 scale  many acres of drawing space Constraint-Based Drawing, Borning, 1979Constraint-Based Drawing Pad, Ken Perlin and David Fox, NYU, 1993Pad –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