CH7-Multimedia.pdf

8/10/2019 CH7-Multimedia.pdf

1/23


2/23

MULTIMEDIA

108

MULTIMEDIA IN FLASH MX 2004

This focus of this chapter is on importing and using various formats of files in Flash to createmultimedia presentations. Flash has the ability to import many different types of files including:

Vector Graphics

As you have learned already, vector graphics are based on mathematical calculations. The shapes in a

vector graphic are resolution independent, which means they can be scaled to any size without a loss

of quality.

Some of the vector file formats Flash can import include:

AI (Adobe Illustrator)

EPS (Encapsulated PostScript)

FHx (Macromedia Freehand)

SWF (Macromedia Flash)

WMF (Windows Metafile)

Bitmap Images

Bitmap images (sometimes called raster images) are files that are comprised of pixels (short for

picture elements). A bitmap image is a series of rows and columns of pixels that contain information

including color, saturation, brightness, and location in the image.

The price of having all of this information in each and every pixel of a bitmap image is usually a

large file size. The main reason to use bitmaps is to display high-resolution continuous tone images

that you cannot create with vectors.


3/23

MULTIMEDIA

109

Some of the bitmap image file formats Flash can import include:

BMP (Windows Bitmap)

GIF (Graphics Interchange Format)JPEG/JPG (Joint Photographic Experts Group)

PNG (Portable Network Graphics)

TIFF (Tagged Image File Format)

Sound Files

In Flash, sound can be used for many purposes including narration, background soundtracks,

buon sounds, and for sound effects that complement animation effects. In Flash, you have the

ability to import a variety of sound formats.

Some of the sound file formats Flash can import include:

MP3

WAV

AIFF

A common question is: What format of sound file should I import into Flash? I would suggest that

if you know ahead of time what data rate you plan to use if you are planning on using MP3 files, I

would import that version instead of a higher-bit rate version, such as a WAV file. The Flash moviethat you will be editing will be much smaller, and Flash wont need to compress the file each time

you test or publish your movie.

Video Files

The ability to include video inside a SWF file was introduced with the release of Flash MX. Once you

import video into Flash, you can control it using ActionScript, target different points in the video to

allow users to jump from point to point, transform video clips on the Stage, and apply effects such as

tinting and skewing.

In Flash MX 2004, Macromedia has added more video compression options and the capability to cut

apart a video and to organize the clips, apply color correction, and modify how the video is imported

into your Flash movie.


4/23

MULTIMEDIA

110

Flash MX 2004 supports many video formats including:

QuickTime (Requires QuickTime 4 or higher)

Windows Media (Windows only)AVI (Video for Windows) (Requires QuickTime 4 or higher or DirectX 7 or higher)

DV (Digital Video) (Requires QuickTime 4 or higher)

MPEG (Requires QuickTime 4 or higher or DirectX 7 or higher)

FLV (Flash Video File)


5/23

MULTIMEDIA

111

IMPORTING BITMAPS

Importing bitmaps into Flash is a simple process. A good rule of thumb for importing images intoFlash is to bring in the images at the size they will appear in the finished project. In other words, if

your movie size is set to 640 x 480 pixels, and the image you plan to import will display at 200 x 200

pixels within the Flash movie, scale the image in your favorite graphics program before you import

the image into Flash. If you import a 400 x 400 pixel image into Flash, then use Flash to scale the

image to 200 x 200 pixels, the file size of the image will remain the same as it was at 400 x 400 pixels.

When you scale down the image in the originating application prior to importing into Flash, you can

reduce the file size significantly.

Exercise 7.1: Importing a Bitmap into Flash

1. Create a new 640 x 480 pixel Flash document with a Black Stage.

2. Choose File -> Import to Stage

3. Choose Chapter7 / day_night_europe.jpg from the student files.

4. Select the image and convert the image to a graphic symbol called Europe

5. Move the symbol and center it on the Stage.

6. Insert a keyframe on frame 24.

7. Select frame 1.

