Animation

PresentedByTimothyChan

Outline
1. PrinciplesofTraditionalAnimation
AppliedtoComputerAnimation
(Lasseter,1987)
2. Animation:Canitfacilitate?(Tverskyand
Morrison,2002)
3. OnCreatingAnimatedPresentations
(ZongkerandSalesin,2003)

Overview:TraditionalAnimation
Early2DAnimation:Usedtraditional
techniques
Early3DAnimation:Neglectedtraditional
techniques.
Understandingthe11Fundamental
principlesoftraditionalanimation
techniquesisessentialtoproducinggood
computeranimation.

1.SquashandStretch
Teachesbasic
mechanicsof
animation.
Definesrigidityof
material.
Importantinfacial
animation.

SquashandStretchCont.
Canrelievethe
disturbingeffectof
strobing.

2.TimingandMotion

Givesmeaningtomovement.
Propertimingiscriticaltomakingideasreadable.

Examples:
1.Timing:tinycharactersmovequickerthan
largerones.
2.Motion:candefineweightsofobjects.

Heavyvs.LightObjects

QuickTime and a
Video decompressor
are needed to see this picture.

QuickTime and a
Video decompressor
are needed to see this picture.

3.Anticipation
Preparationforanaction
Example:
Goofypreparestohitabaseball.

4.Staging
Aclearpresentationofanidea.
SomeTechniques:
1. Usemotioninastillsceneoruseofstaticmovement
inabusyscene.
2. Useofsilhouettes (to the side)

5.FollowThroughand
OverlappingAction
1.FollowThrough
Terminationpartofanaction.
Example:afterthrowingaball
2.OverlappingAction
Startingasecondactionbeforethefirsthascompleted.
Example:LuxoJr.shopwithoverlapping
actiononchord.

6.StraightAheadActionand
PosetoPoseAction
1.StraightAhead
Animatorstartfromfirstdrawinginthesceneand
drawallsubsequentframesuntiltheendofscene.
2.PosetoPose
Animatorplansactions,drawsasequenceofposes,in
betweenframesetc.

7.SlowinandOut
Spacingofinbetween
framestoachieve
subtletyoftimingand
movement.

