340 likes | 533 Views
Flash Audio. Dawn Pedersen. Flash Audio Formats. Flash can handle many of the major audio formats, including these common ones: MP3 (Moving Pictures Expert Group Level-2 Layer-3 Audio—.mp3 extension) WAV (.wav extension) QuickTime (.qt or . mov extension)
E N D
Flash Audio Dawn Pedersen
Flash Audio Formats • Flash can handle many of the major audio formats, including these common ones: • MP3 (Moving Pictures Expert Group Level-2 Layer-3 Audio—.mp3 extension) • WAV (.wav extension) • QuickTime (.qt or .mov extension) • AIFF (Audio Interchange File Format—.aif extension) • AAC (Advanced Audio Coding—.aac extension)
Waveform • Sound is traditionally visualized as waves. • The shape of the wave defines numbers that encode the sound. • The horizontal line is silence. • Audio is measured from the top of one blip to the top of the next one. • These blips arecalled peaks.
Sample Rate • Sampling is done from peak to peak. • Top peaks are positive numbers and bottom peaks are negative. • For any sound to be digitized (similar to how color is digitized in Photoshop,) the wave needs to be sampled. • A sample is a snapshot of a waveform between peaks at any given time.
Sample Rate • This snapshot is a number representing where on the waveform the snapshot was taken. • How often the waveform is sampled is called the sample rate. Low Sample Rate High Sample Rate
Bit Depth • Bit depth is the resolution of the sample. • A bit depth of 8 bits means that the snapshot is represented as a number between -128 to 127. • Bits are computer data describing whether an electrical circuit is on or off. • One is represented by a 1, and off is represented by a 0. This method of expressing data is called binary, because there are two possibilities. • 8 bits means 8 possibilities of either 1 or 0, therefore 2 to the 8th power (28). This equals 256 possibilities.
Bit Depth • A bit depth of 16 bits means that the snapshot is represented as a number between -32,768 to 32,767 (over 65,000 potential samples.) • The greater the number of potential samples of a wave, the more accurate the sound.
Kilohertz • One wave cycle in 1 second is known as a hertz (which cannot be heard by the human ear.) • Audible sound uses thousands of these waves, crammed into a 1-second time span. • A thousand waveform cycles in 1 second is called a kilohertz.
Kilohertz • Audio CDs are typically sampled at the frequency of 44.1 thousand waves per second (44.1 kHz). • These waves are commonly referred to as the sample rate.
File Size • The more samples per wave and the more accurate the samples, the larger the file size. • The potential for huge sound files is there—not a good situation when dealing with Flash. • Large files take a very long time to load into a browser. • One way of dealing with this is to reduce the sample rate (number of waves per second—kHz).
File Size • Reduction of sample rate has a corresponding reduction in audio quality. • As a Flash designer, your objective is to obtain the best quality sound at the smallest file size. • Many designers say that 16-bit, 44.1 kHz is a good standard. • However, it’s really unnecessarily high for sounds such as simple mouse clicks, or for music listened to through inexpensive PC speakers. • In these cases, 16-bit and 22.05 kHz are fine.
Flash and MP3 • The 2 most common audio formats imported for use in Flash are WAV and AIFF. • Like video, sound contains a huge amount of data and must be compressed before it is used. • This is the purpose of a codec (enCODer/DECoder.) • Flash uses the MP3 codec to output audio.
Flash and MP3 • WAV and AIFF files are converted to MP3 files on playback. • It’s best to start with the purer WAV and AIFF files and have Flash convert to a smaller MP3 file size. • MP3 uses perceptual encoding: • It tosses a ton of audio information into the trash. • This corresponds to a decrease in file size. • The information tossed is typically inaudible to human ears anyway.
Importing an Audio File • Create a new Flash document. • File > Import > Import to Library (audio files cannot be imported directly to the stage) • Select PreachersAndThieves.mp3 • Open the Library panel and select the new audio file. You will see the file’s waveform in the preview pane. • In the Library panel’s panel menu, select Play to test the sound file (stop it from the same menu.)
Setting Sound Properties • Double-click the speaker icon for the audio file. The Sound Properties dialog box appears. • Notice the options available: • Test and Stop to play the file and stop it. • Update to replace the imported copy with the edited version. • Import to replace the file with another. • Audio information under the path and date. • Compression drop-down, in which you select a codec.
Setting Sound Properties • Select MP3 for Compression. • Click the Test button—you may notice flatter sound quality. The file size is markedly decreased. • Change the Bit Rate to 48 kbps. • Select Best in the Quality dropdown. • Click Test again and listen for the improved audio quality. The file size is significantly increased. • Close the dialog box and the Flash movie without saving changes.
Using Audio in Flash • Flash has two main types of sound: event and streaming • Event sound tells Flash to load a sound completely into memory before playing it. • It does not start loading into memory until the playhead encounters the frame with this audio. • Once loaded, the sound continues to play, even if the movie’s playhead stops.
Using Audio in Flash • Event sounds are not locked into the Timeline. • Depending on the user’s computer, audio and animation may not synchronize. • This type of sound is ideal for pops, clicks, or other very short sounds.
Using Audio in Flash • Streaming sound can begin playing before it is fully loaded into memory. • The trade-off is that it must be reloaded every time you want to play it. • This sound type is ideal for longer background soundtracks that play only once. • Because it is locked in step with the Timeline, streaming sound is the only realistic option for cartoon lip-synching, or any scenario that requires tight audio-visual integration.
Event Sound • Open the Bang.flafile. It includes a kaboom.mp3 audio file in the Library. • Rename Layer1 as Audio. • Drag the kaboom.mp3symbol from the Library onto the stage. • Notice the small blue line running through Frame 1 (this is the start of the waveform.) • Insert a frame at frame 97 (F5)—you should now see the entire waveform.
Event Sound • Right-click (Mac: Ctrl-click) on the layer name and select Properties. • In the Layer Properties dialog box, select 300% from the Layer height dropdown. • Click OK. Now the waveform is in greater detail. This can be instrumental in timing animation, because you can more clearly see the peaks and valleys. • Click in the waveform on the Timeline anywhere but frame 1.
Event Sound • In the Properties panel, select Event from the Sync dropdown menu in the Sound area. • Press Enter/Return. The playhead moves but the sound does not play. • Drag the playhead to frame 1 and press Enter/Return again. • You can preview event sounds only by playing them in their entirety, and only from the keyframe in which they appear.
Streaming Sound • Change the Sync setting to Stream. • Drag the playhead across the timeline. Notice that you can hear the sound as you scrub across. • Drag the playhead to frame 2 and press Enter/Return. The sound plays from that point forward. • Press Enter/Return again. The sound stops. • Streaming playback lasts only for the frame span on the timeline.
Keeping Sounds from Overlapping • Add a new timeline layer named audio2. • Add a keyframe to frame 20 of this layer (F6). • Select the new keyframe, and drag kaboom.mp3onto the stage. Now you have two layers associated with the explosion sound. • In the same keyframe, set the Sync property to Event. • Drag the playhead to frame 1 and press Enter/Return. You will hear two explosions.
Keeping Sounds from Overlapping • Change the Sync property for frame 8 of the audio2 layer to Stop. • Press Enter/Return again from frame 1. • You’ll hear only a single explosion. • Its sound gets cut off halfway through. • That’s the playhead encountering the Stop keyframe. • A Stop keyframe doesn’t halt all sounds—the halted sound must be specified.
Keeping Sounds from Overlapping • Change the Sync property for frame 20 of the audio2 layer to Start. • Drag the Keyframe at frame 20 until you move past the waveform in the Audio layer. Frame 16 should do it. • Move the playhead to frame 1 and press Enter/Return. You should hear one explosion after another. • Users on slower computers might hear only one explosion, because the first sound may not have finished by the time the playhead hit frame 16.
Removing an Audio File from the Timeline • Audio files can’t be deleted directly from the timeline. • Hold down the Shift key and select frames 1 and 15 in the Audio layer to select the audio file. Press the Delete key—nothing happens. • Select any frame within the audio layer’s waveform. • In the Properties panel, select None from the Name dropdown. The sound is removed. • Close bang.flawithout saving your changes.
Looping Audio • Open FrogLoop.fla. • Notice the audio layer—it has the same ribbit, happening only once (even though the timeline spans 60 frames.) • Select anywhere inside the waveform. • In the Property panel, look for the Repeat dropdown; change the 1 next to it to 4. The waveform will repeat 4 times. • Scrub the timeline—because this is an Event sound, we do not hear playback.
Looping Audio • Click in frame 1 and press Enter/Return to hear the 4 ribbits. • Set the Sync to Stream. Streaming audio can be looped just like event audio. • Scrub the playhead again. • Change the Repeat dropdown to Loop. • Test the movie. Now the sound will play forever in the SWF, unless you stop it with a Stop keyframe layer in the timeline. • Close the FrogLoop.fla without saving changes.
Add Sound to a Button • Create a new Flash file. • Import kaboom.mp3into the Library. • Select Window > Common Libraries > Buttons to open a collection of preset buttons. • Scroll down to the playback flat folder in the Buttons library, open it, and drag a copy of the flat blue play button to the stage. • Double-click the button on the stage to open it in the Symbol Editor.
Add Sound to a Button • Add a new layer named audio and add a keyframe (F6) to the Down area of the audio layer. • With the keyframe selected, drag a copy of the kaboom.mp3audio file onto the stage. • Click in the waveform. • In the Properties panel, set the Sync to Event (if you had chosen Stream, the audio would not be able to play completely.)
Add Sound to a Button • Click Scene 1 to return to the main timeline. • Control > Enable Simple Buttons. • Click the button on stage to hear the explosion. Click it several times rapidly—you will hear the sound repeated for each click, all overlapping if you go fast enough. • Control > Enable Simple Buttons (to disable it.) • Double-click the symbol again to edit it.
Add Sound to a Button • Click on the Down keyframe in the audio layer. • Change the Sync setting from Event to Start. • Return to the main timeline and Enable Simple Buttons again. • Click the button rapidly again—subsequent ribbits will only begin with the previous one has finished.