2. Zone-based User Interfaces Daniel C. Robbins UI Designer VIBE (MSR) Microsoft Corporation Daniel C. Robbins UI Designer VIBE (MSR) Microsoft Corporation

3. Motivation Data navigation for keypad enabled devices Multiple kinds of data Specific scenarios Map navigation Photo-browsing Calendaring App / task switching

4. User Interface Goals Scales from Phone to TV to Desktop Glanceable One-handed operation: “eyes-free”? Use spatial memory Efficiently use screen real-estate Maintain single area of visual focus Animated transitions

5. “Jump to the Chase” Keypad is “Least Common Denominator” Segment data according to keypad User recursively navigates among segments 123 45 789 *0# 6

6. Why Use Keypad? Always available: Ubiquitous Least-common denominator Low-acquisition cost Doesn’t obscure content (vs finger/cursor)

7. Existing Methods Segmentation isn’t spatial Context cues too expensive Can’t use fisheye Can’t use overview map Can’t use gutter regions Require pointing /stylus device vs.

8. ZoneZoom Prototype Daniel C. Robbins UI Designer VIBE / MSR Daniel C. Robbins UI Designer VIBE / MSR

9. What You Just Saw Interaction Summary D-Pad allows arbitrary movement Transitions are animated to show context Tap = go to sub-zone Press ‘n Hold = glance at sub-zone

10. Glanceability Maintain context via spring-loaded nav. Quickly compare locations Tap vs. Press and Hold 4 4 Press ‘n Hold Zoom In 8 8 Press ‘n Hold Sibling to sibling

11. “Eyes-free” Easily navigate to common locations Take advantage of spatial memory Navigating before phone is out of pocket UI navigation without looking at input device Comparing map locations Learnable mappings

12. Parabolic Paths NOTE: All interactions are interruptible

13. Graphical Cues Reinforcement! Border shading Disambiguate relationship to parent Segment numbers More salient when zoomed-out Subtle when zoomed-In Schematic overview Location relative to parent view NOT to root

14. ZoneZoom Platform

15. SmartPhlow Seattle Area Traffic Conditions ASI Group / Microsoft Research Seattle Area Traffic Conditions ASI Group / Microsoft Research

16. SmartPhlow

17. SmartPhlow Traffic Application Two levels of zoom (out and in) Multiple optimized maps Microsoft SmartPhone 2002 SDK GPRS  MS Server  WashDOT server Downloads ~ 250 bytes of data Bayes-net back end for trending Easily compare hotspots Large deployment!

18. TaskZones Define window groups based on monitor locations

19. TaskZones: Virtual Desktop Window groups based on monitor locs. Showing / hiding groups from stored locs. Multiple groups simultaneously visible Spatial memory coupling via num. keypad

21. Implementation

22. ZoneZoom Prototype Macromedia Flash on PC Rapid prototyping / quick iterations Rich cues Fast animation Keyboard, mouse, or keypad interaction Web page hostable

23. SmartPhlow App Microsoft SmartPhone 2002 SDK C code Widest reach

24. ZoneZoom App Built on top of SmartPhlow Runs on Smartphone: mobile testing Bitmaps for flexibility Segments move w/ incremental navigation

25. TaskZones Prototype Macromedia Flash Working version C# using.NET Framework Monitor configurations that fit in 3×3 grid

26. Ongoing & Future Work

27. Our Plans Adaptive view segmentation Better context cues: “Where am I?” Locations near segment borders Semantic Zooming Best of breed application: Search Use zones to traverse taxonomy Remote controls  apps viewed on TV 10’ experience rather than 4”

28. Segmentation Methods Static content Dynamic content Regular Content Aware

29. Transition Styles Super Fast 2D Medium Fast 2D Segmented 3D Combined 3D NOTE: Maps on Smartphones are bounded Q: what to do with region “beyond”?

30. Future Platform CF 2.0 for Windows Mobile 5 (Magneto) Piccolo.net? D3D Mobile? Waiting for the hardware…

31. More Information dcr@microsoft.com dcr@microsoft.com http://research.microsoft.com/vibe/zonezoom http://research.microsoft.com/vibe/zonezoom dcr@microsoft.com dcr@microsoft.com http://research.microsoft.com/vibe/zonezoom http://research.microsoft.com/vibe/zonezoom

32. © 2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.