LECTURE 10 - Imran Ihsanimranihsan.com/upload/lecture/MSS0910.pdf · 2020-01-18 · LECTURE Animation CS 5513 Multimedia Systems . Spring 2009. Imran Ihsan. Principal Design Consultant

10LECTURE

Animation

CS 5513 Multimedia Systems Spring 2009

Imran IhsanPrincipal Design ConsultantOPUSVII – www.opuseven.com

Faculty of Engineering & Applied SciencesMohammad Ali Jinnah University, Islamabad

1. Animation

• To animate something is, literally, to bring it to life– An animation covers all changes that have a visual effect

– Visual effect can be of two major kinds:

– motion dynamic— time varying positions

– update dynamic— time varying shape, color, texture, or even lighting, cameraposition, etc.

• The visual effects is the result of exploiting the properties of human visionsystem– A computer animation is an animation performed by a computer using

graphical tools to provide visual effects

Imran Ihsan Faculty of Engineering & Applied Sciences Mohammad Ali Jinnah University, Islamabad

CS5513 - Multimedia Systems10. Animation

Slide: 2

2. Animation Definition

• The creation of moving pictures one frame at a time– e.g. make a sequence of drawings on paper, in which a character's position

changes slightly in each drawing

– Photograph drawings in sequence, using movie camera that advances oneframe at a time

– Play back resulting film, character will move



Slide: 3

• If each of the eight pictures below were shown at the same point in rapidsuccession, the result would be a rotating arrow.

• The pictures shown below are stills of the rotating Ford logo from the FordMotor Company site.



Slide: 4

3. The First Animated Character

• Gertie the Dinosaur was the first real animated character.



Slide: 5

4. Animation

• Today, most animation is performed by computer. Examples are Bugs, ToyStory, Jurassic Park and the BBC Walking with Dinosaurs.

• The computer will produce a wire frame of the scene, then apply texturesand light effects before moving onto the production of the next frame,each of which may take hours or even days to produce.



Slide: 6

5. Animation Categories

• Two categories :– Traditional Animation

• All frames in an animation had to be drawn by hand

– Computer Graphics Animation• The use of computers to create animations.



Slide: 7

6. Computer Graphics Animation

• Two types of Computer Graphics:– Linear animation or 2D animation

• Cel animation

• Sprite animation

• Key frame animation

• Path animation

– 3D animation (Will not be covered in this module)• Modeling

• Animating

• Rendering



Slide: 8

7. Digital Cel Animation

• Use layers (e.g. in Photoshop) like sheets of acetate (Clear plastic material)in traditional cel animation

• e.g. static background on one layer, moving simple object on a layer infront of it. Make the object move by repositioning the layer

• More complex cases, just need to change those layers where movementor other change occurs between frames



Slide: 9



Slide: 10

Background Layer

Other Layer Frames

1

2

3

8. Digital Cel Animation - Result



Slide: 11

9. Sprite Animation

• Store a single copy of all static elements and moving objects (sprites) anda description of how the objects move

• Each sprite can be a collection of images called sprite faces, which can besubstituted in sequence to produce composite motion

• e.g. walk cycle

• What is the main difference between Cel and Sprite Animation?

• Ans :– Cel Animation – each layer frame object does not related to previous frame.

– Sprite Animation – each sprite has its own control of position and appearance



Slide: 12



Slide: 13

Sprite faces for running cycle

10. Key Frame Animation

• Traditional: key frames drawn by chief animators at important points inthe animation– In-between frames drawn by less skilled animators

• Computer-based: key frames drawn explicitly– In-between frames computed by software

– E.g. Macromedia Flash



Slide: 14

• 2 frames drawn by user

• In between frames generated by computer

• Final Animation



Slide: 15

11. In-betweening Calculation

• Linear Interpolation

• Constant velocity

• Motion begins and ends instantaneously



Slide: 16

12. Example

• Blue ball bounces naturally (why?)

• Yellow ball – linear interpolation, bounces strangely



Slide: 17

13. Easing In

• Object accelerates, gradual transition from static to motion

• Use quadratic interpolation



Slide: 18

14. Easing Out

• Object decelerates, gradual transition from motion to static

• Use quadratic interpolation



Slide: 19

15. 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)



Slide: 20

16. Shape Tweening/Morphing

• Shape Tweening (also called morphing) is the effect in which one imagetransforms into another through a series of intermediate frames.

• This is done by first creating or scanning the first and last images.

• Then key points are specified, i.e. points on the original image whichshould become points on the final image.



Slide: 21

17. Morphing

• The computer then produces the frames in between, with each successiveframe becoming progressively more morphed into the last image.

• The diagrams on the next page show start and end frames and theintermediate frames produced by morphing software.



Slide: 22



Slide: 23

18. Popular Animation Format

• Animated GIF

• Flash SWF

• SMIL

• Video format



Slide: 24

19. Animated GIFs

• Sequence of images can be stored in a single GIF file, and displayed oneafter another by a Web browser or other software– No browser plug-in required

– Can specify looping, delay between frames

– 256 colour palette

– No sound

• E.g. Ulead GIF Animator, GIF Construction Set, Animagic GIF Animator,Macromedia Fireworks etc.



Slide: 25

20. SWF

• Popular Web animation format

• stands for ShockWave Flash

• Vector animation format

• Motion represented as numerical operations on vector data

• Can also include bitmapped images (e.g. as backgrounds)



Slide: 26

21. 3-D Animation

• "Easy to describe but much harder to do"

• Properties of 3-D models (shape, size, position, rotation, surfacecharacteristics, 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 ofprocessing power



Slide: 27

22. Animation Pros & Cons

Advantages of using Animation

• Attracts and holds attention

• Show otherwise invisible actions or physical processes

• Increases retention

• Allows visualization of imagined concepts, objects and relationships

• size smaller than video

Disadvantages of using Animation

• Requires more memory and storage space than images

• Always needs plug-in/software for presentation

• Cannot represent actuality like video or photography



Slide: 28

Documents

LECTURE 10 - Imran Ihsanimranihsan.com/upload/lecture/MSS0910.pdf · 2020-01-18 · LECTURE Animation CS 5513 Multimedia Systems . Spring 2009. Imran Ihsan. Principal Design Consultant