8. Scale the symbol to 550 x 550 and position it at 0, -75.

9. Create a motion tween between frames 1 and 24.


6/23

MULTIMEDIA

112

10. Test the movie. The movie should zoom in on the image.

11. Save as Europe_zoom and keep the movie open for next exercise.


7/23

MULTIMEDIA

113

SETTING BITMAP PROPERTIES

Seldom will you import a bitmap image that meets all of your requirements. Usually, you mustmodify an image in one sometimes several ways. To modify bitmap properties, select the image

in the Library panel and double-click, or you can choose Properties from the Librarys Options menu.

Exercise 7.2: Setting Bitmap Properties

1. With the previous movie open, open the Library panel.

2. Double-click the symbol for the bitmap day_night_europe.jpg in the Library.

The Bitmap Properties dialog box opens.

The Bitmap Properties window shows the location of the source file, the size of the file, and what

compression is being used on the image. To make the size of our imported image smaller, were

going to adjust the JPEG compression on the file.


8/23

MULTIMEDIA

114

3. Uncheck the Use imported JPEG data checkbox.

In this image, the original JPEG compression was set at a quality level of 66. By default, Flash will

try to set the quality level to 50. To make the image file size even smaller, well need to set thequality level a bit lower.

4. Make sure the that the Compression is set for Photo (JPEG), then set the Quality to 40. To see

the change in the image, click the Test buon.

5. Test the movie. The movie should zoom in on the revised image.

You should notice that the image has lost a bit of the detail because of the change in the JPEG

quality.

6. Save and close the file.


9/23

MULTIMEDIA

115

TRACING BITMAPS

As you develop a project, you may find it is more effi cient to use an existing photograph or piece ofclip art, rather than draw original artwork from scratch. You can use Flash to trace the image to

convert it into vector art that you can place within your movie.

To trace an image, choose Modify -> Trace Bitmap and make appropriate choices in the Trace Bitmap

dialog box.

The Trace Bitmap dialog box offers four options that offer precise control over a trace. These options

include:

Color Threshold. This option controls the number of colors in the vector graphic. This option is not,

however, a seing that explicitly specifies the number of colors. Instead, it is used in a calculation

that relates to the colors in adjacent pixels. You must set a color threshold between 0 and 500. Alow number in the Color Threshold seing means that more colors are used in the calculation ( the

threshold is low); a high number in the Color Threshold seing means fewer colors are used in the

calculation (the threshold is high). When you set the threshold too low, too many colors are used.

When the threshold is too high, too few colors are used (possibly only one color), which could

produce an image that bears no resemblance to the original image.

Minimum Area. This seing determines how many adjacent pixels to consider during a trace

calculation. This seing must be between 0 and 100.

Curve Fit. If the bitmap includes sharp corners, you should apply a seing or Tight or Very Tight

to create a vector graphic similar to the original. Using Smooth or the default of Normal is suffi cient

when you trace bitmaps that do not include sharp corners or angles.

Corner Threshold. This seing is similar to Curve Fit, but calculates the edges of the bitmap instead

of the corners.


10/23

MULTIMEDIA

116

Exercise 7.3: Tracing Bitmap Images

1. Create a new 640 x 480 pixel Flash movie.

2. Choose File -> Import to Library

3. Choose Chapter7 / space-needle.jpg from the student files.

4. Drag an instance of space-needle.jpg from the Library to the Stage.

5. Select the image and choose Modify -> Bitmap -> Trace Bitmap.

6. Enter 50 in the Color Threshold field, enter 100 in Minimum Area, set Curve Fit to Normal,

and set Corner Threshold to Many Corners.

7. Click OK and wait while Flash uses your seing to trace the artwork.

The result of the trace is similar to the original, but shows obvious vector qualities.

8. Drag a new instance of spaceneedle.jpg from the Library to the Stage.

9. Select the image and choose Modify -> Bitmap -> Trace Bitmap.


11/23

MULTIMEDIA

117

10. Enter 200 in the Color Threshold field, enter 100 in Minimum Area, set Curve Fit to Normal,

