Download
1 / 24

Zone-based User Interfaces - PowerPoint PPT Presentation


  • 165 Views
  • Updated On :

Zone-based User Interfaces. Daniel C. Robbins UI Designer VIBE (MSR) Microsoft Corporation. Motivation Data navigation for keypad enabled devices. Multiple kinds of data Specific scenarios Map navigation Photo-browsing Calendaring App / task switching. User Interface Goals.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Zone-based User Interfaces' - duscha


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Zone based user interfaces l.jpg

Zone-based User Interfaces

Daniel C. Robbins

UI Designer

VIBE (MSR)

Microsoft Corporation


Motivation data navigation for keypad enabled devices l.jpg
MotivationData navigation for keypad enabled devices

  • Multiple kinds of data

  • Specific scenarios

    • Map navigation

    • Photo-browsing

    • Calendaring

    • App / task switching


User interface goals l.jpg
User Interface Goals

  • Scales from PhonetoTV to Desktop

  • Glanceable

  • One-handed operation: “eyes-free”?

  • Use spatial memory

  • Efficiently use screen real-estate

  • Maintain single area of visual focus

  • Animated transitions


Jump to the chase l.jpg

1

2

3

4

5

7

8

9

*

0

#

6

“Jump to the Chase”

  • Keypad is “Least Common Denominator”

  • Segment data according to keypad

  • User recursively navigates among segments


Why use keypad l.jpg
Why Use Keypad?

  • Always available: Ubiquitous

  • Least-common denominator

  • Low-acquisition cost

  • Doesn’t obscure content (vs finger/cursor)


Existing methods l.jpg
Existing Methods

vs.

  • 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


Zonezoom prototype l.jpg

ZoneZoom Prototype

Daniel C. RobbinsUI Designer

VIBE / MSR


What you just saw interaction summary l.jpg
What You Just SawInteraction Summary

  • D-Pad allows arbitrary movement

  • Transitions are animated to show context

  • Tap = go to sub-zone

  • Press ‘n Hold = glance at sub-zone


Glanceability l.jpg

4

8

Glanceability

  • Maintain context via spring-loaded nav.

  • Quickly compare locations

  • Tap vs. Press and Hold

8

4

Press ‘n Hold

Sibling to sibling

Press ‘n Hold

Zoom In


Eyes free l.jpg
“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


Parabolic paths l.jpg
Parabolic Paths

NOTE: All interactions are interruptible


Graphical cues l.jpg
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



Smartphlow l.jpg

SmartPhlow

Seattle Area Traffic Conditions

ASI Group / Microsoft Research



Smartphlow traffic application l.jpg
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!


Ongoing future work l.jpg

Ongoing & Future Work


Our plans l.jpg
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”


Segmentation methods l.jpg
Segmentation Methods

Regular

  • Static content

  • Dynamic content

Content

Aware


Transition styles l.jpg
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”?


Future platform l.jpg
Future Platform

  • CF 2.0 for Windows Mobile 5 (Magneto)

  • Piccolo.net?

  • D3D Mobile?

  • Waiting for the hardware…


More information l.jpg

More Information

[email protected]

http://research.microsoft.com/vibe/zonezoom


Slide24 l.jpg

© 2005 Microsoft Corporation. All rights reserved.

This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.


ad