Embed Size (px)
Citation preview
2
Contents
Animation Intro CEL animation Capture Animation and Image Sequences Digital Cel Key Frame Animation Animated GIFs SWF(Shoch Wave Flash) & Flash Timeline
3
Animation Intro
Definition Creation of moving pictures one frame at a time
Ex) Disney animation The sequence of drawings is photographed in the correct order, a
single frame at a time
As film is projected at 24 frame per second, Technically requires 24 drawings for each second of film
1440 drawings for every minute Even more for animation made on video
In practice, Not seamlessly smoothy animation can be be shot ‘on 2s’
12 frames per second for film, 15
4
Homer J. simpson
CEL animation
If solely make animation, it requires enormous amount of labor Cut-out Animation : Terry Gilliam’s Monty Python Three-dimentional(Stop motion) : Wallace and Gromit
Clay animation (Claymation) Mixture of live action and animation : KING KONG(1933), Matrix
CEL animation Homer simpson : drawn on sheets of transparent material known Simson’s living room was drawn separately
Only moving elements(cel) need to be redrawn The fixed parts of the scene only made once
Many CELs might be overlaid together Prove particularly suitable for tansfer to the digital realm
Many popular cel-like cartiins on TV are now produced digitally
5
Capture Animation and Image Sequences
Computer + video camera + traditional technique Video camera is connected directly to a computer , to capture
each frame of animation to disk Play the serial frames which are captured
Draw animation on paper and scan them
Frame grabbing – record each frame to disk Save as QuickTime &c, edit non-linearly like video Can also use scanner or digital still camera, or create
each frame in a graphics program (e.g. Painter)
6
Digital Cel
Use layers (e.g. in Photoshop) like sheets of acetate in traditional cel animation e.g. static background on one layer, moving simple object on a
layer in front of it. Make the object move by repositioning the layer More complex cases, just need to change those layers where
movement or other change occurs between frames
Types of animation with respect to Moving Background animation
Make one frame as s character, and move the backround Old_fashoined 3D game : Doom2
Sprite animation Charater is moving in front of fixed background
Tacken 5,4,3 Hwarang Steve Fox
7
Key Frame Animation
Traditional: key frames drawn by chief animators at important points in the animation In-between frames drawn by less skilled animators
Computer-based: key frames drawn explicitly In-between frames interpolated by software
One of the Background Key Frame in Lion King
At this backgournd,
Cloud, birds(not yet seen) anything like that could be all CEL(in Digital)
and seperated into different Layers
8
Animated GIFs
Sequence of images can be stored in a single GIF file, and displayed one after another by a Web browser or other software No browser plug-in required Can specify looping, delay between frames 256 colour palette No sound
9
SWF(Shoch Wave Flash)
Popular Web animation format Usually generated by Macromedia Flash Vector animation format
Motion represented as numerical operations on vector data
Can also include bitmapped images (e.g. as backgrounds)
10
Flash
Timeline – graphical representation of sequence of frames Key frames – drawn/copied from previous and transformed Simple frames – hold on previous key frame
Stage – sub-window in which frames are created by drawing with vector tools Can also import bitmaps as objects, add text
11
Flash interface
Stage
Timeline and layersRemember to put every new object on a new layer
Property inspector
12
Timeline
Important to use layers Name them!
13
Symbols
Reusable objects stored in a library Graphic symbols Button symbols (for interactivity) Movie clip symbols (self-contained animations within a movie)
Create instances by dragging on to stage If symbol is edited, all its instances updated
14
Types of symbols
Graphic symbols for static images and to create reusable pieces of animation that are tied to the main Timeline.
Button symbols to create interactive buttons that respond to mouse clicks, rollovers, or other actions.
Movie clip symbols to create reusable pieces of animation. Movie clips have their own multiframe Timeline that is independent from the main Movie clip instances can be placed inside the Timeline of a button symbol
to create animated buttons.
Dolphins & Boat
15
Library
To view your symbols Window > Library
Remember to name everything Example for symbols using Library
16
Motion Tweening
Motion tweening Object is placed in a key frame Create Motion Tween
Object is turned into a symbol Add key frame at end of tweened sequence and move or
transform object Motion in intermediate frames is interpolated (tweened) Conditions
Key frame should be inserted at start and end point One object used for Motion tweening in the key frame should be a
group or a symbol
17
Types of motion tweening
Between two positions Along a path
18
Shape Tweening
Also called morphing Shapes of graphical objects are transformed in between key
frames Have to generate the interpolated frames, so resulting SWF is
bigger than when motion tweening is used Shape Tweening Shape_Tweening Shape_Tweening
19
Types of shape tweening
Colour Shape Shape to text
20
Linear Interpolation
Constant velocity Motion begins and ends
instantaneously
21
Easing In
Object accelerates, gradual transition from stasis to motion
22
Easing Out
Object decelerates, gradual transition from motion to stasis
23
Mask
For spotlight effects and transitions Use a mask layer to create a hole through which
underlying layers are visible A mask item can be a filled shape, a type object, an instance of a
graphic symbol, or a movie clip Flash movie
24
Motion Graphics
Like time-based graphic design Move, transform, alter layers of a bitmapped image
between frames Apply time-varying filters and effects
AfterEffects supports linear and Bézier interpolation in both space and time (rate of change)
Can have new effects that only make sense in time, e.g. shatter, particle effects
Example1 Example2
25
3-D Animation
"Easy to describe but much harder to do" Properties of 3-D models (shape, size, position, rotation,
surface characteristics, etc), light sources and cameras are numerically defined
Animate a scene by changing the numbers, rendering a new frame, changing further …
Can make objects move, or move the camera Requires 3-D visualization and animation skills and great
amount of processing power
