patrick baudisch microsoft research, ASI, interaction focus

1
phosphor

• patrick baudischmicrosoft research, ASI,
  interaction focus
• desney tan, maxime collomb, dan robbins, ken
  hinckley,maneesh agrawala, shen zhao, gonzalo
  ramos

2
demo
3
visual language
4
performance benefits
5
motivation
6
people operating GUIs make mistakes
7
asking every time can be slow
8
andusers have troublefollowing whatothers are
doing
9
Expose
animation can help
10
but animation oftenforces users to wait
11
animation
past

• can we do without the lag?

12
phosphor
13

• phosphor transition
• show outcome of the change instantly and
• explain the change in retrospect usinga
  diagrammatic depiction

14
animation
animation
past
future
15

• animation
• explains transition first and then shows outcome
• phosphor
• explains transition and outcome at the same time
• phosphor lets users choose whether to attendto a
  transition or to ignore it

16

• afterglow (specific case of phosphor effect)
• show previous state and
• show how it changed

17
demo
afterglowfades over timemultiple on screen
18
users benefit

• 1. afterglow visual buffer for changes
• ? helps users follow activities in bursts
• 2. afterglow has (almost) no notion of time
• ? users read transitions at their own pace
• 3. afterglow can be read back and forth
• ? helps undoing undesired changes

19
designers benefit

• users choose to attend to transition wait never
• giving extra time (to the inexperienced) is cheap
• free application designersfrom hand-optimizing
  animation speed(just pick reasonable upper bound)

20
however

• susceptible to clutter

21
related
22
animation
cartoon animation
chang93
thomas01
23
photography
chrono photography
marey 1878
24
photography
25
comics
26
comics
understanding comics
mccloud93
27
storyboards
Joshua Siegel
28
non-photorealistic rendering
games
haller04
29
visualization
APEX
feiner85
30
visualization
lithium
hobbler04
31
visualization
action synopsis
assa05
32
visualization
chrono volumes
woodring03
33
user interface
transient visual cues for scrolling
kaptelinin02
34
user interface
mac os x
35
user interface
high density cursor
previous cursorposition
current cursorposition
baudisch03
36
user interface
telepointer traces
gutwin02
37
user interface
MAUI groupware toolkit
hillgutwin03
38
user interface
mnemonic rendering
bezerianos5min ago
39
user interface
drag-and-pop
baudisch03
40
?questions

• can we apply comic transitions to GUI
  widgets?
• what visual language?
• are there performance benefits?

41
phosphor
42
(No Transcript)
43
space for time

• 1. envision animated transitions
• 2.project along time axis

challenges 1. show temporal order 2. avoid
occlusion
44
names
initial state
path
target state
45
styles
strobe
blur
speed line
less clutter, better sense of direction, better
readable if overlap,
46
showing time
fading
stacking
initial
47
action
move
copy
temporary
file
extract
48
stationary
addingverticalmotion
initial animation chang 93
49
reveal initial
reveal initial state
omit path
50
out-of-band
transparentto opaque
50 alphato opaque
51
multiple
overlap is not a problem
avoidance
52
multiple
shorten paths
single path
terveen clans
53
implement
54
delphi
55
flash
56
study 1
57
task
58

• interfaces
• with phosphor vs. without phosphor
• 12 participants (1 female)

59
performance benefits
60
study 2
61
task
62
Error
Time - Interface x Task
phosphor
animation
phosphor
animation
Time - Interface x Outcome
Error
phosphor
animation
phosphor
animation
63
end

• patrick baudisch
• patrickbaudisch.com

64
large screens
staticanimation
tablecloth
dragpop
fc screens
mouse ether
hd cursor
65
...swooooosh
66
the problemwith animation

• animation in the UI can help users follow
  transitions
• right speed is crucial
• too fast ? error rate
• too slow ? task time
• right speed also depends on familiarity,
  distraction
• ? we cannot determine the right speed

Expose
Media Player
67
this time generalize
68
visual language prototype
scale
opacity
spawn child window
extract
null operation
rotate
temporary move
avoidance
copy
69
GUI manipulations
?help remotecollaboratortrack what I do