Information Technology Reference
In-Depth Information
Here is a brief summary of what we just did. We dragged our personal logo
from Fireworks directly on to the stage in Flash. All objects dragged in to Flash
from Fireworks are immediately converted to movieclip symbols. We renamed
the personal logo to
logoart.
We created a movieclip named
logo_mc
that
would act as a container for the faded logo animation. We created the faded
logo animation. Next we will create the button.
To make the button, we need to
Insert>New Symbol, button.
Name the
button
logo_btn
. The button symbol editor will open. You should recognize the
up, over, down, and hit
frame states that populate only the button symbol
editor.
1.
Click on to frame one of the up state and drag the
logoart movieclip from
the library
on to the symbol editor. Align it center to the stage with the
align panel using the set
to stage icon.
This is the static movieclip that we
dragged over from Fireworks. We will use it as the up state graphic. We
need to lower the opacity to
40 percent
to match the
logo_mc
movieclip.
Logo_mc contains the fade animation and will occupy the over state.
2.
In the second frame of the over state, drag the
logo_mc
movieclip from
the library to the symbol editor. Align it center to the stage. This movieclip
should be set in the exact same position as the logoart movieclip.
3.
Click into the over state and press
F6
to add a keyframe. Now delete the
item in the overstate. We are doing this because we need to add the
logoart movieclip in this state (align it) because we do not want the
animation to run twice in two frames. It will give a jumpy look. Using the
type tool, we want to add the text, “Enjoy the portfolio”, right below the
logo. Make sure that the type is not too large. You do not want it to
overwhelm the personal logo.
4.
Now we must add the hit state. To make a hit state in a button symbol I
typically use onion skinning to see the artwork that I am covering with the
hit box.
Onion skinning
is located under the timeline next to the layer
trash can and directly next to the center frame icon. It is an icon with two
blue boxes, the underlying box is smaller and semi transparent, the top box
is blue. That is the onion skin toggle switch. It switched onion skinning on
and off. You are probably asking, what is onion skinning? Onion skinning
provides semi transparent underlay of frames in an animation. It is useful
because it allows you to see frames that come before the frame you are
working in. We will use it to show us the up, over, and down states of our
