Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating...

16
Animation •Liveliness •Simulation of motions •A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Transcript of Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating...

Page 1: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Animation

• Liveliness

• Simulation of motions

• A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Page 2: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Animation

• Flash allows to create vector-based animations.

• Typically, animation on the Web is either based on GIF files, scripting languages such as JavaScript, or programming languages such as Java.

Page 3: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Flash 5

• Flash is a vector graphics editor and

• an animation and authoring tool designed for creating web page graphics, animations and interactivity.

• Make movies in Flash by creating a series of graphics on the stage.

Page 4: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

The Flash work environment • When creating and editing movies, you typically work

with these key features: – The Stage, the rectangular area where the movie plays

– The Timeline, where graphics are animated over time

– Symbols, the reusable media assets of a movie

– The Library window, where symbols are organized

– The Movie Explorer, which gives an overview of a movie and its structure

– Floating, dockable panels, which enable you to modify various elements in the movie and configure the Flash authoring environment to best suit your workflow

Page 5: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Stage

• Stage is the area where you create and lay out your graphics.

• The Stage is where you compose the content for individual frames in the animation, drawing artwork on it directly or arranging imported artwork.

Page 6: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Stage

• Size of the stage determines the size of the Flash movie,

• to change the size of the stage: choose Modify-Movie or CTRL+M

Page 7: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Frames

• Like films, Flash movies divide lengths of time into frames.

Page 8: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Graphics and Layer

• Graphics can be composed of multiple graphics.

• Each graphics can be assigned to a discrete layer

• This allows some graphics to be on top of or beneath other graphics

Page 9: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Layer and Timeline

• Each layer has a timeline row

• Timeline is used to create Animation

Page 10: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Frames and Timeline

• Each frame of an animation is represented as a point on the timeline, at which a movie can change

• The frames where changes occur are called keyframes

Page 11: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Keyframe and Animation

• Create animation by modifying the graphic at a specific keyframe.

Page 12: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Two ways to Animate

• Frame-by-frame– In frame-by-frame animation you create the

image in every frame.

• Tweening– In tweened animation, you create starting and

ending frames and let Flash create the frames in between.

Page 13: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Tweening

• Tweening is an animation technique (for simulating motion)

• in which you create a beginning and ending keyframe

• and flash creates the frames in between

Page 14: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Tweening requirments

• Motion Tween: – Graphics must be turned into

symbols or grouped objects.

• Shape Tween: – Graphics must be turned into

shape (Break Apart or, Ctrl+B).

Page 15: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Three types of graphics in Flash

• You should be able to recognize these graphics when selected.

• And the fourth one is the imported bitmap graphics.

Page 16: Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.

Tweening can be applied to

Motion Tween: can be applied only to Grouped Objects, Symbols and

Bitmaps.

Shape Tween: can be applied only to Shapes.