This very useful lesson will show you and teach how to create very modern and advanced photography flash menu. To create this lesson, you have to use eight photos and flash 8 filters. You have alos used action script code to make this lesson. You will also learn:

1. How to design photo menu,
2. How to apply action script code on it,
3. How to animate it,
4. How to import any photos into a flash and much more!

You can use this modern menu for any web site. Let's go!

Step 1

Open a new flash document. Select Modify > Document (shortcut key: Ctrl+J ). Set the width of your document to 440 pixels and the height to 400 pixels. Select white as background color and set your Flash movie's frame rate to 28 fps. Then, click ok.

Step 2

Download my photos to quickly create this tutorial. After you have downloaded my photos, unzip the zip file and place that pictures on some folder.

Step 3

Choose File > Import > Import to Library. In the file explorer window that appears, find a eight photos (photo1, photo2...) and Shift-click to select them all.Then click open. If you now open your flash library (Ctrl+L key) you will see a four photos that you just imported. See the picture below.


Step 4

Take the Selection Tool (V), and using the "drag and drop" technique, move the all photos from the library on the stage, and place it on the position like it is shown on the picture below.


Step 5

Take the Selection Tool (V) and select the first photo and press F8 key on the keyboard (Convert to Symbol) to convert this photo into a Movie Clip Symbol.


Step 6

While the new made Movie Clip is still selected, go to the Properties Panel below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip photo1. See the picture below.


Step 7

Double-click on the movie clip on stage with the Selection tool(V).You should now be inside the Movie Clip.


Step 8

While the photo is still selected, press again F8 key (Convert to Symbol) to convert this photo again into a Movie Clip Symbol.


Step 9

Click after that on frame 15 and press F6 key. While You're still on frame 15, take the Selection Tool (V) and click once on the photo to select it. After that, go to the Properties Panel (Ctrl+F3) below the stage.Click on the Filters tab in the Properties Panel.After that, click on the plus icon and select the Bevel filter. Make the adjustements as follows:

1. Blur X and Y : 20
2. Quality : Low
3. Strenght: 1000%
4. Shadow and Highlight:#666666
5. Type:Inner


Now, you have this:


Step 10

Right-click again anywhere on the gray area between the frame 1 and frame 15 on the timeline and choose Create Motion Tween from the menu that appears.


Step 11

Create a new layer above the layer 1 and name it text. Click on frame 15 of layer text and press F6 key.

Step 12

After that, take the Text Tool (A) and go to the Properties Panel (Ctrl+F3) below the stage. Then, choose the following options:

1. Select a Static Text field ,
2. Select a Trebuchet MS as font.
3. Choose 11 as font size,
4. Select white as color,
5. As the rendering option, select Use Anti-alias for readability.


Then, type on the down right line of photos "About us". See the picture below.


Step 13

Press after that F6 key four times.

Step 14

Then, click on frame 16 and 18 and press delete key on the keyboard.See the picture below.

Step 15

We're done with animation and it's time for action script, so go back on the main scene (Scene 1).


Step 16

Double click on layer 1 to rename its name into a photography menu. After that, create a new layer above the layer photograpy menu and name it invisible button.

Step 17

Then, create the invisible button ove the first photo. See the picture below.


Step 18

Take the Selection Tool (V), click once on the invisible button to select it and go the Action Script Panel (Shortcut key: F9). Then, enter the following action script code inside the actions panel:

on (rollOver) {
_root.mouse_over_photo1 = true;
} on (rollOut) {
_root.mouse_over_photo1 = fstartlse;
} on (release){
getURL("http://www.flashvault.net/");
}

Step 19

Create a new layer above the invisible button layer and name it action.

Step 20

Click on the first frame of layer action , go again to the Action Script Panel (F9), and enter this code inside the action panel:

_root.photo1.onEnterFrame = function() {
if (mouse_over_photo1) {
_root.photo1.nextFrame();
} else {
_root.photo1.prevFrame();
}
};

We're done with the first photo. Repeat this process for every other photos in menu.Only difference is that you must to use another instanca name.

Enjoy!









[Via flashvault]