Chapter Lessons Create frame animations Creat

1
(No Transcript)
2
Chapter Lessons
OVERVIEW

• Create frame animations
• Create motion-tweened animation
• Work with motion guides
• Create motion animation effects
• Animate text

3
Introduction
INTRODUCTION

• Animation can be an important part of a Web site,
  CD-ROM, Demo, or game
• The perception of motion is an illusion made up
  from a series of still images
• Persistence of Vision is the basis for frame
  rates in animations
• Frames rates of 10-12 fps generally provide
  smooth computer-based animation

4
Intro to Animation
INTRODUCTION

• Frame rates lower than 10-12 fps often result in
  jerky images, while higher frame rates result in
  a blurred image
• Flash uses a default frame rate of 12 fps

5
Macromedia Flash Animation
INTRODUCTION

• Animation is one of the most powerful features of
  Flash
• Basic animation is a simple process
• Move an object around the stage
• Change an objects size, shape, color
• Apply Special Effects, such as zooming, fading,
  or a combination of effects
• Two Animation Methods Frame Animation, and
  Tweened Animation

6
Understanding Frame Animations
LESSON 1

• Also called frame-by-frame animations
• Created by specifying an object that is to appear
  in each frame of a sequence of frames
• Useful when you want to change individual parts
  of an image
• Depending on the complexity of the animation, can
  require a lot of time

7
Understanding Frame Animations
LESSON 1
Three images used in a Frame Animation
8
Understanding Frame Animations
LESSON 1

• A greater number of images generally suggests
  less change needed between each image creating
  more realistic animation
• Consider the number of frames in which an image
  will appear
• Fewer frames and the animation may appear jerky
• Consider the frame rate (10-12 fps)

9
Creating a Frame Animation
LESSON 1

• Insert a keyframe on the layer
• Place your first drawing on the stage
• Insert your next keyframe, and change the drawing
• Onion skinning may help you placing a series of
  images

10
Creating a Frame Animation
LESSON 1
In each Frame, the car is in a different position
11
Understanding Motion Tweening
LESSON 2

• Motion tweening is far less tedious than Frame
  Animation
• Create a Start and End frame
• Flash creates the in-between frames
• Flash only stores the attributes that change from
  frame to frame, thus creating smaller file sizes
  than Frame Animation

12
Understanding Motion Tweening
LESSON 2

• Two types of tweening
• Shape tweening - a morphing effect
• Motion tweening is used to animate objects which
  are moved, resized, re-colored, or rotated

13
LESSON 2
Motion Tweening requires only a Start and End
Frame
Light Blue Background represents a Motion Tween
14
Creating a Motion Tween
LESSON 2

• Insert a starting frame
• Insert an ending frame
• Make alterations to the ending frame
• Go back to the starting frame and choose
  InsertgtCreate Motion Tween
• Make adjustments through the Properties Panel

15
Understanding Motion Guides
LESSON 3

• A path that will guide moving objects around the
  stage in any direction
• Without Motion Guides, animations would always
  travel in straight lines
• Animations are placed on their own layer beneath
  a motion guide layer

16
Creating Animation with Motion Guides
LESSON 3

• Two ways to create this relationship
• Create a guide layer with a path, then create a
  layer of animation an attach
• Or, create an animation. Then create a motion
  guide layer with a path, and attach
• Depending on the type of object youre animating,
  you may need to orient the object to the path

17
Creating Animation with Motion Guides
LESSON 3
Object not oriented to path
A motion guide layer and its associated animation
Object oriented to path
18
Working with Properties
LESSON 3

• Tween - specifies Motion, Shape,or none
• Scale - tweens the size of an object
• Ease - specifies the rate of change between
  tweened frames
• Ease values are between -100(slow) and 100(fast)
• Rotate - specifies the number of times an object
  rotates clockwise(CW) or counter clockwise(CCW)

19
Working with Properties
LESSON 3

• Orient to path - orients the baseline of the
  object to the path
• Sync - ensures that the object loops properly
• Snap - attaches the object to the path by its
  registration point

Orient to Path Feature enabled in the
Properties Panel
20
Resizing an Object using a Motion Tween
LESSON 4

• Select the object in the ending frame and then
  use the Scale Tool options from the Free
  Transform tool

21
Rotating an Object using a Motion Tween
LESSON 4

• Select the object in the start or end frame
  rotate with different options
• Rotate with the Rotate Tool option of the Free
  Transform tool
• Rotate Clockwise or Counter Clockwise a specified
  number of turns or degrees through the Properties
  panel
• Use Modify gt Transform to specify rotation

22
Rotating an Object using a Motion Tween
LESSON 4
Specifying the rotate settings via the Properties
Panel
23
Changing an Objects Color with Motion Tween
LESSON 4

• Numerous ways to change an objects color over an
  animations time
• Change the Tint of the object in the last frame
• Change the Alpha of the object in the last frame
• Change the Brightness of the object in the last
  frame
• Apply Advanced Effects

24
LESSON 4
The Advanced Effect Panel
Onion Skin
25
Onion Skin Feature
LESSON 4

• A feature that allows you to view an outline of
  objects in any number of frames
• Helps in positioning animated objects on the
  stage
• Turn Onion Skin feature on via the Icon in the
  timeline
• Use The sliders to determine the range of Onion
  Skin display

26
Timeline Effects
LESSON 4

• Macromedia Flash allows you to combine various
  animation effects and provides several prebuilt
  Timeline effects
• You can apply Timeline effects to the following
  objects
• Text
• Graphics
• Bitmap images
• Button symbols

27
Apply a Timeline Effect
LESSON 4
28
Animating Text
LESSON 5

• Like other objects, Text can be animated
• The entire text block is animated unless Broken
  Apart
• Text can be rotated, skewed, scaled, or
  re-colored
• Motion Tweened Text blocks are automatically
  saved as Symbols

29
Chapter D Tasks
SUMMARY

• Create frame animations
• Create motion-tweened animation
• Work with motion guides
• Create motion animation effects
• Animate text