Animate Some more advanced concepts More about Masks Sound Motion guides Button and Movieclip symbols

More about Masking Mask Effect Example X-ray Effect

Mask Effect Example: X-ray Effect maskee layer(s) mask layer, immediately above the maskee layer(s) Right-click on it, choose "Mask" to make it a mask

Mask Effect Example: X-ray Effect 4 maskee layer(s) Resulted mask effect mask layer, immediately above the maskee layer(s) Right-click on it, choose "Mask" to make it a mask 4

Mask Effect Example: X-ray Effect Add a bottom layer of a man Result 5

If you create a tween animation of the x-ray bar (the mask), then you get

Mask Effect Example: Appearance Effect Maskee layer: Contains only the little alien

Mask Effect Example: Appearance Effect Mask layer: Contains only the light beam

Mask Effect Example: Appearance Effect Mask effect is applied by locking the mask layer. Note: The mask does not always show up.

Mask Effect Example: Appearance Effect Blue beam layer: Overlay the blue beam by adding it on another layer because we want to see the blue beam.

If you tween the height of the blue beam (both the mask and the blue beam on the extra layer), then you get

Sound Sound can be included in Animate movies by Making sound play continuously independent of the timeline Synchronize sound to the timeline Add sound to buttons Sounds can fade in and fade out Best to work with standard file formats such as .mp3 or .wav

Sound Example An easy way to include sound Import the sound file to the library File/Import/Import to Library Select the sound file to import Before adding the sound file to the movie Create a new layer just for the sound file Click in frame where we want the sound file to start playing

Sound Example Add the file to the movie on stage File/Import/Import to Stage Select the sound file Drag and drop the sound file directly onto the stage Use sound control effects (if desired) Select a frame where we want to apply an effect Make this frame a keyframe Select Properties/Select the sound file Select the desired effect (start, stop, fade in, fade out, etc.)

Motion Guide Allows an object to follow a path that you draw as a stroke Works with symbols, not shapes

To Create Animation with Motion Guide Create keyframes like you would create a classic tween animation Create a motion guide layer for the tween animation In the timeline, right-click (Windows) or Control-click (Mac OS) on the motion tween layer. Choose the option of motion guide In the motion guide layer, draw a path (using pencil or pen tool) in one single stroke Do not create multiple strokes. For each keyframe of the tween animation, drag the symbol instance to snap on the path.

Returning to the leaf animation to make it follow a more complex path Motion Guide Example: Returning to the leaf animation to make it follow a more complex path

Motion Guide Example A classic tween sequence with the leaf is created using only 2 keyframes.

Motion Guide Example A motion guide is created for the classic tween layer.

Motion Guide Example A complex path is drawn in the motion guide layer using the Pencil tool.

Motion Guide Example The leaf in frame 1 (first keyframe) is snapped to the beginning of the path.

Motion Guide Example The leaf in frame 60 (last keyframe) is snapped to the end of the path.

Example of Motion Guide Result: 60 frames of animation The leaf follows the path drawn in the motion guide layer

More about Symbols Types of Symbols Graphic (we covered this in the Basics) Button Movieclip

Graphic Symbol Review Purposes: To be used as static graphics Can be used on the main timeline Can also be placed in other graphic, button and movieclip symbols Interactive controls and sounds won’t work in a graphic symbol’s timeline

Button Symbol Purposes: To be used as interactive buttons in the movie mouse clicks rollovers Can be used on the main timeline Can also be placed inside a movieclip symbol Cannot be placed inside a button symbol Has only four special-purpose frames: button up: How the button looks at the default state over: How the button looks when the mouse is over the button button down: How the button looks when the button is pressed down hit: To mark the hot spot of the button

Movieclip Symbol Purposes: Can be used on the main timeline To be used as reusable pieces of animation To allow programming of the behavior of a symbol Can be used on the main timeline Can contain copies of other symbols (graphic, buttons, and other movieclips), ActionScript, and sounds Can also be placed inside a Movieclip or Button symbol Cannot be placed inside a Graphic symbolHave its own timeline plays independently from the main movie’s timeline, i.e., it can have its own animation sequence think of movieclips as mini-Animate movies inside a main movie its animation sequence plays automatically unless you use an Actionscript to stop it Can be controlled using ActionScript in response to mouse clicks and rollovers.

Movieclip Symbol If your Flash file uses Movieclip symbols, test play using: Control > Test Movie NOT Control > Play