So now that we added this lightning effect, I think now it's time to add some sound to put it all together.
So let's get to it.
First, when we start in our Library, you see it's getting kind of sloppy, we have so many different assets now.
So what we could do is organize it by adding here a new folder.
I'll click, I add a new folder.
And maybe I'll call this...
Lightning Assets.
And inside of that folder, we could put in this folder, which is the original PSD.
And we can put in the lightning bitmap and the copy of the lightning here.
Maybe we can add another folder for SOUND.
What I could do also is in my Library, I like things to be organized, so you see how now I have one folder at the top and one folder near the bottom, I'm just going to add a little underscore.
So I'll do _SOUND, which pumps right up to the top.
I'll do that again to the Lightning Assets.
Just add an underscore, press Enter, and boom, now I have an organized Library with the folders at the top.
So we can import all types of sounds into Animate.
I can import Adobe sound files, WAV files, AIF files, MP3 files, and more.
But those are pretty much the popular ones that most people are using.
So why don't we import the sound?
So I'm going to go to File, Import, and when I import, I could either import to the Stage or just to the Library.
So the first thing I want to do when I add sound is to add a new layer.
There is no special layer or place to put sound in Animate.
So it's always best to just add a new layer for every piece of sound as if it's a new audio channel.
So I'm going to click here, and I'll put Waves, that's our first sound that we're going to import.
And with keyframe one selected, I'll go to File, Import, Import to Stage...
And when I import to the stage, it's also going to put my sound into the Library.
Here, I'll double click the Waves.mp3.
And now, we can see the Waveform here in the first keyframe on my Timeline.
And we also see now that it's placed here inside the Library.
So I'll click on the Waves.mp3, and I'll drag it into the _SOUND folder.
And now, we have our wave sound.
Nice.
So if we click on this little wave sound or the first keyframe, we can then go to the Properties panel.
And we can see that there's a place in the Properties panel for Sound.
So we also could have reselected our keyframe and then drop down from here in selected Waves.mp3.
So there are two types of sounds in Animate.
There are Event sounds and Stream sounds.
Event sounds, they must download completely before they begin playing.
And then they can play completely until they're stopped by either an ActionScript or if the sound is over.
And then the Stream sounds, which we're not able to use unfortunately with Canvas, Stream sounds begin playing as soon as the data for that first frame has been downloaded.
And then each frame is synchronized exactly to the Timeline.
So as it moves one frame, it plays that little bit of sound, it goes to the next frame and plays that little bit of sound.
And each piece of sound is broken up into the different frames.
But unfortunately, we could only use event sounds with HTML5 Canvas so that we could export and not use any kind of plugin.
In this case, we only have one.
It's called Event.
And the sound loads on the first keyframe and then plays entirely through.
We could also repeat the sound if we wanted to.
Repeat here, you'll see it says one time, which is enough for us I think for these waves since they happen to span across about 130 frames, which is pretty much my entire animation.
But if it was a longer animation, for sure it would be great to repeat the sound a certain amount of times or possibly loop it forever.
In this case though, I want it to going to repeat one time for the sound.
So we'll go back to the Library.
And this time, I want to add and import the lightning.
But I don't want to import it to the Timeline since we have to place it in three different places where the lightning is hitting.
I just want to import it to the Library.
And then I'll import it to the Timeline as I see fit.
So this time, I go to File, Import, and instead of Command R, which is Import to Stage..., I'm just going to import this straight to the Library.
I'll select the Lightning.mp3 sound and I'll double click it, and now it's imported into my Library here, and I'll drag that also into my _SOUND folder to keep everything organized.
And now, I'll go down to the Timeline and see when the lightning hits.
Right about there.
I'll add a new layer.
I'll call it Lightning.
And then right about there, I'll add a keyframe.
So I'll click on the new Insert Keyframe icon here.
And there's my keyframe, I'll click on it to select it.
And I go back to my Properties panel.
And this time, you'll see we're in the Frame section of the Properties panel, and you'll see the Sound section, and we can drop down and see all of the sounds that we currently have in our Library, which is just the Lightning.mp3 and the Waves.mp3, and I'll select the Lightning.mp3.
And I'll do that again, I'll add another layer.
We'll go down the Timeline to see when the lightning hits once again.
Right there.
And again, with that layer selected, I'll add a keyframe.
I'll double click.
Call this Lightning.
And again, I'll click on this keyframe to select it, go back to the Properties panel, and select again Lightning.mp3.
So we have one more instance to add of lightning.
And that's going to be right about here, at the frame 66 for me.
And another way we can do this is to duplicate the layer.
So I'll right click, duplicate the sound layer of the lightning.
Now, we have a lightning copy.
And I'm just going to drag it over here to 66.
So I'll click on the keyframe once and let go.
I'll click and hold down and drag it over.
So it starts at about frame 66.
There we go.
We do have a little bit of trailing garbage here because the sound is overextending my Timeline.
So I can just click and drag, select these little layers here, and then right click, Remove Frames, or press Shift F5.
So now our Timeline is getting busy as you see.
We have three different layers for the audio for Lightning, and one for the Waves.
So maybe we can organize this as well by adding a new folder.
So I'll click add a new folder.
I'll call this AUDIO or sound.
I'll drag it to the top.
And I'll click on the Lightning and press the Shift key on the Waves layer.
And I'll drag them right inside of this folder.
I can collapse it, now it's nice and neat.
And I'll press Command Enter to test.
Sounds great.
That's it.
I hope you enjoyed this tutorial on sound.
We'll see you next time.
