Unit Lessons

1. OVERVIEW Unit Lessons • Create frame animations • Create motion-tweened animation • Work with motion guides • Create motion animation effects • Animate text

2. INTRODUCTION Intro to Animation • 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

3. INTRODUCTION Intro to Animation • 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

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

5. LESSON 1 Understanding Frame Animations • 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

6. LESSON 1 Understanding Frame Animations Three images used in a Frame Animation

7. LESSON 1 Understanding Frame Animations • 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

8. LESSON 1 Creating a Frame Animation • 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

9. LESSON 1 Creating a Frame Animation In each Frame, the car is in a different position

10. LESSON 2 Understanding Motion Tweening • 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

11. LESSON 2 Understanding Motion Tweening • Two types of Tweening: • Shape Tweening-A morphing effect, covered in a later unit • Motion Tweening-used to animate objects which are moved, resized, re-colored, or rotated

12. LESSON 2 Motion Tweening requires only a Start and End Frame Light Blue Background represents a Motion Tween

13. LESSON 2 Creating a Motion Tween • Insert a starting frame • Insert an ending frame • Make alterations to the ending frame • Go back to the starting frame and choose Insert>Create Motion Tween • Make adjustments through the Properties Panel

14. LESSON 3 Understanding Motion Guides • 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

15. LESSON 3 Creating Animation with Motion Guides • 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 you’re animating, you may need to orient the object to the path

16. LESSON 3 Creating Animation with Motion Guides Object not oriented to path A motion guide layer and its associated animation Object oriented to path

17. LESSON 3 Working with Properties • 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)

18. LESSON 3 Working with Properties • 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

19. LESSON 4 Resizing an Object using a Motion Tween • Select the object in the ending frame and then use the Scale Tool options from the Free Transform tool

20. LESSON 4 Rotating an Object using a Motion Tween • 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 > Transform to specify rotation

21. LESSON 4 Rotating an Object using a Motion Tween Specifying the rotate settings via the Properties Panel

22. LESSON 4 Changing an Object’s Color with Motion Tween • Numerous ways to change an object’s color over an animation’s 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

23. LESSON 4 The Advanced Effect Panel Onion Skinning

24. LESSON 4 Onion Skinning • 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 Skinning on via the Icon in the timeline • Use The sliders to determine the range of Onion Skin display

25. LESSON 5 Animating Text • 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

26. SUMMARY Unit Tasks • Create frame animations • Create motion-tweened animation • Work with motion guides • Create motion animation effects • Animate text