Current Mood:
Cool
I like step-by-step tutorials, don’t you?
First and foremost, we’re trying to achieve a simple button like this:
- Open Flash Mx 2004 Pro (or whatever version you have), and click on Create New {Flash Document}:

- Click on the {Insert} button on the drop down menu and then the {New Symbol…} option. A small window should popup:

- In this small window you will be able to edit 2 things: the name of the symbol and the behaviour of this symbol. A good example of a button name would be the button’s function e.g. “Profile”, “Online Store”, “My Pets”, etc. Also ensure that the behaviour is set to {button}:

- You need to select the colour you want to use for the button. Click {Fill Color} on the Tool Box and select your button’s default colour (the colour the button should be when it’s being left alone!):

- Select {Rectangle Tool} on the Toolbox. Click anywhere on the blank canvas, hold that click button and drag (click+hold+drag). Dragging determines your shape’s size:

- Set the fill colour to what you want your text colour to be, and then select {Text Tool} on the Toolbox. Click on your button and type in your button text. You can drag this text anywhere on the button. Usually, it’s typically at the center. Don’t forget that you can edit your text’s size, font, etc. at the {Properties} Panel:

So far so good? I’m stuffing myself with olives, my newly-discovered treat. LOL.
7 - Next, we’re going to set *keyframes on the {Timeline} Panel:

*What are keyframes for? They basically capture the current status of your object. When you set a keyframe, you capture the object at its present state. So at any point, when you go back to that set key frame it brings your object back to whatever state it was when you had it set.
“Up” = State of the button when it’s being left alone
“Over” = ‘Rollover’ State of the button when the cursor is moved over the button
“Down” = State of the button when someone clicks+hold their mouse button
“Hit” = State of the button when it’s been clicked on
- Set all 4 keyframes to the default button status. To do this, simply right click on the particular keyframe and select {Insert Keyframe}. Or you can use the shortcut: click on the particular keyframe and press {F6} on your keyboard (assuming you’re on Windows OS):

- For now, let’s just modify the action of the button during “rollover”. Select the {Over} Keyframe and modify your button accordingly.

- Select {Edit} from the drop down menu and click on {Edit Document} or simply press {Ctrl+E} on your keyboard. A new page will load so if you’ve noticed this change, don’t panic because that’s what’s supposed to happen:

- Select {Window} on the drop down menu and click on {Library} or simply press {Ctrl+L} on your keyboard. This opens a panel for your library items. Your button should be visible from there after clicking on your buttons name located on the panel to your right:

- Click+drag your button to the blank canvas. To test your movie, click {Control} on the drop down menu and select {Test Movie}. Or simply press {Ctrl+Enter} on your keyboard.
- If you’re happy with what you’ve done, you can export your movie. Go to {File} on the drop down menu, then {Export} > {Export Movie}. Again, if you’re the shortcut type of person (and you probably should be), simply press {Ctrl+Alt+Shift+S} simultaneously. Your file should be a .swf format. For now, just save everything under default settings.
- If you’re not happy with what you’ve done and you want to edit it your work, go to {Edit} on the drop down menu and click on {Edit Symbols} (or {Ctrl+E}). This should bring you back to the editing phase.
Ok, I’m done with this part of the tutorial. Next lesson will be shorter, I promise!