swfchan: Tutorial - Soundboards.swf (info)

Text

A SlimJimWeb.tk Tutorial

KEY

Last Page

Stop Music

SLIMJIMWEB.TK

Presents

HOW TO MAKE A SOUNDBOARD

OK, Welcome to the How To Make A Soundboard In
Flash Tutorial!
When you see a soundboard it isn't going to blow you
away like a Krinkels or Weebl movie. It isn't going to have
you playing for hours like a game such as Alien Hominid.
BUT, if done right, it can make people laugh, and that's
what you want.
Before you jump in you'll need to be comfortable with the
flash environment so look at the basic tutorials in the help
files if you need to. If you want to add preloaders and
other bells and whistles then look on the web
(Newgrounds.com / Flashkit.com) for more tutorials.

INTRODUCTION

Firstly you need to get your sounds. You can download them
from the web or record them yourself. Just get them together
in a folder somewhere on your harddrive. It's probably best to
give them a suitable name (ie not sound1.mp3) so you don't
have to listen to it everytime to find out what it is.
Now open up Flash (I use Flash MX Pro 2004 - but it's
basically the same as Flash MX or Flash 5). From here you
have two options; if you want to put a preloader in or other
frames for intros/credits then you'll need to add a stop();
function into the action script panel of the frame you are
putting your sounds on. If you are just having one frame (not
advised if publishing to a site like Newgrounds.com) then you
don't need the action script as it will just loop that one frame.

GETTING STARTED

If your Library Panel isn't open
then press Ctrl + L to open it.
In the menu bar goto File >
Import and click on Import To
Library. Now select all of the
sound clips that you want to
have in your soundboard and
click Open. You can preview
your sounds in the Library
Panel.

IMPORTING YOUR SOUNDS

Instead of individually creating buttons for each sound you can
create one button which can be used as a generic template for
the other buttons. Press F1 to bring up the help panel and
search for Creating Buttons or Create a Button. Put some
dummy text on the button so you can easily change it for each
sound.
Then in your Library, right click on it and select Duplicate. Copy
it as many times as you need and rename them all to something
like "button_soundfile" (where soundfile is the name of your
sound).

CREATE A BUTTON

