Piccolo: A Scalable Structured Graphics Toolkit

1. Piccolo: A Scalable Structured Graphics Toolkit Aaron Clamage, Jesse Grosjean Ben Bederson University of Maryland Human-Computer Interaction Lab Computer Science Department

2. Piccolo:What is it? • Toolkit that supports: • structured canvas of graphical objects • hierarchical scene-graph model • creation of “controls” for use within Windows Forms • Supports 2D object-oriented graphics • hierarchies (transformation, transparency, etc.) • animation, event handling • cameras, layers, views • efficiency mechanisms • Missing structure that relies on underlying renderer • GDI+, Direct3D, OpenGL, Java2D, etc. => Open, Extensible and Efficient Human-Computer Interaction Lab

3. What Is It Good For? • => Structured graphics • Custom interaction • Zoomable User Interfaces Gentleware.com - Poseidon PaperLens – Microsoft Research University of Maryland Human-Computer Interaction Lab

4. What Is It Good For? • Structured graphics • => Custom interaction • Zoomable User Interfaces International Children’s Digital Library www.icdlbooks.org Demo SpaceTree Range Slider Human-Computer Interaction Lab

5. What Is It Good For? • Structured graphics • Custom interaction • => Zoomable User Interfaces U. Victoria – Ontology Visualization Demo PhotoMesa www.photomesa.com Human-Computer Interaction Lab

6. Where Does It Run? • Almost everywhere • Piccolo.NET • (C#) .NET for Windows • PocketPiccolo.NET • (C#) Compact Framework for Pocket PC • Piccolo.Java • (Java) for everywhere else Human-Computer Interaction Lab

7. Class Hierarchy Typical run-time structure How Does It Work? • => Monolithic scene-graph • Simple class hierarchy • Extend PNode to make new nodes • Simple runtime structure • Supports Custom Interaction • Efficiency mechanisms • Utilities for easy startup Human-Computer Interaction Lab

8. How Does It Work? • Monolithic scene-graph • => Efficiency Mechanisms • Picking • Validating bounds and updating display • Damage/repair • Driven by UI cycle • Utilities for easy startup Human-Computer Interaction Lab

9. How Does It Work? • Monolithic scene-graph • Efficiency Mechanisms • => Utilities for easy startup • Embedded Piccolo canvas • Designer enabled using UMD.HCIL.Piccolo; using UMD.HCIL.Piccolo.Nodes; using UMD.HCIL.PiccoloX; public class PHelloWorld : PForm { public override void Initialize() { PText text = new PText("Hello World!"); Canvas.Layer.AddChild(text); } static void Main() { new PHelloWorld(); } } Code Human-Computer Interaction Lab

10. Performance Analysis Scenegraph manipulation speed Rendering Speed [Bederson, Grosjean, Meyer - TSE 2004] Human-Computer Interaction Lab

11. Conclusions / Directions • Scenegraphs are useful to • Provide efficient picking and rendering • Support highly customized interaction • But at a cost… • Not always the best way to store the data • Harder to plug in new visualizations • Toolkits are usually worth their weight • Piccolo’s Future: • Finish website, tutorials, etc. • Hook up to other renderers (Direct3D, OpenGL) • Build more apps! • Funded by: • Microsoft • Initially by: • DARPA • NSF www.cs.umd.edu/hcil/piccolo Human-Computer Interaction Lab

12. My Interest in this Workshop • I want to better understand • Challenges other IV toolkit designers are facing • How Piccolo fits in with other toolkits • I want to explore the feasibility of creating a universally useful infrastructure Human-Computer Interaction Lab