1. 3dkeyframecomp.Systems
usessplineinterpolationto
controlthepathofanobject.
2. Hastendencytoovershootat
extremes(small#offrames).

8.Arcs
Visualpathofactionfornaturalmovement.
Makesanimationmuchsmootherandless
stiffthanastraightline.

9.Exaggeration
Accentuatingtheessenceofanideaviathe
designandtheaction.
Needstobeusedcarefully.
Example:LuxoJr.made
smallertogiveideaofa
child.

10.SecondaryAction
Actionthatresultsdirectlyfromanotheraction.
Usedtoincreasethecomplexityandinterestofa
scene.

Example:
Bodymovementistheprimary
action,facialexpressionisthe
secondaryaction

11.Appeal
Referstowhatanaudiencewouldliketosee.
Charactercannotbetoosimple(boring)ortoo
complex.

Examples:
Avoidmirrorsymmetry,
assymmetryisinteresting.

WhattechniquesusedforWally
B.?

WhatdoyouthinkWallyBs
goingtodo?

TheAction:
Zooooooooooommmm!

Termination:Poof!Hesgone!

RoleofPersonality
Animatorsfirstgoalistoentertain.
Successofanimationliesinthepersonalityofthe
characters.

Conclusion
Hardware/Softwarearesimplynotenough,these
principlesarejustasimportanttoolstoo.

Critique
PROs
1. Clearandconcepts
explainedwellwith
picturesand
examples.

CONs
1. Needmoreexampleson
badanimation
2. Whatreallymakesgood
vsbadanimation?Need
tomakeabetteroneon
onecomparison.
3. Personalitysection:isit
necessary?

Outline
1. PrinciplesofTraditionalAnimation
AppliedtoComputerAnimation.
2. Animation:Canitfacilitate?
3. OnCreatingAnimatedPresentations

Overview
Graphicshavemanyadvantages.
Whatmakesgraphicseffective?
1.CongruencePrinciple
2.ApprehensionPrinciple
CanAnimationfacilitate?

AdvantageGraphics
1. Helpincommunication.
2. Maysavewordsbyshowingthingsthatwouldotherwiseneedmany.
3. Externalizeinternalknowledge
I.Reducestheburdenonmemoryandprocessingbyoffloading.
II.Makesunderlyingstructuresandprocessestransparent.
4.Usedcarefullycanfacilitatecomprehension,learning,memory,
communicationandinference

Graphicsarenotalwayseffective.(textvsgraphics)

Criteria1:
CongruencePrinciple
Thestructureandcontentoftheexternal
representationshouldcorrespondtothe
desiredstructureandcontentoftheinternal
representation.

Animation
ByCongruencePrinciple:shouldbenaturalwayfor
conveyingconceptsofchange,justasspaceingraphicsisa
naturalforconveyingactualspace.
Appeartobeeffectiveforexpressingprocessesie.Weather
patterns,circuitdiagrams,orcirculatorysystemsetc.
Compellingandattractive

EvaluatingAnimation
Needstobecomparedtographicsthatdo
notchangewithtime,asitischangewith
timethatanimationadds.
Howwelldoesanimationteachcomplex
systems:mechanical,biological,physical,
andoperational.

SelectiveReviewofResearchon
Animation

IncomparableContentinStaticand
AnimatedGraphics
Examples:
1. Circulatorysystem(Largeetal.,1996)animatedhad
bloodpathways
2. ElectronicCircuit(ParkandGittelman1992)animated
showedfinestructure.
3. Pythagoreantheorem(ThompsonandRiding,1990)
papergraphicequivalenttodiscreteanimation,butnot
equivalenttocontinuousanimation.

IncomparableProceduresIn
StaticandAnimatedGraphics.
1. InteractivityversusAnimation
2. PredictionversusAnimation

Whytheconfusion?

Successofanimationduetoadvantagesofextrainformation
conveyed,ratherthananimationoftheinformation.

Animationisattractiveandexciting.

Criteria2:
ApprehensionPrinciple
Thestructureandcontentoftheexternal
representationshouldbereadilyand
accuratelyperceivedandcomprehended.

WhyDoAnimationsFail?
1. Animationsmaybehardtoperceive.
2. Animationsmaybecomprehendeddiscretely.
3. Notuniversallypreferredandoftenrequire
expertiseforunderstanding.

ConclusionsandImplications
1. Manyapparentsuccessesturnoutnotto
besuccesses.
2. CongruenceandApprehensionPrinciples.
3. Interactivitymaybekeytoovercome
animationsdrawbacks.
4. Animationmustbeusedwithcare.

Crtitique
PROs
1. Goodoverviewof
whereanimation
researchis.
2. Clearlywritten.
3. Wellsupported
claims.

CONs
1. Nofigures!
2. Toomanyexamples
werevaguely
explained.

Outline
1. PrinciplesofTraditionalAnimation
AppliedtoComputerAnimation.
2. Animation:Canitfacilitate?
3. OnCreatingAnimatedPresentations

Overview
1. Microsoftestimates~30millionpptpresentationsaremadeeveryday
2. Animationcouldimprovethem.
3. PPTisessentiallystaticinnature.
4. Examinehowmeaningfulanimationscanbecreatedtoimprovelive
presentations.

AuthoringPrinciplesfor
AnimationsforPresentations
1. Useparameterizationatalllevelsofthe
system.
2. Treatanimationsasmodelsanimations
aretreatedasparameterizedmodelsthat
haveasingleparameter:time.
3. Buildslideshierarchically

ExampleofParameterization

1. ImplementedasasetoflibrariesinPython.
2. Usershaveaccesstocomplete,generalpurpose
programminglanguage.
3. Acollectionofdrawingobjects.

ThreeMajorDrawingObjects
1. Parameterizeddiagramsfunctionsthatdraw
objectsandareredrawneachtimeitisexecuted.
2. AnimationObjectsOnescalarparameterand
providesmappingtoasetofotherdrawing
objectstobeinvoked.
3. InteractiveObjectssameasanimatedobjects
exceptcanbeeditedwhilebeingplayed.

ExampleofParameterization:

TestHarness

ExampleofAnimationScript:

AnimationTestHarness

InteractiveControllers
1. Similartoanimationscript.
2. Insteadoffunctionthatcreatesalloftheanimation,
controllerisimplementedasaclass
3. Containssetofdrawingobjectsandtimelinesfor
controllingtheirprameters.
4. Variousmethodscalled:edittimelineswhileanimations
isbeingplayedinresponsetouserinputevents.

AnimationPrinciplesfor
Presentations.
1.
2.
3.
4.
5.

Makeallmovementmeaningful
Avoidinstantaneouschanges
Reinforcestructurewithtransitions
Createalargevirtualcanvas
Smoothlyexpandandcompressdetail

AnimationPrinciplesfor
Presentationscont.
6. Managecomplexitythroughoverlays
Doonethingatatime.
Reinforceanimationwithnarration.
Distinguishdynamicsfromtransitions.

ComparingtoPresentation
Software
PowerPointvsSlithy
1. WYSIWG
2. Difficulttodocomplexanimations:resortto
videos.
3. Builtwithanimationsinmind.
4. Scripttodescribeanimation.

CounterPointvsSlithy
Focusedonusinganimatednavigationbetweenslides
toconveythestructureofthepresentation.

ComparingtoAnimation
Software
1.
2.
3.
4.

Menv
Algorithmanimation
Alice
Flash

Overall,SLITHYprovidesmuchmoreflexibility
andeaseforanimationsforpresentations.

FutureWorkandConclusion
1. Stillneedtofindananimatedpresentation
toolthatisbothverygeneralandeasyto
use.
2. Presentedideasprovideusefulstepsat
creatingandexperiencingmore
informativeandexcitingpresentations.

Critique
PROs
1. Presentsasomewhatnovel
problemintodays
presentations.
2. Interestingviewsonwhat
makesagoodanimationin
presentations.
3. Goodimplementation
details.

CONs
1. PresentedAnimation
Principlesarenot
supported.
2. Evaluationisbasedon
personalexperience,
thereisnousercase
studies.
3. Softwarerequiresan
expertlevelofaauser.

Thats All Folks!

InAction