and set Corner Threshold to Normal.

The second traced image has less color information and a smaller number of corners.

12. Close the file.


12/23

MULTIMEDIA

118

IMPORTING SOUNDS

Importing sounds into Flash is as simple as importing images. You do so by choosing the Importoption under the File menu (File -> Import). Once you choose Import, you have the option to view

all of the formats Flash can import, or you can narrow your search by choosing the file type (such as

MP3 or AIFF).

When you choose a file, it is imported to the Library (not the Stage) because it is not a visual element.

Once added to the Library, a sound becomes another item you can use in your Timeline. You can

preview a sound by single-clicking its icon, and then clicking the Play buon in the Library preview

pane.


13/23

MULTIMEDIA

119

ADDING SOUND TO THE TIMELINE

One of the most common uses of sound in the Timeline is to add a narration track to a Flash movie.To make it easier to sync the audio to your Flash movie, youll want to break the audio apart into

sentence groups to keep the length of the audio files reasonable. Its usually much easier to sync

small audio files in Flash movies then it is to sync Flash movies to lengthy audio files.

To add sound to the timeline, it is recommended that you create a separate layer for each concurrent

sound file that will be playing. Once you have your new layer created, add a blank keyframe, if

needed, to the frame where you want the sound to start playing. Then, select the layer and keyframe

and drag the sound from the Library to the Stage. Youll notice that the layer where the sound file

was added now has a waveform representation of the file in the layer.

Exercise 7.4: Adding Sounds to the Timeline

1. Open the Chapter7 / tipsters.fla movie from the student files.

2. Import the following files to the Library from the student files:

Chapter7 / tipster1.mp3



3. Select the first frame of the Audio layer. Drag the sound file tipster1.mp3 to the Stage.

Since the sound file is longer than 1 frame (1/12 of a second), we need to lengthen the time the

sound file will play for in the Timeline so we can sync images to the sound.

4. Select the symbol in the Library for tipster1.mp3 and double-click. The Sound Properties

dialog box appears.


14/23

MULTIMEDIA

120

5. In the Sound Properties dialog, locate where the length of file is located.

Since the sound file is 5.6 seconds long, it will play for approximately 68 frames. (5.6 x 12fps)

6. Close the Sound Properties dialog box and select frame 68 of the Audio layer. Insert a regularframe (F5).

The waveform representation of the file shows from frames 1 through frame 68. It appears that

the sound file has finished playing when we reach frame 68.

7. Insert a blank keyframe in frame 69 of the Audio layer.

8. Drag the file tipster2.mp3 to the Stage.

9. Check the Sound Properties dialog box to determine the length of the file tipster2.mp3. Add

the appropriate number of frames to the Audio layer to play the entire tipster2.mp3 file.


15/23

MULTIMEDIA

121

10. Insert a blank keyframe 1 frame aer the tipster2.mp3 file is completed playing. Add the

tipster3.mp3 sound file to the Audio layer aer tipster2.mp3.

Once you have added this file and expanded the frames of the file in the Timeline, the audio layershould have approximately 395 frames.

11. Select frame 1 of the Tipster layer and drag BothTipsters to the Stage. Scale the tipsters to

200 percent and center them in the middle of the Stage.

12. Find the frame where the sound file tipster2.mp3 begins to play and insert a blank keyframe

in the Tipster layer on the same frame.

13. Drag MaleTipster to the Stage. Scale the tipster to 200 percent and center in the middle of

the Stage.

14. Add the FemaleTipster in the Tipster layer to appear when tipster3.mp3 begins to play.

15. Set the end frame of the Tipster layer and the Background layer to the frame where the Audio

layer ends.

16. Insert Tipster1 Text, Tipster2 Text, and Tipster3 Text to correspond with the appropriate

audio and tipster files.

17. Save and test the movie.

The audio narration and the images should be in sync.

18. Save and close the file.


16/23

MULTIMEDIA

122

ADDING SOUND TO BUTTONS

