Chapter 5. Creating Special Effects Delmar, Cengage Learning

Transcription

1 Chapter 5 Creating Special Effects 2011 Delmar, Cengage Learning

2 Chapter 5 Lessons 1. Create a mask effect 2. Add sound 3. Add video 4. Create an animated navigation bar 5. Create character animations using inverse kinematics 6. Create 3D effects 7. Use the Deco tool

3 Create Special Effects Introduction Special effects can provide variety and add interest to a movie, as well as draw the viewer s attention to a location or event in a movie You can use sound effects to enhance a movie by creating moods and dramatizing events

4 Create Special Effects You can add sound to a button to provide feedback to the viewer when the button is clicked

5 Create Special Effects You can incorporate video into a Flash movie and effects, such as fading in and out, can be applied to the display of the video You can add an animated navigation bar, one that causes a drop-down menu to open when the user rolls over a button Additional features you can use are Inverse Kinematics, 3D Effects, and the Deco tool

6 Create Special Effects Tools You ll Use

7 Create a Mask Effect A mask layer allows you to cover up the objects on one or more layers, and at the same time, create a window through which you can view objects on those layer(s). If you move the window around the Stage you can create effects such as a spotlight that highlights certain content on the Stage.

8 Create a Mask Effect You can use a mask layer to reveal only the area of the Stage and objects you want the viewer to see. When you are working with a mask layer, you need at least two layers on the Timeline. The mask layer The masked layer

9 Create a Mask Effect Mask layer with window (the filled circle, which becomes transparent when viewed over a masked layer) Mask layer before applying mask Masked layer after applying mask; you only see what appears through the window A mask layer with a window

10 Create a Mask Effect The process for using a mask layer Select an original layer that will become the masked layer Insert a new layer above the masked layer that will become a mask layer Draw a filled shape, such as a circle, or create an instance of a symbol that will become the window on the mask layer

11 Create a Mask Effect Select the new layer and open the Layer Properties dialog box, then select Mask as the layer type Select the original layer and open the Layer Properties dialog box, then select Masked as the layer type Lock both the mask and the masked layers You can mask additional layers You can unlink a masked layer

12 Create a Mask Effect Your color may vary Lock selected The completed Layer Properties dialog box

13 Add Sound You can incorporate all types of sounds into a Flash movie; for example CD-quality music, narrations to explain what the users are seeing, sound effects, and recordings. The process you use for adding sound is: Import a sound file into a Flash movie Create a new layer Select the frame that will play the sound

14 Add Sound You can place more than one sound file on a layer. You can place sounds on layers that have other objects. It is recommended that you place each sound on a separate layer so it is easier to identify and edit.

15 Add Sound A wave pattern gives indications of volume and pitch. High spikes indicate a louder sound. Dense wave patterns indicate lower pitches. A wave pattern displayed on a sound layer

16 Add Sound It is best if you make changes to a sound file using a sound-editing program. You can use options in the Properties panel to specify special effects and synchronize a sound to an event.

17 Add Sound Click Sync button to see menu Effect menu Sound Effect options in the Properties panel

18 Add Sound You can import the following sound file formats into Flash: ASND WAV AIFF MP3

19 Add Sound If you have QuickTime 4 or later installed you can import these additional file formats: AIFF Sound designer II Sound Only QuickTime Movies Sun AU System 7 Sounds WAV

20 Add Video Adobe Flash allows you to import FLV (Flash Video) files that can be used in a Flash document. You can embed video content directly into a Flash document. If you embed video it becomes a part of the SWF file similar to sound and graphic objects.

21 Add Video Play button Pause button Video placeholder An embedded video

22 Add Video Progressive downloading allows you to use ActionScript to load an external FLV file into a SWF file. With progressive downloading, the FLV file resides outside the SWF file. The SWF file size can be kept smaller than when the video is embedded.

23 Add Video If you stream video it provides a constant connection between the user and the video delivery. Streaming has several advantages over the other methods of delivering video, including starting the video more quickly and allowing for live video delivery.

24 Add Video When you use the Import Video Wizard, it imports FLV files into Flash documents. The wizard walks you through a step-bystep process that allows you to select the files to be imported and the deployment method (embedded, progressive, and streaming).

25 Add Video The Import Video Wizard

26 Add Video The Adobe Media Encoder is an application used by Flash to convert various video file formats, such as.mov,.avi, and.mpeg. The Encoder allows you to choose the size of the placeholder the video will play in, edit the video, and insert cue points.

27 Add Video The Adobe Media Encoder

28 Create an Animated Navigation Bar A common navigation scheme for a website is a navigation bar with drop-down menus Navigation bar with drop-down menus

29 Create an Animated Navigation Bar When you use the navigation bar it provides several advantages: It provides several menu options to the user without cluttering the screen It allows the user to go quickly to a location on the site without having to navigate several screens to find desired content It provides consistency in function and appearance

30 Create an Animated Navigation Bar When you create a drop-down menu the process includes: Creating a navigation bar Positioning the drop-down buttons Creating an animated mask Assigning actions to the drop-down buttons Assigning a roll over action to the navigation bar menu item buttons Creating an invisible button