Ok so you have your sounds and all your buttons that
need to be put on the stage. If you thought the last bit was
tedious, it gets worse!
Drag each button and edit them by double clicking on
them. Replace all dummy text with the name of your
sound file (eg Homer: D'oh). Remember to change the
text for each state of the button. A good idea is to change
the text colour for the over state so when the user puts
their mouse over the button it "highlights".
This may take some time but it will be worth it in the end.

PUTTING BUTTONS ON STAGE

Ok here is the last stage of making your soundboard. You
have your lovely buttons on the stage and now you need to
add the sounds.

ADDING THE SOUNDS

Double click on your
button and select the
Down state. Then just
drag the sound file directly
from your Library Panel
onto the crosshair in the
middle of the button.
Repeat this for all your
buttons.

Now press F12 to preview your soundboard in your browser.
Hopefully it will work perfectly. Now goto the menu bar and
select Publish Settings from the File menu. Select which
formats you want to export your movie as. I suggest .SWF,
.HTML, and .EXE. Then in the Flash tab make sure you
select Compress Movie and the latest version of Flash so
your movie will be as small as possible. Change the audio
compression settings according to the guide that can be
found on Newgrounds.com. Now you can export your movie
and send it to your friends by e-mail or upload it to
Newgrounds or do whatever you want to do with it!
Example (stop music first):

THE END!

Monty Python:
Fart

Thanks for viewing the tutorial.
Audio: Unloco Bruises
Monty Python and the Holy Grail
Tutorial By: SlimJim3:16

<a href="http://slimjimweb.tk">SLIMJIMWEB.TK</a>

<a href="mailto:reallydodgyguy@btinternet.com">EMail SlimJim 3:16</a>

REPLAY?

ActionScript [AS1/AS2]

Frame 91
	stop();
Frame 92
	stop();
Frame 93
	stop();
Frame 94
	stop();
Frame 95
	stop();
Frame 96
	stop();
Frame 97
	stop();
Frame 98
	stop();
Symbol 10 Button
on (release) {
	_root.play();
}
on (release) {
	stopAllSounds();
}
Symbol 11 MovieClip Frame 1
	_root.stop();
	PercentLoaded = (_root.getBytesLoaded() / _root.getBytesTotal()) * 100;
	if (PercentLoaded != 100) {
		setProperty(bar, _xscale , PercentLoaded);
	} else {
		gotoAndStop ("loaded");
	}
Symbol 11 MovieClip Frame 2
	gotoAndPlay (1);
Symbol 33 Button
on (release) {
	_root.play();
}
Symbol 35 Button
on (release) {
	stopAllSounds();
}
Symbol 41 Button
on (release) {
	prevFrame();
}
Symbol 73 Button
on (release) {
	_root.play();
}

Library Items

Symbol 1 Graphic	Used by:2
Symbol 2 MovieClip	Uses:1	Used by:11
Symbol 3 Graphic	Used by:11
Symbol 4 Font	Used by:5
Symbol 5 EditableText	Uses:4	Used by:11
Symbol 6 Graphic	Used by:10
Symbol 7 Graphic	Used by:10
Symbol 8 Graphic	Used by:10
Symbol 9 Graphic	Used by:10
Symbol 10 Button	Uses:6 7 8 9	Used by:11
Symbol 11 MovieClip	Uses:2 3 5 10	Used by:Timeline
Symbol 12 Bitmap	Used by:14
Symbol 13 Bitmap	Used by:14 64
Symbol 14 Graphic	Uses:12 13	Used by:Timeline
Symbol 15 Font	Used by:16 17 18 19 28 36 44 48 50 52 56 57 60 61 65 66 67 68 70
Symbol 16 Text	Uses:15	Used by:Timeline
Symbol 17 Text	Uses:15	Used by:Timeline
Symbol 18 Text	Uses:15	Used by:Timeline
Symbol 19 Text	Uses:15	Used by:Timeline
Symbol 20 Font	Used by:21 66 67
Symbol 21 Text	Uses:20	Used by:Timeline
Symbol 22 Graphic	Used by:Timeline
Symbol 23 Sound	Used by:Timeline
Symbol 24 Font	Used by:25
Symbol 25 Text	Uses:24	Used by:Timeline
Symbol 26 Font	Used by:27 29 37 45 49 51 53 58
Symbol 27 Text	Uses:26	Used by:Timeline
Symbol 28 Text	Uses:15	Used by:Timeline
Symbol 29 Text	Uses:26	Used by:Timeline
Symbol 30 Graphic	Used by:33
Symbol 31 Graphic	Used by:33
Symbol 32 Graphic	Used by:33
Symbol 33 Button	Uses:30 31 32	Used by:Timeline
Symbol 34 Graphic	Used by:35
Symbol 35 Button	Uses:34	Used by:Timeline
Symbol 36 Text	Uses:15	Used by:Timeline
Symbol 37 Text	Uses:26	Used by:Timeline
Symbol 38 Graphic	Used by:41
Symbol 39 Graphic	Used by:41
Symbol 40 Graphic	Used by:41
Symbol 41 Button	Uses:38 39 40	Used by:Timeline
Symbol 42 Bitmap	Used by:43
Symbol 43 Graphic	Uses:42	Used by:Timeline
Symbol 44 Text	Uses:15	Used by:Timeline
Symbol 45 Text	Uses:26	Used by:Timeline
Symbol 46 Bitmap	Used by:47
Symbol 47 Graphic	Uses:46	Used by:Timeline
Symbol 48 Text	Uses:15	Used by:Timeline
Symbol 49 Text	Uses:26	Used by:Timeline
Symbol 50 Text	Uses:15	Used by:Timeline
Symbol 51 Text	Uses:26	Used by:Timeline
Symbol 52 Text	Uses:15	Used by:Timeline
Symbol 53 Text	Uses:26	Used by:Timeline
Symbol 54 Bitmap	Used by:55
Symbol 55 Graphic	Uses:54	Used by:Timeline
Symbol 56 Text	Uses:15	Used by:Timeline
Symbol 57 Text	Uses:15	Used by:Timeline
Symbol 58 Text	Uses:26	Used by:Timeline
Symbol 59 Graphic	Used by:63
Symbol 60 Text	Uses:15	Used by:63
Symbol 61 Text	Uses:15	Used by:63
Symbol 62 Sound	Used by:63
Symbol 63 Button	Uses:59 60 61 62	Used by:Timeline
Symbol 64 Graphic	Uses:13	Used by:Timeline
Symbol 65 Text	Uses:15	Used by:Timeline
Symbol 66 EditableText	Uses:15 20	Used by:Timeline
Symbol 67 EditableText	Uses:15 20	Used by:Timeline
Symbol 68 Text	Uses:15	Used by:Timeline
Symbol 69 Graphic	Used by:73
Symbol 70 Text	Uses:15	Used by:73
Symbol 71 Graphic	Used by:73
Symbol 72 Graphic	Used by:73
Symbol 73 Button	Uses:69 70 71 72	Used by:Timeline

Instance Names

"bar"

Symbol 11 MovieClip Frame 1

Symbol 2 MovieClip

Labels

"loaded"

Symbol 11 MovieClip Frame 3