Adding sound to buons can be a blessing or a nuisance to your audience, depending on how youapply the sounds.

Adding sound to buons is similar to adding sound in the main timeline, with one major difference

you place buon sounds in keyframes in the buon states that you want sound in.

To add a click sound, youll add sound to the Down state. To add a rollover sound, youll need

to add sound to the Over state.

To ensure that only one instance of a sound clip plays at one time, youll need to use the Start as Sync

menu seing in the Property Inspector.

Exercise 7.5: Adding Sounds to Buttons

1. Create a new Flash document.

2. Import the sounds Sound10.mp3 and Sound11.mp3 to the Library from the student files in

the Chapter7 folder.

3. Open the Buons Common Library (Windows -> Other Panels -> Common Libraries ->Buons).

4. Select 2 different buons from the Ovals buon category and drag them to the Stage.

5. Double-click on the first buon to edit the buon.

The Buon editing Timeline appears. (Note: If double-clicking the buon doesnt open the Buon

editing Timeline, you need to turn off Enable Simple Buons from the Control menu.)

6. Add a new layer and name it Sounds.

7. Select the Over state in the Sounds layer and insert a blank keyframe.

8. Drag the sound Sound10.mp3 to the stage with the Over state in the Sounds layer selected.


17/23

MULTIMEDIA

123

9. Exit Buon edit mode.

10. Double-click on the second buon to edit the buon.

11. Select the Down state in the Sounds layer and insert a blank keyframe.

12. Drag the sound Sound11.mp3 to the stage with the Down state in the Sounds layer selected.

13. Exit Buon edit mode.

14. Test the movie.

The first buon will play a sound on a roll-over, the second buon will play a sound when the

mouse is pressed down.

15. To test how the Start as Sync function works, add a blank keyframe to the Down state on the

first buon, and add Sound11.mp3 to the Down state. Add a blank keyframe to the Over

state on the second buon and add Sound10.mp3 to the Over state.

16. In the second buon, select the Over state and in the Property inspector, set the Sync drop-

down menu to Start. Repeat this for the Down state.

17. Test the movie.

When you mouse in and out over the first buon, the sound will start repeatedly. On the second

buon, the sound wont begin again until the preceding sound playback is completed.

18. Close the movie.


18/23

MULTIMEDIA

124

COMPRESSING SOUNDS

When you stream a Flash movie over the Internet, the size of the file becomes very important. Whenyou incorporate sounds into your movie, Flash automatically compresses the sound files to make

them more easily used over slower connections. Ultimately, youll need to determine the balance

between the size of your Flash movie and the quality of the sound files in your movie.

Publish Settings

You use the Publish Seings dialog box to determine

global audio seings. You can access the Publish Seings

controls from the Property inspector, or you can chooseFile -> Publish Seings from the main menu bar.

Two types of audio compression methods are available

by default: Audio Stream compression, and Audio

Event compression. A streaming sound plays as soon

as enough data for the first few frames downloads; it is

synchronized to the Timeline. An event sound does not

play until it downloads completely, and it continues to

play until explicitly stopped.

By default, both of the audio export seings are set to

Mono with a 16 kbps bit rate. To change these seings,

you can click the corresponding Set buon. There are

four different compression choices, each of which has

different options available.


19/23

MULTIMEDIA

125

MP3 Audio Settings

MP3 is the default format for export. The MP3 seings on the Sound Dialog box are:

Bit Rate. The bit rate is the size of the file per second in kilobits. The larger the file size, a loweramount of compression is used, resulting in a higher-quality sound. To achieve CD-quality sound,

set the bit rate between 160 and 192 kilobits. To produce good quality sound, set the bit rate to 64

kilobits. If you are going to be streaming the file over a slow internet connection, set the bit rate

between 16 and 32 kilobits.

Quality. The type of audio you plan to export determines the quality seings that you choose. If the

file contains only voice, choose the Fast seing. To create the best sounding files, choose the Best

seing.

Preprocessing.The Convert Stereo to Mono seing automatically mixes both channels into a single

