» Audio Spectrum Effect [FlashMX]

I'm not sure if this is the real name of what I'm going to talk about - sound bars, or audio bars - if you know it please leave a comment so I can change it.



Since everyone listens to music I suppose everyone has already seen this bars. I made it a year ago when I was finishing school and I was doing a web-site for a band and I needed something like this, but i didn't use it. Why? Because this isn't "real", it's just a "fake" animation.

I also found a component for Flash MX that was supposed to do this real animation, but guess what, it didn't worked...

So, if you're searching for an easy way to do this animation you'll find it below!

1 » You need to add 2 layers and call it "action" and "bars".

2 » Draw a vertical bar on your bars layer. Then select the 2nd frame of that layer and press F5. Now select your bar and press F8, choose "movie clip" and click OK. Your bar is now a movie clip! Then change the instance name to bar1.
(if you don't know where is that "instance name" box check this image from my latest tutorial)

3 » Go to your action layer and select the 1st frame, then press F9 and type the code below:
num1=random(120);
setProperty(_root.bar1, _yscale, num1);

The first line will generate a random number between 0 and 120 and host it on var num1.
(is also recommended to use the function Math.random(); instead of random(); but that didn't work as well on Flash MX, try it yourself!)
The second line will change the height of the object bar1 with the value hosted on var num1.

4 » Now select the 2nd frame of your action layer and press F6, then press F9 and type gotoAndPlay(1); to make a cycle between the 1st and 2nd frames.

(your timeline should look like this)

5 » You have finished your work in one bar, now you just have to copy your movie clip bar1 and create as many others as you wish, BUT, after that you must change their names because there can't be 2 bars with the same name (actually it can, but we don't want it). Select each bar separately and change its instance name to bar2, then bar3, bar4, bar5 and so on...

Then you have to create the function for each bar, select the 1st frame of action layer and copy/paste that 2 lines and replace the names bar1 with bar2 (or other number) and num1 to num2 (depending on which bar you're working).


And that's it, now you just have to save it and enjoy your "sound bars" effect!

Download link: http://www.sendspace.com/file/x1ezjn
(password: www.weknowyousuck.blogspot.com)

» List Menu Roll Over Effect [FlashMX]

Here is a simple flash effect for list menus, i didn't do this for help anyone in specific so if you want to use this just download it, or make it yourself!



1 » First of all you must create 3 new layers for hosting each object you're going to do and give some names.


2 » Then select the layer on the bottom - btn - and draw a rectangle. This is your button! Use the align window (CTRL+K) and align your rectangle on the left edge.


3 » You can now convert your rectangle into a button, select your rectangle by double-clicking it and press F8. Then choose the Button option and click OK.


4 » Now you're going to create the animation movie clip, copy your button (CTRL+C), select the layer above - movie - and paste in the same place (CTRL+SHIFT+V), now lock the other layers so you don't make mistakes (right-click on that layer > lock others).


5 » After that, select your object on the middle layer and break apart (CTRL+B) so it goes again into shape. Press F8, select "movie clip" and then OK.

6 » Double-click your movie clip to enter inside it.
Now delete its stroke and change its fill's color to blue for example. To delete only the stroke just roll your mouse over it and mind the symbol on the right of mouse's arrow, then double-click it and delete. Then select the shape and change the color.

7 » Let's do the animation! Click on the 5th frame on the timeline and press F5, then right-click it and choose "create motion tween" then press F6. Now select the first frame and use the transform tool (Q) to make your rectangle smaller (just change the height) by dragging the black point on the middle-bottom to the top (while pressing ALT). Then go to Properties (if you're not seeing it right-click and select "properties") and on the right side of that window you'll see "color: none", click it and choose Alpha and use 1% as its value. Then select the 25th frame and press F6 and do the same instructions (scale and alpha) but instead of pressing ALT while scaling, don't press any key, so it will reduce the height to the middle of the object.


8 » Now select the 1st frame and press F9 and type stop(); on that actions window. Then do the same thing for the 5th frame (mind the little "a" on both frames).


9 » Let's exit the movie clip by double-clicking any white space on the drawing area and while it's still selected type "j1" on that "instance name" area and press enter.


10 » Now lock the movie layer and unlock the btn layer by pressing the lock or the point.
Select your button and press F9 and type this:
on (rollOver) {
_root.j1.gotoAndPlay(2);
}
on (rollOut, releaseOutside) {
_root.j1.gotoAndPlay(6);
}




11 » Then you might want to add some text to your menu item, you can do that on the first layer. Using the text tool (T).

12 » If you want to do more items you can duplicate the button and movie clip, BUT you must also change the action script and instance names, so they match each other.
For example: you have the movie j1 and you duplicate it, you must rename it j2. Then duplicate the button and on its action script you just need replace "j1" with "j2".



I didn't want this to be so long... anyway, i hope you understand and at least try to do it before you download it.

Download link: http://www.sendspace.com/file/uvv8gt
(password: www.weknowyousuck.blogspot.com)