RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Create Sound Synchronization Magic in Flash, Part 2

Remember the speaker cabinets from the '70s, with lights that throbbed to the music? Using a powerful third-party utility for Flash, you can create games and animations that use rapid audio synchronization to drive assets with sound instead of programming.

n part 1 of this article, I showed you how to use a great third-party utility, FlashAmp, to create a simple amplitude array, and how to use amplitude and spectrum data in a variety of ways within Flash. These techniques will allow you to do a bevy of neat effects that manipulate visual assets dynamically to audio.

In this article, I'll build on that information by discussing the remaining FlashAmp settings, how to use external as well as internal sounds in your files, how to access the FlashAmp arrays properly even when your sound playback doesn't begin in frame 1, and a few tips and tricks for optimizing your data.

Using FlashAmp
Having discussed three different examples of FlashAmp output in action in part 1 of this article, I'd like to show you how simple it is to use FlashAmp itself. In short, all you need to do is configure the settings in the Settings pane, choose the file you want to analyze in the Input pane, choose where you want to save your preferred text format in the Output pane, and process the file (see Figure 1).

Common to Amplitude and Spectrum Analysis
FlashAmp requires few settings to work its magic. The settings common to both amplitude and spectrum analysis are very straightforward.

1) Frame Rate: As previously discussed, for proper sync, FlashAmp must provide as many values as there are frames per second during audio playback. If you have a 1-second song, and you are using the default Flash frame rate of 12 fps, the FlashAmp array must have 12 indices. Be sure the FlashAmp frame rate setting matches your Flash fps, or poor sync is guaranteed.

2) Scale: This arbitrary range should be set to what is most helpful to your Flash needs. We've discussed the benefits of a scale of 100 already. As another example, if you wanted to work with color values, a scale of 255 might be useful.

Figure 1. Setting Amplitude: The color numbers in this screen shot of the FlashAmp interface correspond to amplitude settings (green, 6-7), spectrum settings (red, 8-9) and settings common to both (blue, 1-5).
3) Stereo: Processing a stereo sound for stereo output will generate two similar lists of values: one for the left channel and one for the right channel. This allows you to use each array discretely to show the result of stereo separation in your visuals.

4) Normalize: This instructs FlashAmp to normalize its values before creating an output file. Normalizing an audio file will increase its volume to the loudest possible point without clipping (distorting) any part of it. This setting only affects the FlashAmp data, making the visual changes more useful, but still consistent with the sound. FlashAmp does not reprocess the audio file itself. Note that normalizing raises the amplitude data of the entire output, so it can also increase noise in the data. Where you may be expecting values of zero, you may get low positive values instead. This may be obvious in the jittering of peak meters during quiet passages.

5) Cue Points: Cue points require a bit of additional explanation, so I'll discuss them in their own section, immediately after concluding my overview of the Settings panel.

Unique to Amplitude Analysis
6) Smoothing: This setting is used when you want to make the changes in values a little smoother, rather than hyper accurate data that may jump more dramatically between values. This can sometimes help animations to appear less jittery or halting. I've provided an example of this in the "speaker.fla" source file.

7) Return dB (decibel) Scale: This setting will limit responses to those within the typical human hearing range. As the typical relative dB values are negative (like on a mixer) and this is not terribly useful in Flash, FlashAmp inverts the scale so that 0 is loudest, and everything above 50 is very quiet.

Unique to Spectrum Analysis
8) Bands: This menu allows you to choose how many divisions of frequencies FlashAmp will create values for. By default, the bands divide the frequency range of the sound into equal ranges from 20 Hz to half the sample rate of the sound. For example, a 16-band analysis for a sound with a sample rate of 22050 Hz will divide a range of 20 Hz to 11025 Hz into 16 divisions.

9) Logarithmic Bands: This option allows you to divide the total frequency range logarithmically, rather than linearly, for distribution among the bands. In most instances, this is used to achieve a more even distribution of frequency data. (The sound remains unaffected.) If you find that your analysis yielded mostly zeros in the upper frequencies, this option can help redistribute those data values a bit for a more pleasing visual effect.

1) Frame Rate Revisited: When generating spectrum data, FlashAmp needs at least 1024 frequency samples per frame in order to perform its analysis. As such, there is a limit to the number of frames per second that can be used for each sample rate. For 44.1 kHz sounds, a maximum of 43 fps can be used in your Flash file. 21 fps is the limit for 22.050 kHz sounds, and 11.025 kHz sounds cannot exceed 10 fps. This is not likely to be an issue for higher sample rates because the Flash Player performance is not likely to achieve frame rates higher than these limits. However, if you are forced to use 11.025 kHz sounds, be sure you don't exceed 10 fps in your animations.

Cue Points
In both amplitude and spectrum analysis, FlashAmp can read cue points embedded into an audio file, and can make that data available to Flash (which is great because Flash doesn't directly support audio cue points). Within its output, FlashAmp will create a "parallel" array (a separate array with the same number of indices), so you can easily look for cue point values at the same frame rate as your Flash file plays. This means you can write a simple script that will make it possible to take advantage of these audio markers.

For simplicity, I've created two arrays based on a 5-second sound and a frame rate of 1 fps. (Again, this slow frame rate is helps simplify this example.) The first array is an amplitude list, the second is a cue point list.

amplitude = [0, 10, 7, 5, 2]
cuePoints = ["", "about", "", "", "contact"]
By associating an array index with a Flash frame (offsetting the current frame by 1, as discussed earlier), you can see that this audio file is quiet in frames 1 and 5, and louder in frames 2 through 3. You can also see that the sound contains cue points, "about" and "contact," at 2 and 5 seconds, respectively. Using this information, you can easily instruct a MovieClip to navigate to a marker with the same name as the cue point. Assuming this sound is playing from frame 1 the code would look like this:

on (enterFrame) {
    thisCuePoint = _root.cuePoints[_root._currentframe-1]
    //if the value is not empty, tell a movie clip to go to
    //  the frame marker of the same name
    if (thisCuePoint != "") {
Author's Note: To follow along with this article, download the source code, including low-resolution audio files. If you want to try to analyze the sounds used herein yourself, you may also want to grab the high resolution audio files in an optional separate download.

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date