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 qualitySmall file size Faster display and download

Animation

Graphics with added motionMotion is illusion of motionSingle 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 transparenciesHave a stacking orderEasy to make changesAvoid unwanted object interaction

Usage of Layers

Layers avoid unwanted object interactionEach object that you may want to animate

should be placed on a separate layerRule 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 objectsConvert 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 sceneDelete a sceneChange the scene orderRename a scene

Manipulating Scenes

Frame-by-Frame Animations

Traditional form of animationMade by placing different content in

different framesKeyframe 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

BlankKeyframe

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

Animation with Motion Tweening

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

AutomaticTransition of

Shape

Animation with Shape Tweening

Morphing: transforms the oval into the rectangle

Animation with Shape Tweening

Animation with Shape Tweening

Animation with Shape Tweening

Animation with Shape Tweening