31 Create an Animated Navigation Bar When the user rolls over any part of the blue button with the pointer, A script is executed that causes the drop-down menu to disappear A button that will be assigned a rollover action

32 Create an Animated Navigation Bar You can use frame labels when creating ActionScript code. You can assign a label to a frame as an identifier. If you insert frames on a Timeline, the label adjusts for the added frames.

33 Create an Animated Navigation Bar Descriptive labels help you identify parts of the movie as you work with the Timeline. You can assign a frame label by selecting the desired frame and typing in the Frame text box in the Properties panel.

34 Create an Animated Navigation Bar You can organize a long movie by adding scenes. If you create a movie for a website, you could divide it into several scenes; an introduction, a home page, and content pages and each scene would have its own Timeline.

35 Create Character Animations Using Inverse Kinematics Inverse Kinematics (IK) is when you add structure to an image that can be used to animate the various parts of the image. This process also involves creating an articulated structure of bones that allows you to link the parts of the image by changing the position of any of its parts.

36 Create Character Animations Using Inverse Kinematics Drawings showing before and after the bone structure is added

37 Create Character Animations Using Inverse Kinematics This figure shows how moving the right foot moves the entire leg Moving the foot moves the other parts of the leg

38 Create the Bone Structure You can apply the bone structure to a single drawn shape or to an image made up of several drawings. Each drawing can be converted to a graphic symbol or movie clip symbol and then can be assembled to make a desired image.

39 Create the Bone Structure You can use the Bone tool to create the bone structure, called the armature. You can continue adding bones to the structure until all parts of the image are linked. As you create the bone structure, a layer named Armature is added to the Timeline.

40 Create the Bone Structure When you place the image with the bone structure in frame 1, a new layer called a pose layer is created. Each pose layer has only one armature and its associated image. You can animate the image by inserting a keyframe on the pose layer.

41 Create the Bone Structure When you create a pose you change the position of one or more of the bones in the image. Once you specify the start and end positions of the image, Flash interpolates the position of the parts of the image for the in-between frames.

42 Create the Bone Structure Various positions in a bone structure

43 Create the Bone Structure When you create a movie clip with an IK object you have the ability to change the color effect and you can nest one movie clip within another. You can also apply a motion tween to a movie clip.

44 Create the Bone Structure Flash provides a runtime feature for manipulation of an IK object which means you can allow the user to click the object and adjust the image. The runtime feature only works with IK structures connected to drawn shapes or movie clip symbols.

45 Create the Bone Structure Connecting the head and torso Connecting the torso and the upper arm Connecting the upper and lower arms The completed bone structure

46 Create 3D Effects You can create 3D objects in Flash by manipulating objects in 3D space on the Stage. The default settings for the Stage are 550 pixels wide and 400 pixels high. You can specify any position on the Stage by the x and y coordinates.

47 Create 3D Effects 0 X axis Y axis Center point 225, ,400 The x and y coordinates on the Stage

48 Create 3D Effects Flash provides two tools, 3D Translation and 3D Rotation that can be used to move and rotate objects using all three axes. The Perspective Angle property controls the angle of the object and can be used to create a zooming in and out effect.

49 Create 3D Effects The Vanishing Point property more precisely controls the direction of an object as it moves away from the viewer. You can find both of these point settings in the Properties panel.

50 Create 3D Effects When you click an object with the 3D Translation tool, the three axes red (X), green (Y), and blue (Z) appear on top of the object

51 Create 3D Effects When you activate the 3D Translation tool: Dragging the X axis arrow moves the object horizontally Dragging the Y axis arrow moves the object vertically Dragging the Z axis dot, makes the object zoom in and out

52 Create 3D Effects When you activate the 3D Rotation tool: Dragging the X axis (red) will flip the object horizontally Dragging the Y axis (green) will flip the object vertically Dragging the Z axis (blue) will spin the object A fourth option, the orange circle, rotates the object around the X and Y axes at the same time

53 Create 3D Effects The 3D Rotation tool

54 Create 3D Effects When you create a 3D effect it requires a change in the position of an object. You can use a motion tween to specify where on the Timeline the effect will take place. If you are animating more than one object, each object should have its own layer.

55 Use the Deco Tool The Deco tool provides a variety of drawing effects that can be used to quickly create environments, such as city landscapes, and to create various animations. You can use the Deco tool to create decorative patterns.

56 Use the Deco Tool There are 13 drawing effects available with the Deco tool The Deco drawing tools

57 Use the Deco Tool Drawing effects in the Deco tool are grouped into three basic types Fills the Vine Fill, Grid Fill, and Symmetry Brush create patterns that can be used as fill for graphics or a backdrop for a movie

58 Use the Deco Tool Brushes several brushes including the buildings, lightning, tree, and flower brushes can be used to create drawings that can be combined to construct an environment

59 Use the Deco Tool Animations a few brushes, such as the Lightning brush, Fire Animation, Smoke Animation, and Particle System, create animations as they are used