Saturday, March 29, 2008

Drop Down Menus - Be a Flash Menu Master!

Flash sites are generally not known for their user-friendliness. Almost every place has a non-standard user interface, which may mean that the problems while surfing your guests how they spend precious time getting used interface.
One your user interface that most people who have used a computer , for more than 20 minutes can handle is the drop-down menu. Quick and easy to make, if you know what you are doing, they are ideal for sites and projects dealing with enlargement in mind. Add another item, add another option in one of the menus.
This example, is actually based on a drop-down menu Flash file, see http://www.jake-man.co. uk /, a personal website of mine, I have over video-game consoles. As I have already collected more consoles, I needed to be able to include them in certain genres, on the console processor. The drop-down menu as a great opportunity to show them how I could just add more items, as and when, as part of this needed.
The clever drop-down menu is the invisible button " ", from any Flash designer best weapons! No matter what project I work, I end with an invisible button somewhere.
Basically an invisible button is only a flash button, with no content in the first 3 frames, just an object, form in the hit list. Can be extended to these sounds in the " " takeover of the stage, so that a user scrolls through the invisible button, a sound plays. There is a lot to be able to use it, so it is good to start with them as soon as possible.
What do I need before I start? You need Macromedia Flash 5, which is on the cover CD
How difficult is it? Easy - a knowledge of buttons and frames labels and film clips should all need.
How long will it take? 10-15 minutes
Walk: A walk through the 14 stage of the software with a gripper for each phase and 50-60 words.
Stage 1 First things first decide the size of your movie, frame rate and background color. You can change this later, but it may give you some headaches drastically change if you scene sizes. I chose a black background, a frame rate of 21 fps, and a size of 120 pixels wide and 400 pixels tall.
Stage 2 It is time for our main menu options. For my console website, I have grouped all of the processor. 8 bit, 16 bit, and so on. Add each menu item as separate parts of the text may also be that the font and color now.
Stage 3 Select the first option, and press F8 (or select Insert " " > " icon to convert ) and the name of the film something useful. For the 8-bit " " piece of text, I will be the name of the film " text-8bit ". Do the same with all the other separate menu item text.
Stage 4 Now select the " 8 bit " film clip and make a new movie clip by pressing the F8 again. Name this one " menu 8bit ". Edit the newly created " 8bit menu " by double clicking on the (initially confusing, I know!) In the library and the creation of the layers as in the picture.
Stage 5 We are now ready to work how our menu will behave. We need a framework for a menu inactive state, and a framework for the menu item is clicked. Add keyframes on Frame 5, and add a label called " closed " in frame 1, and a label named " Open " under 10.
Stage 6, we need a little about this actionscript 2 marked frames, nothing major, just a stop command to the film of rolling stock as well as its own. Add the command to each frame, as in our time picture.
Stage 7 invisible to ". Create a rectangle into an empty level under the heading " 8 bit " menu option. Select the rectangle, and hit F8 again, give the button a name, I suggest " button menu invisible ". Edit this button by double-clicking on its name in the library.
Stage 8 Here is the clever part simply grab the keyframe in the " up " state of the button and drag it on and ; quot; hits " framework. This should be done on a blank keyframe on the " up ", " over " and " down " States, but a rectangle in the hit list. The button is not visible feedback in this state, but the hot spot. Great for adding buttons, photos or artwork
Stage 9 but we want a menu. So we need to get something in the framework of the Rollover invisible button, then copy the rectangle from the Hit area and select Edit " " > " " paste in the city " to duplicate. Now you can get the color, transparency, add a sound effect, etc. Are the same in the " down " framework
Stage 10 So, we have expanded our menu option in the first frame, complete with of a button, needs a script so Click on the button once to open the window actionscript, and then double-click the Go To command in Basic Actions. Select " Type: Frame label " and enter " " open in the box, and turn off the option to " Go And Play " box.
Stage 11 In the framework " " open our menu, we need to see the list of options that appear when our 8-bit " " menu below. I have a few names of some consoles try and hold the first list item just where the 8-bit " ". Create a new layer at the bottom and add a background space, so that your menu blocked the other options, if clicked.
Stage 12 in the lower level of the menu items in the open " " frame, I go " to draw key " invisible menu in the library, one for each option and the size to match it. The script for each of these keys determines where the user is, if they Click in this case, I am simply in a different Web page loaded in a frame, you can use the script in the picture.
Stage 13 Finally, When the user " " roles from the menu, we want to return to the closed " ". The best way to ensure this is done, have 3 or 4 giant invisible hit areas to catch the user moves the mouse. Create a more invisible button, as in the Phase 8, just filling in the hit list, and add the script into the new button, as in the picture, then double twice.
Stage 14 Repeat this process for each main menu you need . I followed the whole process 4 times for my menu. Make sure that the re-use, the invisible buttons as often as possible, as this reduces the file size of the final film. For a simple menu does not have to be more than 200k! Http: / / www.jp74.com arlean keith



Bookmark it: del.icio.usdigg.comreddit.comnetvouz.comgoogle.comyahoo.comtechnorati.comfurl.netbloglines.comsocialdust.comma.gnolia.comnewsvine.comslashdot.orgsimpy.com

No comments: