Flash Adobe Flash Introduction Kyungeun Park

Bitmap vs. Vector based  Bitmap –Bitmaps are made up of single pixels  Vector based –Vector graphics are made up of mathematical equations

Advantages of Vector-based Drawing Programs  Easy to resize without loss of quality  Small file size  Faster display and download

Animation  Graphics with added motion  Motion is illusion of motion  Single image is called a frame

Animation (cont.)  24 frames per second are the threshold for the human eye to perceive single frames showing in sequence as continuous motion

Layers  Layers are like transparencies  Have a stacking order  Easy to make changes  Avoid unwanted object interaction

Usage of Layers  Layers avoid unwanted object interaction  Each object that you may want to animate should be placed on a separate layer  Rule of thumb: If in doubt, place the object on a separate layer

Frames  Frame –Single image displaying the object or character  Keyframe –Single Image where a significant change to the object or character is defined

Frames (cont.)  In-between Frames –Incorporate the incremental changes necessary to simulate movement  Tweening –Process of automatically creating in-between frames

Symbols  Symbols are reusable objects  Are stored in the library  Library is a container for reusable objects  Convert to symbol creates symbol and places it in Flash library

Symbol Instances  Instance of a symbol is usage of a symbol in your movie  Help to keep the file size small

Working with Symbols  Library panel –Holds a library’s contents (symbols, sounds, video clips, and bitmaps in folders) –View Library Window

Working with Symbols  Why use symbols? –Flash uses vectors to hold down file size: each vector shape is just a set of instructions. –This fact makes vector shapes efficient to begin with. –Symbols allow you to reuse elements in a way that's more efficient than duplicating vector shapes. –Each instance of a symbol is linked to one master symbol, instead of adding a full set of instruction for each instance.

 Scenes are compared to chapters of a book.  Animation is broken into smaller chunks called scenes.  Scene panel shows what scenes exist in your movie. Understanding Scenes

 Insert a scene  Delete a scene  Change the scene order  Rename a scene Manipulating Scenes

Frame-by-Frame Animations  Traditional form of animation  Made by placing different content in different frames  Keyframe is the frame that hold new content.

Frame-by-Frame Animations  Timeline  Control

Frame-by-Frame Animations  Keyframes –Blank keyframe: empty frame –Keyframe: duplicates the content of the preceding keyframe in that layer

Frame-by-Frame Animations  Insert Keyframe/Blank Keyframe Keyframe Blank Keyframe

Frame-by-Frame Animations  Frame-by-Frame Animation

 Tweening –Process of automatically creating in-between frames –Flash creates a series of incremental changes to the graphic.  In-between Frames –Automatically generated intermediate frames to simulate movement  Tweening pattern –Beginning and end of the sequence by placing graphic elements in keyframes –Apply tweening process to the beginning frame Tweening Process

 Tweening –Motion tweening –Shape tweening  Difference between motion tweening and shape tweening is: –Motion tweening requires graphics that are in containers (drawing-objects, groups,symbols, or text boxes quality) –Shape tweening requires editable graphics (merge- shapes and drawing-objects quality) Tweening Process

 Create Motion Tween Animation with Motion Tweening

 Create Motion Tween Animation with Motion Tweening

 Tween changes in color – transitional colors for each inbetween frame Animation with Motion Tweening

 Tween changes in color Animation with Motion Tweening

Automatic Transition of Shape Animation with Shape Tweening

 Morphing: transforms the oval into the rectangle Animation with Shape Tweening