Thursday, February 5, 2015

Adding Sound to Flash Movie Timeline and Choosing Flash Sync Sound Options Flash Event Sound vs Flash Stream Sound Tutorial

This tutorial comes with exercise files. Click the link below to visit the download page:
[GO TO EXERCISE FILES DOWNLOAD PAGE]

In this Flash Sound tutorial, well be learning the basics of adding sound to Flash documents. Here, Ill show you how to add sound to the timeline of a Flash movie. Well also be taking a closer look at 2 of the Adobe Flash Sync Sound options - Flash Event Sound vs Flash Stream Sound. These are options that allow you to control the synchronization of sound in your Flash movie and well take a look at the difference between the two.

Open the add-bg-music.fla file. This is just a simple 16-second Flash animation of a jumping stickman. Take a look at the timeline and you will see a layer called bgmusic. This is where we will be placing the sound for our Flash movie. Youll see that the layer has one blank keyframe and nothing else.

NOTE: You DO NOT need a dedicated layer for your audio in Flash. You can place the sound on a layer that also has some animation in it. But even if creating a dedicated layer for your sound is not required, I would still recommend that you do so, in order to keep things more organized within your Flash document.

To add sound to Flash documents, lets first import the audio file. Import the CheerfulSong.mp3 file into the Flash document by choosing File > Import > Import to Library. Navigate to where the file is on your hard drive and import it. Once its imported, select the blank keyframe on frame 1 of the bgmusic layer. A keyframe is needed in order to place sound on a layer in the timeline.

Next, go to the Properties Inspector. Here, you should now see the frame properties. Under the SOUND heading, click on the Name drop-down menu in order to expand the list. Whenever you import an audio file into your Flash documents library, it automatically gets added to this list. You should see CheerfulSong.mp3 as the second option.

Go ahead and select it. This applies the audio to our selected keyframe.

Take a moment to look at the other properties under the sound heading. Youll see Effect and Sync.

The Effect menu lets you choose from a few basic effects that you can apply to the selected sound.

Sync is short for synchronization. The Sync options let you choose the type of synchronization that the selected sound should follow: Event, Start, Stop or Stream. You can also instruct the sound to play more than once by specifying a Repeat value greater than one, or by choosing the Loop option.

When adding sound to Flash, the synchronization options will affect how the sound behaves when it is playing. Lets take a closer look at 2 of the synchronization options - Event and Stream.

Lets try to understand the difference between those two:

Event - This synchronizes the sound in your Flash movie to an event. That event would be when the playhead enters the frame that contains the sound. Once the playhead enters that frame, the sound will start playing and will only stop when the sound is explicitly told to stop (e.g. using ActionScript code that will stop the sound). Even if the animation is already at the end, an Event sound will keep on playing until it is explicitly told to stop (or until the song reaches the end).

Stream - This synchronizes the audio to the frames of the Flash movie. When the Flash movie stops, so does the sound. Also, when there are no more frames in the layer that contains the sound, then the sound will stop playing as well, even if the other layers still have frames to play.

Lets choose the Event option first and lets see how it will work in this example. But before you test the movie, let me explain what will happen: First, you need to know that the CheerfulSong.mp3 audio file is about 30 seconds long, while the Flash animation of the jumping stickman is only 16 seconds long. So our song is almost twice as long as the animation. And also, by default, a Flash animation is going to loop. This means that when the playhead reaches the last frame, it will go back to frame 1 and play the animation again, and so on... And since the animation is shorter than the songs duration, this means that the animation will loop back even before the song reaches its end. Its important that you understand this because when you preview this animation with the Event sound, you will notice that when the Flash animation loops, the same sound will play again, but the previous instance of the sound will still continue playing. So youll end up with two instances of the song playing on top of each other. This happens because an Event sound will play every time the playhead enters the frame that contains that sound. When the animation loops, the playhead enters the frame with that sound once again, and therefore, another instance of the song is played as well. But we also know that an Event sound will not stop unless you explicitly tell it to stop. Thats why the first instance of the sound will still continue playing along with the new instance of the sound. This will keep happening as long as the animation keeps looping and the Event sound is NOT explicitly told to stop. In cases where the sound is much, much longer than the looping animation, youll end up with not just two instances of the sound playing on top of each other, but more! So go ahead and choose the Event option and then test the movie to verify what happens.

NOTE: The Start option behaves similar to the Event option in that it waits for an event (the playhead entering the frame where the sound is placed), but it differs in that the Start option will NOT play the sound again while the previous instance is still playing.

Now lets go back to the Flash document, and lets change the Sync option to Stream so we can understand how it will make the sound behave in this example. But before you test the movie, let me tell you that you will NOT hear the sound playing. Well have to fix one more thing first to make the sound work properly. But in the meantime, go ahead and test the movie to verify, and then continue reading the article.

So now that youve tested the movie, let me explain why we dont hear the sound playing: The reason why you dont hear the sound playing is because there is only one frame on the layer where we placed the sound. If you recall, the Stream option will synchronize the sound to the frames of the animation. And right now, the sound is only being synchronized to one frame. Thats not enough. So in order to hear the sound, well need to add more frames. Lets do that. Select the empty slot for frame 193 on the bgmusic layer, then right-click on it and choose Insert FRAME in order to add more frames to the layer. So now that there are more frames on the bgmusic layer, you should be able to hear the sound. Go ahead and test the movie to verify. You will notice that whenever the animation loops, the previous instance of the sound stops playing and the new instance starts from the beginning. And again, thats because the sound is being synchronized with the frames of the animation whenever the Stream option is used.

So when should I choose Event and when should I choose Stream?
Well, it really depends on what youre trying to do in your Flash movie. But as a general rule, I choose Stream whenever I need the sound to be in sync with the animation. I choose Event when I need to have a sound play regardless of how many frames I may have in the animation (for example if Id like a song to keep playing even though the animation has already reached the end). But as youve seen in the example, this can be quite tricky because Event sounds can end up playing on top of each other. So in some cases I will just choose the Start sync option or I would add some ActionScript to make sure that the sound plays the way I want it to. With Button symbols, however, when you want to add sound inside a Button symbols timeline (e.g. a sound effect whenever the user clicks on it), you must use the Event option. Button symbols timelines only have a limited number of frames (just 4 to be exact), so most likely, the Stream option wont play the sound properly in this case.

Adding sound to Flash is fairly simple. Its usually with the way the sound behaves when playing where most new Flash users have a little trouble with. Hopefully, this tutorial has made it a bit more clear for those of you who are just learning how to add sound to Flash movies.

PREVIOUS: Flash Sound Basics | Adding Sound to Flash Movies - Importing Audio Files into a Flash Documents Library