channel. This option is available with bit rates higher than 20 kbps.


20/23

MULTIMEDIA

126

ADPCM

Before MP3 became the export standard for Flash, ADPCM was the standard. This format does not

create files that are smaller or of higher quality than MP3 files, but you can use it with the FlashPlayer 3. You can modify the sample rate, but do not increase the sample rate higher than the source

file; doing so yields a larger file size with no increase in quality.

Raw Sound

The seing exports audio in an uncompressed state. Even though purists find uncompressed audio

the only acceptable sound, the resulting file size is unreasonably large for use on the Internet. If you

plan on distributing your Flash movie on CD or DVD, you can certainly consider using this format. It

is likely, however, that an MP3 file with a high bit rate could produce comparable sound quality witha much smaller file size.

Speech

When compared with music, which includes greatly varying frequencies that require complex

compression, the range of human voice is rather narrow. Due to this narrow range, you can compress

speech and retain high quality you do not have to sacrifice file size for quality. If you are using a

voice narration in your project, the Speech seing is one to consider.

Modifying Compression Settings for Individual Sound Files

To change the compression of an individual sound file, select the file in the Library and double-

click it, or choose Properties from the Library Options menu. The Sound Properties dialog appears,

providing information on file size and current compression seings. From here, you can change the

default compression seings to more appropriate choices for the particular file.

Once the new compression seings are in place, click to the Test buon to hear the sound as the user

will hear it in the exported movie. This may take some time, depending on the length of the sound

file, the compression applied, and the speed of your computer.

When you are satisfied with the sound quality and file size of your custom compression seings,

click OK to save your changes.


21/23

MULTIMEDIA

127

IMPORTING AND PLAYING VIDEO

Similar to importing images and sounds into your Flash movies, you can also import video files. Ifthe size of a video file is small enough, you can embed the file directly into your Flash movie. You

can choose to import the file to a currently selected keyframe in the Timeline and onto the stage, or

you can import the file to the Library.

When you choose to import a video file into a Flash movie, the Video Import Wizard automatically

launches. From here, you can directly embed the file or link to an external video file. In most

circumstances, you will want to choose the Embed option, unless you need to support Flash Player 5,

which does not support embedded video files.

Timeline Selection

You can add video files to the main Timeline or to a movie clips Timeline. If you place the video

on the main Timeline, you can play the video back on the stage without having to publish or test

the movie. If you place the video in a movie clip, you can only view the footage upon testing or

publishing the movie.

When you import a video clip, Flash prompts you to add frames to the current timeline. If you intend

to use the video clip in the currently selected timeline, you can simply click Yes, and Flash adds the

appropriate number of frames to the Timeline. If you want to import the video clip directly to theLibrary, you can choose File -> Import to Library. In this case, Flash does not prompt you to add

frames to the Timeline until you drag the clip from the Library to the Stage.


22/23

MULTIMEDIA

128

Exercise 7.6: Importing Video

1. Create a new Flash document.

2. Select Frame 1 of Layer 1 to select it.

3. Choose File -> Import to Stage

4. From the student files, select Chapter7 / jump.mov. Click the Open/Import buon.

The Video Import Wizard appears, providing complete control over the entire importing process.

5. Choose the Embed option. Click the Next buon.

6. In the dialog box that appears, choose Import the entire video. Click the Next buon.7.

7. In the dialog box that appears, chose Corporate LAN 150 kbps from the Compression profile

drop-down menu.

This choice tells Flash that your audience is most likely to view your Flash movie over a LAN to

download and view the file. Flash compresses the video according to this seing. The importing

progress bar shows you the status of the compression and import.


23/23

MULTIMEDIA

129

8. When Flash displays a confirmation box about the number of frames the video requires on the

main Timeline, click Yes.

9. Click Finish to complete the importing procedure.

The footage appears on the Stage, and the additional frames fill with gray in the main Timeline.

10. Play the movie on the Stage to view the video clip.

11. Close the file.

CH7-Multimedia.pdf

Documents