Evaluating visual cues for window switching on large screens

EVALUATING VISUAL CUES FOR WINDOW SWITCHING ON LARGE SCREENS Raphael Hoffmann (University of Washington) Patrick Baudisch (Microsoft Research) Daniel S. Weld (University of Washington)

WHICH IS THE ACTIVE WINDOW?

ON LARGE SCREENS CHANGES MAY GO UNNOTICED

NOTICING CHANGE Flashing of window moving to foreground  Flashing of window frame  Visual Search 

A HIGHLY EFFECTIVE CUE?

QUESTION

Which notification technique is highly effective and has little side effects?

DESIGN GOALS 2 Minimize impact on other screen content 3 Use sparse visual effects to minimize fatigue/annoyance 1 Minimize visual search time; Do not slow down users who already know where the target is

VISUAL CUES frames trails

BLINKINGFRAME

REDFRAME

BUBBLEFRAME

SHADOWFRAME

MASK

CENTERBEAM

CENTERSPLASH

WINDOWSPLASH

WINDOWBEAM

OUTLINE

Motivation

Related Work & Visual Cues for Window Switching

Studies

Conclusion

PERCEPTUAL UNDERPINNINGS high acuity vision peripheral vision

PERCEPTUAL UNDERPINNINGS

FEATURE INTEGRATION THEORY (Treisman, Gelade; CP 1980)

Pre-attentive Search

Attentive Search

COLOR Feature Integration Theory (Treisman, Gelade; CP 1980)

MOTION Feature Integration Theory (Treisman, Gelade; CP 1980)

SHAPE Feature Integration Theory (Treisman, Gelade; CP 1980)

SHADING + SHADOWS Feature Integration Theory (Treisman, Gelade; CP 1980)

NOISY BACKGROUND

COLOR VS. SHAPE Feature Integration Theory (Treisman, Gelade; CP 1980)

COLOR VS. SHAPE Feature Integration Theory (Treisman, Gelade; CP 1980) >

HETEROGENOUS DISTRACTORS Feature Integration Theory (Treisman, Gelade; CP 1980)

HOMOGENOUS DISTRACTORS Feature Integration Theory (Treisman, Gelade; CP 1980)

WHAT STANDS OUT IN OUR UI?

POPOUT PRISM Suh, Woodruff, Rosenholtz, Glass; CHI 2002

HALO Baudisch, Rosenholtz; CHI 2003 +

SPOTLIGHT Khan, Matejka, Fitzmaurice, Kurtenbach; CHI 2005 +

PHOSPHOR Baudisch, Tan, Collomb, Robbins, Hinckley, Agrawala, Zhao, Ramos; UIST 2006 DRAG-AND-POP Baudisch, Cutrell, Robbins, Czerwinski, Tandler, Bederson, Zierlinger; Interact 2003

TRAILS

Work even when target outside field of view

Reduce 2d search to 1d search

IMPLEMENTATION

Program written in C# using WPF

Cues can be selected through a configuration menu

System integrated with Alt-TAB mechanism in Windows XP

OUTLINE

Motivation

Studies

Conclusion

<remind>:

Efficiency in finding target

Awareness of other screen content

Avoiding annoyance

WHICH CUE SUPPORTS USERS BEST?

SEARCH SPACE ( ) 2 = 160 combinations x x x x x 2 2 2 2 4+1 control

SEARCH SPACE ( ) 1 = 10 (combinations) + + + + + 1 1 1 1 4+1 STUDY 1

SEARCH SPACE ( ) 1 + + + + + 1 1 1 1 4+1

SEARCH SPACE 1 = 6 combinations + 1 STUDY 2 1 1 1 1 + + + +

STUDY 1: CUES IN ISOLATION

TASK

Switch window focus by hitting space bar.

