Animating
Direct Manipulation
Bruce H. Thomas Advanced Computing Research Centre School of Computer and Information Science University of South Australia The Levels, SA, Australia 5095 mabht@graceland. Levels. UniSA.Edu.Au
ABSTRACT tion
applied,
can enhance
many
human
particular, in
the
the
real
use to animate scribes
tools
porate
the
that
object.
into
by To
and
used
simple
drawing
on
editor
demonstrates
simple
the
is practical
even
idea,
new
the
sugcan
and it de-
use to easily
of
on standard
ani-
vince
users
animation,
cal interfaces, its,
warp
direct
the
a
The
to this
the
user interface
plore
how
techniques
puter
animation
ing
with
here
with
algorithm
animation
Rather,
we
Permission personal are not right given
wish
as to
enhance to make
to republish,
data,
[15])
toolk-
copies
is granted for profit
of the publication is by permission
of all
~IST 95 Pittsburgh PA USA @ 1995 ACM O-89791-709-x/95/l
be the
(such
as an
using
anima-
of otherwise
static
system
to
the
or part
of this
and its date of the ACM,
appear, Inc. To
reversible can conwith
it’s
Brenda
all
Laurel that
appli-
an illusion. calls
the
manipulation.
but
the
drag
all
times.
on drawing to
object
give to
More
the
too
solid;
used
by
that
mimic
start
move
cartoon
they
stretch
the
moving
the
the fullsolidity
must One
[10]
is to
such
do more approach use
tech-
as inertia
and
of substance.
and than
Cartoon
come
to a gradual
along
straight
to suggest
real
somehow
solid.
effects
slowly
is
the
object.
objects
illusion
rather
and squash
operation than
the object
animators
physical
in curves
to implement
the
as drawing
gives
also feel
where
techniques
a sense of substance;
must
to reinforce
they
such
drag
object
knows
rather
solid-seeming they
niques objects
that
easy to manipulate
widely
friction
the
user
are cheap
schemes
an
continuous
feedback
object
to convey
be convincing, look
the
outlines
during
moving provide
Simple
impression
ambitious fail
of must
so that
a surrogate
object
can still
than
operation
application
is at
tend
featured
stop,
lines,
interaction
with
and their
environment.
of hu-
material
for
the copies tht COpy -
and notice is copy otherwise,
to lists. r~wir~s
sPecific
Although
we have
informal
experience
enhance
the
with had
by
inertia;
wiggle
not
objects. it
if it collides sense
formal
these
The that
For with
distort
other
overall “things
are
our can
interacting
if an object slightly
objects, effect
trials,
techniques
when
example,
might
user
same
of substance
a corner,
as if bumped.
a stronger
conducted
is that
impression
application
dragged
has
as
they
is that
UIST ’95
is if
it
might
the
happening”
user and
1..$3.50
November 14-17, 1995
sus-
applica-
[17]).
interface
without fee provided that or commercial advantage.
fee.
com-
concerned
effectiveness
to post on sewers or to r~distril~ute and/or
and
ex-
of interact-
tools
help
the
to
as would
animation
augment
out
not
or when
animated
apply
or
are
editing
presentation an
digital/hard
or classroom use made or distributed
notice, the title that copyright
permission
the
(such
set
cartoons
we
animated
to supplement
itself—to
from
animation editor
have
the experience
However,
portraying operating
we
borrowed
a computer.
information
[2],
can enhance
case when tion
during
happening
graphi-
common The
object
but
hardware.
the
feedback
To workers
know
which the
and
interacting
they
the
immediate
changes,
[9], is the feedback
to track
dragging.
based
INTRODUCTION recent
identified
characteristics
are directly
illusion,
generates
it seems
other
a graph-
manipulation:
these
though
of disbelief
technique
InterViews
Like
even
Central
animation
manipulation,
transformation,
they
pension
thing.
KEYWORDS:
present
Shneiderman
incremental
applied,
that
data,
tion
[14], of direct
to actions, Properly
Consider
to build
workstation
response
by
inter-
feedback.
that
paper
ingredients
effects.
a warping
of the
it shows
seminal
user
transformation
effectiveness
that
manipu-
we added Interviews
uses animated
and
of
the
his
cation
incor-
a range
view
to the
that
operations,
paper
interfaces,
suggesting
the
the
editor
In
code.
distorting explore
This
programmers
can
their
capability
face toolkit
done.
applications
The Problem essential
strengthening
application
manipulation
is based
transformation
for
is being
that
In
of substance
manipulates,
with
interface.
that
to present.
a feeling
interaction
ical
anima-
manipulation
strive
programmers
effects
effects
lated
work
direct
approach
mation
a user
techniques
of cartoon
of direct
interfaces can convey
that
that
techniques
the illusion
computer
objects
gests some
Our
the
animation
sense
Paul Calder Department of Computer Science The Flinders University of South Australia GPO Box 2100, Adelaide, Australia 5001
[email protected] .edu. au
man
If judiciously
Interfaces
3
that
real
work
is being
done.
niques
is straightforward
some Adding
animation
plication
to
action.
In
being
to
display
and
to
the
object
the
user
tion
also
extra
understanding
the
inter-
suggest
that
the
an
gives of an ac-
the
effects
can
interface,
mer’s
but
task. animation
and
to provide
incorporate
can
toolkit
[11]. and
the
context additions
First
the
can
purpose
hardware.
modified
Finally,
that
in user
of the
project
that
that
In
Prosodic
Interfaces
gestures.
Audible
ment
the
the
addition
sense of presence.
repertoire
the
Gestures
way of issuing of tools their
the
contextual
while
that
interface
and
sounds
the
also
of requirements though basic
for
making
developed principles
in both
in the also
disciplines,
ing
sequences
For
interface
context
apply
to
animations
of images
in rapid
of film computer are
2. The
predefine
4
paths,
the
that
move
application
three
in
fixed
in
stays
an
application
to feel
principles
that
that,
can for
they
apply
of solidity,
these,
when
we
its
are in
to car-
exaggeration,
add
animating
should
principle
in general,
two
more
a direct,
states
at all times
of reluctance reluctant
Adherence
to the
impression
that
and
a
and extend
tion.
that
manipula-
that,
the
remain
object
attached
states
that
objects
are,
maintains
the
to change.
the
illusion
objects
of attachment
user
to the
is always
principle
of substance
requires
effort
of the
of reluctance
by
on the
in control
suggesting
that
part
user.
of the
ac-
reinforces changing
can
a basic
the
applied
animation.
Al-
simple
figures
animation,
the
simple
editing
animation
[8];
rotating.
display-
being
the Effect these
interaction
drawing
by
principle the
Adherence
The such
editor
as lines
such
task
objects
supports and
1 shows
to move
to the
graphical
operations
Figure used
principles
with
editor.
the
polygons,
a slrnple
creation aud
as moving,
a screen
of animatin
scaling,
image
of
it allows
of the
and editor
an object.
succession. Figure
objects
a fixed
leaning
sense of substance
users
an direc-
pointer.
set
created
object,
base
these,
of attacl~ment
cues
programmers
a successful
its
principles
manipulated
sense of di-
will
outlines
to move
the
while like
To
apply
principle
to the
ing [10],
list the
Demonstrating
Book
in the
interface:
being
and
creations.
Anzmutzon
an object,
engage-
INTERACTION
Lay bourne’s
show
allowing
Ungar
reinforcement.
We have
ANIMATING
pull
animator to suggest
distorted
an attempt,
of a greater
still
and tion
and specifying
techniques
an ob-
application
example,
dragging
object
could
techniques
animation:
and
a smoother
commands
three
to move the
com-
20],
improve
can provide
these
[19,
strengthen
how
of an object
a cartoon
For
someone the
the
illusion
toon
an
of human with
can
providing
Together,
use to enrich
is concerned
and
by
project,
animation
reinforcement
interface
expressive
to
to
to drag
example,
should
how
To suggest
of
With
create
by
animator
direction
should
other
a set of tools
the prosody
objects
tries
inertia
a
interfaces.
Interfaces
to provide
project
manipulation
operations.
aims
can improve
interfaces.
with
Prosodic
how
consider
show
pull.
the
Chang
special
we describe
animation
for
for
the
with response
control.
interactions, without
of the
object,
1. The
is part
techniques
more
and
screen,
behaviour.
caused
objects
InterViews
to show
applied
in
Context
work
ongoing
new
such
could
place.
we discuss
the
need
If a user
Or if a user tries
is to
depict
the
techniques
animated
implementation
has considered
Research
the
to create
be successfully
graphics
that
how
to
ani-
InterViews
Then
made
faced
accurate
restraint?
movement
to the prob-
of our
editor.
we
suggest
our
approach
effect
drawing
the
for
the
in position,
approach
would animator
support
into
our
overall
changes
outline
is fixed the
the
represent
its movement?
Our
experience,
can use to easily
built
across
resisting that
with
of di-
of object
Our Approach
interfaces.
we have
rapidly
are
and
behaviour.
ject
tion
can be used
briefly
rect
their
we describe
and
techniques
puter
program-
is at odds
[5] provide
are in control
programmers
the application
suggest
with
to suggest
interactive
of interactions
components,
This
application
programmers
of a simple
components
work
satisfaction
is twofold:
the
into
how
kinds
illustrate
the
the
that
effects
describes
certain
and
to the then,
enhance
tools
mating
toolkit
add
user’s
of the Paper
paper
lem
the
problem,
the
Structure
they
The
how
This
improve
object
Ungar
in the context,
for immediate
realistic-seeming
should
users
application
actions
and
However
where
the need
to user have
on an object.
These
manipulation,
dilemma:
prevent
results
rect
(Chang
examples).
movements,
actions,
information
of the
ap-
objects
by a user’s
of constraints The
the
of the
can
caused
changing.
a better
state
animation
presence
allows
about
current
of change
the
from
also
information
the
the
rate
or it can imply
feedback
more
addition
manipulated,
direction
the
excellent
spontaneously
or along
of Lay bourne’s
tech-
tion not
UIST ’95
2 shows
how
on a rectangle. fully
convey
the
the
editor
Of
course,
dynamic
animates these feel
a move
static
of the
opera-
images
can-
interaction;
we
November 14-17, 1995
. ,,,
,.,.,
,’
f
,.
,: .: ,;
11
$,
,,
,
1$
‘1 ., ,1 !,
!: , :
,, !,,,
”
. .
.“,
.-.
.
.
.
.
-----
-------
.,:, .: “f-~ 1! ?.
Figure 3: Animating
...,, .,,. .,,, ET ~
$..
.,.. !.
!
. ‘o I
,
,,,
I
I i
$: +-.
,.
.
,. ii---!
I ~___
,,,
_. I
,4
,’
Figure
‘-
. .- .:, _ .- -’-~
The
same
,
of effect
For
operation,
and
the
uses
editor
teraction;
the
controlled
by
that
Animating a rotate operation
4:
kind
operations.
lags behind.
..!“’.
...-”
,,.....-
,,,,.. ,,”-
,,,
,
‘
,, .
r ,,
l’:
I
a scaling operation
:>---J
Figure 1: The animated editor in action
,,,,
\
the
control
The
editor
figure
the (For
of the
object while
the scaling
of the
common
a rotation.
strategy
all
other
3 illustrates
same
mouse,
that
for
figure
4 shows
the part
suggests
works
example,
to
In each animate
that the
is
case,
the
in-
‘(grabbed”
bulk
operation,
corners
editor a scaling
of the
is
object
we use an effect
are simultaneously
under
mouse.)
.”..
.!. ”.
.,,;
~,
I ,,
;: ,:
t ,
~ ~
:_,
.
..
-,
,,--
,
-
,,
show the
interaction.
move
,,,> .:
this
,,.,.l. _,::
also supports
how animation
following
a move operation
back
ure
shows
the
rectangle
bottom the point
suggest
the
merely
while
In operation, “rubbery”
the
of the the the object
successive
the
operation
shows
corner
several
effect.
without moves
rectangle bulk that
the
with stays
of the
effect
The
to follow
operation
object
is that distorts
frames top
of
the
attached
to the
as it is pushed
figThe
note
slightly
the
effect;
mouse.
animation; lags
the
animation
of manipulating
November 14-17, 1995
from
how
mouse
the
extra
for
is fixed simply
effects
information
example, in place.
that about
an attempt One
be to prevent
mouse.
of the
to
response
to
the object
from
correctly.
of response.
allow
the object
back
to its original
avoids
this
of visible
feed-
to follow
the problem when
place with
lack
as the result
at the operation lack
surprises
However,
be misinterpreted
the object
attempts superimposed to
that
might
might
“grasp”
interaction
constraining
_-”w
Figure 2: Animating
have
Consider,
an object attempt
simple
can convey
A user before
realising
Another
when lack
but
of feedback, object
to
several
the true
released.
placed
make
strategy
the mouse,
a carefully
might
of a failure
cause
might,
be to
then
to snap
This
approach
but
it
can lead to
suddenly
jumps
back.
behind. a heavy
and pulled.
Figure ing
UIST ’95
5 shows
animation.
how
our
editor
As the user
avoids
attempts
both
problems
to drag
the
us-
pinned
5
Figure 6: Moving under the influence of “gravity” ;#
v
., !.. e, !,,’“’”~
.
, ,
.,!
,,,,.
, ,,
P.***
..
.“., .,-. ,
W,,,.,,,+,..
Our
approach
usual,
Figure 5: Attempting to move a pinned object
but
surface object, the
the
bulk
user
grab
is pulling
in place.
The
object
will
The
move
succeed.
same
effect
For example,
figure
under
the
the
object
to snap
the
object
away
yond and
the
object
teraction
and
to the
it clear
is, what
result, any
snaps
makes what
the
fixed.
gravity next
what
happen
pulls
make
the
animation
them
chose
powerful
the
effects
into
all underlying
the effect
our
determines
editor
mation,
applies
to draw
the object
angle
from
its
to
suggest
be to represent
the responses the a much
effect
the
of the
and
of the in-
points.
images
[22].)
applied
to
a rectangle,
an appropriate drawing
for example,
warping
system,
transfor-
then
rectangle.
proceeds
When
it will
the rect-
appear
distorted.
model: warp;
complex
the code the
approach an approach
that
(indeed,
graphics
this with
draws
effect
will
two
of)
apply
key
based
the warped
is unaware
as to a simple
has
on a
objects
the
presence
as well
to more
rectangle.
the desired
is released
to generate,
toolkit
[11]
because
at
extend
we intoolkit. it
Computing
has
a
the Warp Vectors
warping
transformation
bound
vectors
to key
points
for
points
lated
to include
interaction
with
physical
the
with
a physical
simpler
objects
as forces
of the objects physical
we want.
6
of moving
compared
Again,
state
in the
the
is characterised
describe
do not idea;
by a set of
the transformations
coordinate
space. with
vectors
between
the
vectors.
a later
section
points
that
applied
Transformations
coincide
interpolating
illustrates lation
that
that
by
tors
and the interaction
that
certain
distort
is
and the
are
calcu-
Figure
describes
the
7
calcu-
in detail.
effect.
way
ulating
at
effect
primitives.
simplicity,
when
In the example, One
The sheet,
to
on the screen,
by
The Model would
distorted. a rubber
pulling
as a simple
is displayed
is unaffected
we could
onto
as
of the drawing
as a transformation
it to the
physical
interface
that
warp
To suggest
be-
user
model
drawn
drawing
go”
object
easy
the
“lets
an existing
InterViews
graphics
new
used
Our
corporated
the
by
is widely
then
advantages
time.
We
stretched
technique
Apart
corner
MAKING IT EASY TO USE To
was
(The
pulled
do to achieve
appears
sheet
When point.
view
objects
system
causes
user
grasped
current
if the
an ob-
that
the
manipulated
were
suddenly
grid
the
the user must will
As
point,
stays the
the
on objects.
field
grid.
the
the
coordinate
attempt
of moving
of a ‘(gravity”
object
is
shape.
effect
to a regular
distance,
the
so that
draw
the
as if the objects
We implement
user
is released,
constraints
the
a grid
the
that
point
but
is as if
is anchored
that
but
grab
other
6 shows
the
clear
mouse
effect
that
to its original
from
while
The
it
object, the
influence
a certain
feedback
the
can suggest
ject
stretches
makes
back
to the
fixed.
of an object
When
spring
attached
stays
feedback
to
not
stays
object
on a corner
attempting will
point
of the
is to
to warp
acting could
objects
be determined
system.
However,
model
is sufficient
our
points
model
on the objects.
are
are
depend
Then
grid
transformed
by
transformed
on their
relative
the by
coincide
specified
with
intermediate
distances
warp
amounts.
from
vecOther
amounts
that
the specified
vec-
tors.
by sim-
experience
to produce
is the
To need
add
animation
only
calculate
appropriate
warp.
UIST ’95
to
the
interaction,
a set of vectors We
have
found
November
then, that that,
the
editor
characterise for
the
an kinds
14-17, 1995
......
! ,
.
new . .. ..
.
,
, , , ! of shapes
and
algorithm in the
operations
gives
very
interaction,
we have
convincing
investigated, results.
we calculate
the
....................
a simple
For each
warping
! ... . ..
frame
vectors
as
follows:
1. Compute
the new positions
of the vertexes
of the shape
as usual. , 2. Place
a zero
grasped 3. Place
by the
at each
other
of that
vertex
8 shows dashed
new
positions.
the
point
by
the
rectangle
idea dots
(in
its
top
that
vertex
that
cases, of the
show
is
other
zero the
...
old
and
vectors
..
Figure 8: Calculating warp vectors for move and rotate
at
has been
arrows
warp
shape
under
its
rectangle
and
back
frame.
operations.
at
the
the
the
be drawn
points
and rotate
corner),
sizes
will
previous
a rectangle
both
strokes
that
in the
represent
right
and
solid
the
vertex
for move
show
The
positions
nally,
the
outlines
mouse
grasped
at
mouse.
position
The the
vector
a vector
to the
Figure
magnitude
show
vectors.
of the
Fi-
distorted
the warped
transfor-
mation. Although
the
physical
model,
sion
that
weights
effect
the
this shape
attached
behind
the
elastic
vertexes
that
the
to
material,
cause
a
impreswith
them
to lag
class
the
warping
user interface InterViews
this
capabilities original
tion.
Figure
with
the
such 9 shows
transformation.
part
a new Since
to coordinate
object
to add
all
of the we
only and
class interface,
added
to
support
rotate
void
scale
(float
void
translat
void
warp
(float
a) ; x,
e(Coord
float x,
y) ; Coord
y) ;
(Warp&
w) ;
//
new
method
void
transf
orm(Coord&
x,
Coord&
y) ;
warping 1;
scaling,
void
. . .
transfor-
supported
as rotation,
that
to
objects.
Transformer
method
. . . {
we ex-
by adding
was sufficient
to all InterViews
transformations
Specifically,
model
is subject
addition
as an extension
toolkit.
a warp
mation,
one
model
drawing
of transformation: in InterViews
Transformer
public: . . .
our
drawing
warping
of
exactly
gives
interviews
the InterViews
The
correspond
algorithm
is made
to the
We implemented
kind
not
movement.
Extending
tended
does simple
affine transla-
““”
Figure 9: Extension to Transformer class
together the
new
transformation.
November 14-17, 1995
UIST ’95
7
most class
Warp
{
common
mations
case),
when
but
it allows
for
arbitrary
transfor-
necessary.
public: void
Warpo;
virtual
This add_vector
void
Coord
Coord
x,
Coord
VX,
(
y,
Coord
generalisation
how
even
more
porated
vy
we
into
have
the
not imagine
could
be used to suggest
eye”
transformation
Transformer Warp
u; 80,
w.add_vector(O,
80,
w.add_vector(O,
O,
0, -10,
-10,
w.add_vector(100,
O,
drawing
InterViews affect
-10);
that
nents
-10);
can
warping
-10);
class
contains
no
the
vectors;
positioned
nents
vx
and
vy.
putes
example, lowed
pings
figure
11 shows
of figure
8could
steps
of affine
might
represent
Because
of this
a single
the
Transformer
aggregate
is that
any
property, modified
the
warp
be represented
the
mapping
of the
isnot
get
the
such
These full
to
additions
components,
operations.
and
changes
our
as
compo-
benefit
of the
transform
is a weighted
q
and
a set
pi{
transformed
Algorithm the
and
warp
point
transformation
com-
a displacement
vector
average
of the
warp
of warp
vectors
pi
a displacement
point
vectorsl. (each
p~d),
For
defined
we compute
a by
the
q’ as follows:
n
q’ = q + ~ Wqipid
of
a scaling
fol-
One can
However,
InterViews
as-is
the new warp
minor
i.=1 where Cqi
char-
Wqi
=
~
be com-
E
coordinate ofaffine
Cqj
j=l
map-
operation.
Transformer
stored
transformations to reflect
mations
are
while warp
and
on
the
transformation of the represents
into
new
Cqi
The
new the
in turn. original only
This
matrix
Transformer: list
of items
implementation transformations
The
q
it
im-
keeps
transfor-
item
are represented
implementation affine
affine
combicannot the
so that
successive a single
through
andso warping
We modified class
transformations
items.
iterates
matrix.
items;
combined
warp
affine, involve
Transformer
of transformation
efficiency
each
the
For
matrix
matrix
that
as a single
plementation
method
sequence
successive
of transformations
vidual
they
the original
3 x 2 matrix;
how
a
other.
in a homogeneous as a single
non-
l/lq
=
pil[
–
operation.
However, nations
the
by a rotation.
mappings products
with
a succession
one after
be represented
only
a list
represents
followed
or a “fishunder
adding
required
drawing
of
reachieved.
applied
as a consequence, can
8
example,
a Transformer
as matrix
system;
former
adds compo-
a Transformer
acteristic
be used
a location
initially
and
by a translation
puted
Warp:
point
exthat
operations.
for
point
vectors;
object
:add.vector
For
mapping
of warp
Warp
(z,g)
the
effect
Conceptually,
a set A
calling at
transformation
discrete
represents interface.
For
drawings, objects
class,
code.
existing use the
implementation
that
vector
Warp
the
do not
Figure 11: Applying a warp for a move operation
Warp
although
stage.
transformation
displays
The Warp Transformation
10 shows
model,
this
perspective
to InterViews
Our
new
at
point”
that
to the new
glyphs,
t.warp(&w);
figure
a “vanishing
transformation
O);
-10,
graphics any
suggests be incor-
MAKING IT WORK
t;
w.add_vector(100,
class could
scaling.
In addition
fore,
InterViews
““” Figure 10: The new Warp class
Transformer
implemented
ample,
uniform
the
of transformations
);
};
The
of kinds
as beby indi-
coefficient
to the
tation,
cqi represents
transform we
distance
vector
compute
the
distance
tion
ensures
[0, 1], and
is zero that that
and
pil
(the
vector
sum
implemen-
reciprocal
undefined
specially). weights
of the
of the point
current
as the
is treated
the the
“closeness”
in our
closeness
q
between
the Pil;
This
remain
weights
of the
case
when
formula-
in the range
is 1.
: transform applying
each
retains if the
the
Trans-
Apart gorithm
from
its simplicity
and
complexity
O(n)
has
implementation
(by far the
UIST ’95
10ur
colleague
of the Murk
warp
Bottema
relative for leads
(the
vectors),
to several
suggested
November
efficiency
n warp
alour
properties
the algorithm.
14-17, 1995
that
simplify
a desired
the
warp
selection
of a suitable
set of vectors
for
solutions have
effect:
to this
been
used
Performance 1. Points
coincident
displaced
with
by the
one
amount
of
the
of that
warp
vectors
are
vector.
Drawing than
equidistant
by those
from
two vectors
are affected
equally
vectors.
drawing about
3. In
the
limit,
the
approaches
the
combined
vector
affect
of
distant
vectors
average.
To
understand
why
of the
proaches
one of the
without
bound;
weights
approach
with
pl i only
properties
locations,
O. In
with
the
vector
the
Cq, become
pli,
Wqi approaches limit,
will
if q becomes
compared
hold,
equal
and
the
all
for
carried
the
all
Wqa approach
then
l/rr.
InterViews
drawing
class,
which
ing operations Canvas and
filled
paths);
and
Extending
straight
lines
had
draw
on
text
required
remain
[7].
stroked
PostScript-like
(which
tion
and
only
a line
segment, the
a slight the
new
Instead,
points.
bisects
the
we
segment
can be approximated
To
the
the segment
original
no longer
use
algorithm
until
by straight
the
longer
even
as the How-
1 client)
graphics the
loaded
Xl
imworksta-
For example, Xl
on
hardware,
of around
when
(such hold.
standard
performance.
rates
addi-
assump-
a straightforward on
special
One
calculation
generation
10 per to
a we
second
1 connection
ethernet
conditions.
These
complex
frame
was
a separate
The
idea
is to look
time
the
for equal
of the computation is redundant we
use
magnitudes,
can
the
For example,
consider 12).
adequate
systems.
speedup
that,
we have
in the
war-p
vectors.
warp
is applied.
In
be avoided.
common
ation
(figure
loaded
vectors such
can
the warp
Since
computation
of the
q’
q +
the
warp
often
have
be significant.
vectors
Ipl I =
at
cases,
displace-
Since
manipulations
benefit
for
be important,
of the transformation
and for
will
magnitude
transformation
ment
transfornlaalgorithms
or to maintain
on heavily
on symmetries
some vectors
techniques
transformation
relies
of approaches
warping
drawing
objects,
rates
class of warp
a range
of the of the
O and
for
a move
oper-
pz = p~ = p.I = P,
transformation
simplifies
as fol-
lows:
the
we can an
the
implemented
the
end points Because
even
we have investigated the
drawing
equal
that
transformation.
is non-a fine,
assumption.
the
mollifi-
property
therefore,
to transform between
recursively
after
under
no
a moderately
animation
the
are based
figures
have
straight
path
merely
that
that
drawing:
path-based
transformations
transformation
sections
of
and
the
of PostScript
based
images,
to draw
a straight
warping
forms
by
to a set of draw-
to those
are
transformation
make
speeding
common
images).
Atfine
and
basic
(which
stencils,
cation.
draw
two
Canvas
warping
is implemented
an interface
are similar
figures
on bitmapped
model
defines
that
supports
Canvas
for
when
Canvas
view
no
expensive of the
certain
distorted
(a standard
frame
objects,
because
algorithms
editor
more
because
lines)
has adequate
Nevertheless,
Drawing The
the
2 with
on
that
server.
vectors
vectors,
of the
animation
simple
and
is that
our
Sparcstation
all
other
of
we ran
achieved
graphics
“straight”
hardware
Cgi grows
transformation. from
between
q ap-
q is coincident
distant
thus
then
when
the
If
1 while
affect
very
distance
consider
as q varies.
techniques
[22].
is necessarily
step
experience
plementation tion
weights
vector
thus
that
Conversely,
all
these
vector
of
our
when
behaviour
graphics
properties
straightness ever,
as other
images
non-warped
transformation
tions
such
warping
Issues
warped
tional 2. Points
problem, for
n =
~
‘wqiF)i
;=1
warped
n
lines.
=
!7 +
Wqlpl
+
Wqin
~
i=2 Drawing
image-based
original
Canvas
graphics
ages and used a standard populate inal warp
However,
not,
pute
an approximation
forming
age and filling image.
Our
results
under
demonstrate
with not
because
in general, the
image we can
transformations
does
built
have
pixel
the corresponding some
algorithm warp
the effect
warp
trans-
in the original
is slow
of the warp.
November 14-17, 1995
and produces but
q + P(wqz
=
Although
im-
area in the transformed
conditions,
iE2 + wq3
+ %4)
for
we comby
q+o+P~wqi
to
the orig-
transformation image
n — —
im-
approach
Instead,
warped
of each
from
use this
the
The
scheme
data
an inverse.
to the
coordinates current
difficult. transformed
back-transformation
the transformed
image.
is more
implementation
ear
reduces ing
the
in the
complexity
number
the number
and scaling,
symmetries
of the
of vectors,
algorithm
the
of arithmetic
some
and
thus
occurs the
lin-
computation
operations.
simplification
are fewer
remains
simpler
benefit
For rotatalthough
the
less.
poor
it is sufficient
We are investigating
to
Another stitution
UIST ’95
technique of a more
that
we have
easily
drawn
investigated shape
for
is the subthe
warped
9
of suspended interface 1,
L
dtsbeltef
move
smooth
motion
ions
of the
willingness
. .
.........
/
P3
..
P4
Lasseter to
stitute then
of path-based
graphics
a Bezier
curve
for each segment
of a warped
curve
as if no warping
were
draw
this
the
way,
mation
we only
when
the
calculating
a considerable the
incur
cost of the
the control
saving
transformation
One
over
the
at many
idea
is to sub-
warping
as a cubic
if a warped Bezier
curve,
transformations instead ing
(the
anticipation, through
The
conditions,
but
curve
warped
Ieads
to
dent
visual
remaining
modifications
mating
path
promise
for
and
appeal.
their
technique,
with
a compromise
such
several
between
animated
warp-
warp curve
to
which
thinking
describes
in relation
interfaces.
The
an overview applies that
material
that
and
accu-
of other for
Basic Animation her
that ing
book
the
to facilitate closely
of the the to
the
agent.
of these
10
as
and
how
a look
at some
systems
their
interfaces;
and
interface
designer
toolkits
the
are
Laurel
active goal,
effort
advocates interest effects;
can for
and
basis
of our
an-
concerned whereas
interactive
operations. that
work on
Card,
good
how
interactive
load
from
The
Self
style
tree
is
makfor
akin
although
to
they
system
with
status
feedback
for
animation.
In wall
can shift, to the
perceptive
dissolves, out,
a
of the goals
and
drawing,
and
are manipulating
on current
technology;
they
techniques
to achieve
sufficiently
but
only
expense
of a limited
and
types
the
stretch,
through,
solid
tion
[5] de-
and
the
was its practical
tion
show
cartoon-
Ungar
follow
to strengthen
of the system
[12]
system.
squash
anticipation, arcs
the
relies
processing
supports
Chang
uses solid
in
particular,
the user’s
environment
techniques.
programmers
Mackinlay visualization
perspective
the
cognitive
Self
and
and
programming
at
is
interactive
blur,
that
paper
technique
for
information
animation
the
how
feedback
Robertson,
[13]
animation
scribe
with
ani-
with
manipulation
as feedback,
dimensional
cone
this and
Our
an-
and
use animation
of
the
taxonomy,
direct
Baecker
process,
we are concerned
slow
it
interface
to
chiefly
[2],
can play:
of function,
animation
in and
workthat
objects.
One
implementa-
use colourmap high
slow
impression
anima-
refresh
choice
rates,
of colours
of animation.
as of
enhance the
Several
workers,
Bharat
and
the
participation
example
secothers,
argues
to collaborate
be used
of
of
their
for
motion
the use of dramatic and
pose-to-pose many
animation
comprehensible.
it
that
agents
of an application’s
Animation
dramatic
[9],
common
in their
Laurel
engage
Thea ire
human some
agents
techniques some
graphical
to achieve
as possible.
human
into
categories: and
Techniques
computer
goal
in three process
to
animation.
Computers
together
is the
interfaces;
our
of animation
animation
and
ut the Interface
By
monitoring
heavily
curves,
has influenced
application
animation
support
that
is arranged
basic
to graphical
presentation
work
to the
of the
incorporate
include
In
other
and and
exaggeration,
as the
roles
animation more
area of three
RELATED WORK section
ArL -
stretch
with
animation
feedback
notion
The
are investi-
performance
with
Systems
as coinci-
structure,
interfaces
their
racy.
This
ahead arcs,
principles
several
of function.
ing
as approxi-
Bezier
Computer
overlapping
Along
Animation
outline of
4 warp
“mild”
We
these
article
Small
points)
warps,
).
to 3D
tech-
Principles
imations.
only
(such
coincident
to the
segments
artifacts
straight
action,
concerned
the true
“severe”
action,
ondary
represented
of the Bezier
degenerates
paper
staging,
slow-out,
imation
control
under
screen.
animation
his
Applted
and
are
well
basic in
expectat-
to an increased
on the
a set of 11 principles:
slow-in
and
need.
the approximation
not
two that
reasonably
unsatisfactory
points
gating
typically
works
the
compute and
transformations
would
approach
we would
This
agent’s
leads
to apply
action,
In
of computing
were
which
timing,
adopted
human
animation
He lists
of an
fashion.
transfor-
points.
segment
end points
of the many
algorithm
path
how
graphics
realistic
is shown
Animation
squash,
mation For example,
what
[8].
we have
In
of the curve,
cost
in-between
path,
present.
points
usual
world,
imution follow [21].
physical
computer
if the
and
to the
to accept
of Traditional
Figure 12: Symmetry of Translation Vectors
figures
is closer
considered
niques
/
is improved
in a smooth
effect
context
have
shown
more
quickly
including
Sukaviriya of an that and
on-line accurately. icons
about
and
the
UIST ’95
nature
have help
animation
der used animated the
Sukaviriya [4],
and
explored system.
helped
[3], which
[17] and
animation These
convey
Baecker,
use of the
Foley
information
Small,
offered programs
in
studies
and
Man-
animated attached
icons.
November
14-17, 1995
help to
Finally,
HyperCard
niques The to
to
help
system use
[1] uses some
smooth
offers
to
several
animate
dissolves,
the
animation for
between
resizing,
and
tech-
between
mechanisms
switching
iris-like
simple
transitions
states,
stack
cards,
panning
builders
as colour) fluence on the
Toolkits
[6]
offers
animation
animation
application
techniques
squash
through,
dition,
and
animation
grammer
slow-in
Pacers
path
the
[18] address
taining
the
plex
graphics Pacers
ject,
pacer
the
object
the
on
might
omit
time
are
draw
fash-
resources.
grained
work Flinders
the
members
been
IRIS
scale
rendering
primary
and
goal
real-time
is to support
on high-performance signed
is a high-end
graphics
as a graphical
user
with
mation
three
2. Ronald the
in graphical
of
ciples
how
effects
based
on
the
“real”
a new a set
of warp
can
field
ing
de-
4.
of ani-
animation
into
interfaces,
use
to
vectors
impression
and
it
graphics
of an existing
demonstrates
feedback suits
need
Systems,
Krishna
can
be
Bharat
effects
that,
helped
improve
Computers
Small.
Inc.,
Animation editor,
MA,
at
The
Design.
Reading,
Small,
and
In
Art
Addison1990.
1–6,
Richard
Mander.
Proceedings
on Humun
and
of
Factors
ACM
In Coli!pnt -
1991.
Piyawadee
interfaces
Interface
using
ACM
Sukaviriya.
animation and
Ani-
servers.
SIG GRAPH
Sofiwur-e
users
In
Symposautn
Technology,
pages
of animation the effects
and to
of the ACM
David
the
user
Unger.
SIG GRAPH
Soflwure
unrt
Animation:
interface.
In
Proceerl-
Sympostum
Technology,
on
pages
User
45-55,
1991.
the
into user
cost
of
even
on
how the
and standard
7. Adobe
animated
that
good
reusable
re-
und Systems
1985.
Lasseter.
on the of other
November 14-17, 1995
user’s
.perception .
aesthetic
elements
of the
9. Brenda
such
Wesley
UIST ’95
3D
on
pages
User
57-67,
PostScript
Addison-Wesley,
Principles
robust, of the Int erfuce
1991. Lunyuuge
Reading,
of traditional
Anaheim,
Animation
Flexible, Proceedings
Symposium
computer
35-44,
Stasko.
In
Incorporated.
sachusetts,
to
T. toolkit:
Technology,
Manuel.
applied
John
abstractions.
Reference
8. John
workstation
and
SIG GRAPH
software
new
toolkit.
drawing
Hudson
in a user interface
ACM
effects
underlying
interface
and
prothe
E.
support
operation
application
describes
be prohibitive,
achieved
Chang cartoons
‘87’, pages
(like
the
and
1991.
ACM The
for
work,
Laurel,
life.
of the
Interface
hardware.
interface
Ian to
pages
user
User
ings
ma-
that
animation
incorporated
that not
that
incorporate
was
3. It
at, Flinders
Interface
Conference
69-79,
prin-
of direct
transformation
transformation model
thank
objects.
geometric
grammers their
Ian
Co.,
icons
6. Scott
based
from
We
this
Apple
Brenda
Baecker,
mating
the illusion
by strengthening
defines
group for
comments
and In
Publishing
CHI’91
its
it is not
to the
on cartoon
to enhance
are manipulating 2. It
a grant
interfaces:
can be used
nipulation
research
Human-Computer
From It shows
by
paper.
Baecker
.5. Bay-Wei 1
in part
HyperCard.
interface.
Wesley
toolkit.
contributions
an
to use.
of Research.
context for
Atkinson.
on
makes
and
make
1987.
CONCLUSIONS work
TGI
of this
Proceedings This
childish
it, can
applications
workstations;
interface
seem
enjoyable
Board
reviewers
presentation
1. W.
full-
However,
interactive
of In-
or draw
toolkit
animation. 3D
uses
uses of animation.
applied,
supported
of the
3. Ronald
[16]
disasters
bad
REFERENCES
ob-
instead
Inventor
and
in-
possible;
great and
will
sensibly
a stimulating
Bringing The
equally
bad
this
are
good
animation
But
University
anonymous
For
a solid
detail
and
graceful
has
providing
quality
to draw
more
This
com-
in a timely
presentation
available
fine
mainthere
to fully
away.
the
the
when
to user input adapt
proalong
of automatically
is insufficient
outline
aspects the
function.
resources
depending
if there
an object
time
of an animation
and respond
graphics
allow
problem
rate
dynamically
example,
timing
functions
of a graphical
computational
ion.
of the
the
frame
insufficient
speed
to a non-linear
In ad-
to control
These
applied,
users
hand,
ACKNOWLEDGEMENTS
and
transitions.
are good
one
of
blurring,
anticipation
slow-out
functions
a choice
motion
trajectories,
effects.
to map
a curved
as simple
arcing
it uses pacing
of the
are
interface programmers
such
and stretch,
follow
that
as there
appropriately
that support
Artkit
it warns
so there
the
improvements
Just
colour,
drive
On
great
hand,
one
to another.
that
other
can
card
be profound.
happen.
including
from
can
suggests
graphics.
In
CA,
July
Mas-
animation SIGGRAPH 1987.
ACM,
Press. Laurel. Publishing
Computers Co.,
us Theutre.
Reading,
MA,
Addison1991.
11
10.
Kit
Laybourne.
lishers,
The Animation
Inc.,
New
York,
Book.
NY,
Crown
Pub-
17.
Piyawadee pling
1979.
Sukaviriya
context-sensitive 11.
Mark
A.
Calder.
Linton,
John
Composing
IEEE
Computer,
Jock
D. Mackinlay,
M.
Vlissides,
user interfaces pages
8-22,
and
with
Paul
R.
the
InterViews.
February
art
K. Card.
text
The
smoothly
CHI’91 ing
George
G. Robertson,
Perspective
integrated.
Conference
Systems,
Wall: In
on Human
pages
173–179,
ACM
face
George art
G. Robertson,
and
Stu-
K.
tions
Card. of
Cone
trees:
hierarchical
of ACM
CHI’91
Steven
H. Tang objects.
and con-
GRAPH
Proceedings
of A CM
and
Fuctors
19.
Computing
Animated
Systems,
pages
and
3D In
information.
Stu-
Shneiderman.
beyond pages 15.
John tem
programming 57–69, T.
visualizaFactors
20.
Paul toolkit.
S.
Bruce
September
In Andreas
pages
192-200,
ACM,
ACM
step
kit
IEEE
Paepcke,
Washington
editor, D. C.,
of
User
Ir~ter-
152-166,1990.
A. Linton.
on
pages
35–43,
Pacers:
of the
User
and
sys-
21.
Computer,
a 3D
Interaction
Special
Time-
ACM
Interface
SIG-
S(jfiwure
1991.
R. Calder. In
of Australia,
203-208,
Melbourne,
Nov
An
Proc.
Interest
Society
Bruce
H.
Thomas
widgets The on
animated
Computer
Group
Hu-
of the
H.
1995
22.
Press.
Russia,
Thomas
InterViews
West
and Information
Intern
Wolberg. Society
Ani-
Calder. toolkit.
In
utzonu[
Conferpages
88–
1995. Paul
R.
manipulation
Report
February
R.
Interaction,
and
puter
Computer
Paul
the
Jul
for direct
Technical
George
and East-
gons.
Australia,
’93, 1993.
Bruce
in
Graphi-
of simple
CIS-95-007, Science,
Calder. School
University
poly-
of Comof South
1995. Digital Press,
Image Los
Wurping.
Alamitos,
IEEE CA
USA,
1992.
12
Er-
‘~4, pages
OZCHI
1994.
Human-Computer
cal feedback
graphics
00PSLA October
and Paul
InterViews.
gonomics
ence
1990. Inventor,
of
Proceedings on
pages
Proceedings
for
Proc.
Computer,
A framework
IRIS
In
H. Thomas
107, Moscow,
animation.
Strauss.
IEEE
A
1983.
TANGO:
algorithm
Technology,
Cou-
in
1991.
manipulation:
languages.
August
Stasko.
for
23(9):27-39, 16.
Direct
In
Symposi,urn
Symposium
mating 14< Ben
help.
and Mark
Technologyl
man
Proceedings
on Human 189-194,
Foley. generation
in Comput-
D. Mackinlay,
Conference
and
elastic
Detail
1991.
Jock
SIG GRAPH
D.
automatic
animated
Soflware
widget 13,
James
with
1989. 18.
12
and
a UI framework
UIST ’95
November
14-17, 1995