Animation effects Adds motion to a piece Draws attention to what you want user to notice As simple as a transition effect, such as a fade, dissolve or zoom Or as elaborate as full cartoon-like animation or 3D animation

Why is animation possible? Biology: persistence of vision Object seen by a human eye remains mapped onto retina for a brief time A series of images that change slightly and rapidly appear to blend, giving illusion of movement

Frames per second TV builds 30 entire frames/second Film shot at camera shutter 24 frames/second, but projector flashes through each image twice Multimedia often makes do with less Flash defaults to 12 frames/second

Cel animation Cartoon animation makes a different cel (celluloid sheet) for each frame Cel artwork begins with keyframes for each action, such as character about to take a step Tweening creates frames between keyframes Computer animation does automatic tweening

GIF89a Added simple animation capability Many images included in one GIF file Browsers will show animations in sequence—an exampleexample GIF constructor set makes this easier: see

Macromedia Flash™ Originally called FutureSplash Macromedia acquired it to complement their flagship product Director™ Both use stage, actors and timelines Both play with Shockwave plug-ins Flash reduces bandwidth overhead

Frame-by-frame animation Flash animation works by playing through the Timeline Each cell in a timeline is a frame, a unit of playing time Each row in the timeline area is a layer, in which different objects may appear, possibly in the same frames Top-most layer appears on top Do exercise 5.1 on pages

Motion tweens Draw a graphical object on the stage, e.g., a circle Double-click on object to select it, then Insert>Convert to Symbol Click on frame 1 in the timeline Insert>Create MotionTween Click on another frame (e.g., 30) Insert>Keyframe Motion tween appears Drag circle to another location Go to frame 1 Press Enter to see effect

Motion tween exercise Do exercise 5.3 on page 73.

Color and size motion tweens Motion tween can achieve other effects Click on the circle in either keyframe Select drag-down menu next to Color: Alpha changes the transparency Tint changes the color values Or use free transform tool to change size and shape of object in a keyframe Do exercise 5.4 on page 74

Shape tweens Similar to morphing objects Draw a circle in center of stage In frame 30, Insert>Blank Keyframe Draw a square in center of stage Go back to frame 1 In Properties, Tween: select Shape Notice that shape tween is light green

Motion guides If you want more than straight line motion: Right-click on layer with motion tween Select Add Motion Guide In frame 1 of motion guide layer, with pencil tool, draw a path (it won’t be visible) Drag graphic to start and end points (in 1st and last keyframes) Voila! Arbitrary path motion Do exercise 5.7, pp

Publishing Flash movies File > Publish settings Ctrl-Enter compiles.fla to.swf (“swiff”) Publish.html to tell browser where to find latest Flash player, dimensions of movie Windows projector produces stand-alone.exe program (plays without browser or Flash player) Macintosh player does the same on Mac