Locate newly active window and type number (title bar read ‘Window - #’).

If number correct, system removed it from title bar and replaced it with a new number on next switch

TASK

In 20% of the cases when windows were switched, a popup window with a letter appeared for 350ms at another location.

Participants were asked to type the letter, if they saw the popup.

Participants rated annoyance on Likert scale; said what they prefered

MEASURED …

Efficiency in finding target

Awareness of other screen content

Annoyance

task time proportion of overlooked popups subjective rating on 7pt Likert scale

STUDY DESIGN

Within-subjects design, 10 conditions, 62 repetitions, 10 participants

Background content: 80 windows – 1 / 3 accessories, 1 / 3 web pages, 1 / 3 office docs

Mixed Model analysis, ANOVA on ranks

Sequential Bonferroni correction

APPARATUS

24’’ + 30’’ + 24’’ displays

25’’ distance to center monitor

Used leash to prevent moving backwards

RESULTS – OVERVIEW Task Time Annoyance Popup Misses Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Task Time (seconds ± SEM) 8 10 12 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control Popup Detection Error (N ± SEM) 0 1 2 3 4 5 Annoyance (rating ± SEM) Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control

FRAMES – TASK TIME BubbleFrame ShadowFrame Control BlinkingFrame RedFrame 0 1 2 3 sec dominant dominant

FRAMES – ANNOYANCE BubbleFrame ShadowFrame Control BlinkingFrame RedFrame 0 2 4 6 0 1 2 3 dominant dominant dominant dominant

PARTICIPANT’S FAVORITE FRAME Task Time Annoyance Popup Misses Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Task Time (seconds ± SEM) 8 10 12 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control Popup Detection Error (N ± SEM) 0 1 2 3 4 5 Annoyance (rating ± SEM) Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control

MASK – TASK TIME sec Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask

MASK – POPUP MISSES 8 10 12 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control

MASK – ANNOYANCE 0 1 2 3 4 5 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control

TRAILS – TASK TIME CenterSplash WindowSplash Control CenterBeam WindowBeam 0 1 2 3 asymm. asymm.

PARTICIPANT’S FAVORITE TRAIL Task Time Annoyance Popup Misses Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Task Time (seconds ± SEM) 8 10 12 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control Popup Detection Error (N ± SEM) 0 1 2 3 4 5 Annoyance (rating ± SEM) Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash Dark- Mask Control

TRAILS/FRAMES – TASK TIME targets close Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash

TRAILS/FRAMES – TASK TIME targets far Control 0 1 2 3 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash

TRAILS/FRAMES – POPUP MISS. Control 8 10 12 Blinking- Frame Bubble- Frame Red- Frame Shadow- Frame Center- Beam Center- Splash Window- Beam Window- Splash

OPEN QUESTIONS

Does combining frames and trails make better cues?

Does adding additional frame features help?

Will the mask improve with lower opacity (and a frame)?

+ > ? + + > + ? > ?

STUDY 2: CUE COMBINATIONS synergy or interference?

MASK + BUBBLE

CENTERSPLASH + REDFRAME

CS + RED + BUBBLE

CS + RED + BUBBLE + SHADOW

MASK + FRAMES – TASK TIME Task Time 0.0 0.5 1.0 1.5 CenterSplash CenterSplash + RedFrame CenterSplash + RedFrame + BubbleFrame CenterSplash + RedFrame + BubbleFrame + ShadowFrame sec

MASK + BUBBLE Task Time Annoyance sec Control CenterSplash 0 1 2 3 CenterSplash + RedFrame CenterSplash + RedFrame + BubbleFrame CenterSplash + RedFrame + BubbleFrame + ShadowFrame DarkMask + BubbleFrame 0 2 4 6 CenterSplash + RedFrame CenterSplash + RedFrame + BubbleFrame CenterSplash + RedFrame + BubbleFrame + ShadowFrame DarkMask + BubbleFrame CenterSplash Control

PARTICIPANTS’ FAVORITE CUE

OUTLINE

Motivation

Studies

Conclusion

IMPLICATIONS FOR DESIGN

Visual sparseness : Even low-opacity masks interfere w/ ability to detect target by its onset.

Adapt cue by distance : When targets are far, trails perform better than frames.

Use Asymmetric trails : Trails must stand out from rectilinear screen content.

Use subtle features : Even low-opacity frames pop out; dominant features outperform others, but are more annoying.

Use combinations : Combinations of frames and trails perform better than cues in isolation.

THANK YOU! Raphael Hoffmann Computer Science & Engineering University of Washington [email_address] Patrick Baudisch Microsoft Research Redmond, Washington [email_address] Daniel S. Weld Computer Science & Engineering University of Washington [email_address] This material is based upon work supported by the National Science Foundation under grant IIS-0307906, by the Office of Naval Research under grant N00014-06-1-0147, SRI International under CALO grant 03-000225 and the Washington Research Foundation / TJ Cable Professorship.

TRAILS – POPUP MISSES CenterSplash WindowSplash Control CenterBeam WindowBeam 8 10 12 asymm. asymm.