Animation, Animated Cartoon and Liveliness: Eisenstein and ...
Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating...
-
Upload
gerald-blankenship -
Category
Documents
-
view
212 -
download
0
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/1.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/2.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/3.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/4.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/5.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/6.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/7.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/8.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/9.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/10.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/11.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/12.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/13.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/14.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/15.jpg)
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.](https://reader036.fdocuments.us/reader036/viewer/2022083006/56649f305503460f94c4ba9d/html5/thumbnails/16.jpg)
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.