| Dear
Friend, Hello
& welcome back to Firewire,
your friendly guide to the exciting world of web-design & web-solutions!
Top panel in Flash
speeds up the whole process of web site designing. This also ensures attentions of the visitor on focused area of the site as highlighted points / features can be incorporated with Animation & sound. As major area of the page is available to incorporate keyword rich text, site passes the most important criteria for search engine friendliness. Looking at all these important factors we have decided to cover current newsletter on creating Flash Top Panel containing menu buttons. Click
here to
download the source (.fla) file.
1.
Create
a new movie with dimensions of 779px.
X 210px.
and fps
=
31 with
white color as Background
Color.
2.
Save
the flash file as 'toppanel.fla'
1.
In Photoshop create a .png image of top panel and name it as 'trace'
2. In Flash
choose File
> Import to
import trace.png for our reference 3.
Rename the Layer1
as 'Trace' 4.
With the help of Eyedropper Tool choose the
background color at the spot as shown in the image 5.
Choose Window > Color Mixer 6.
In the Color
Mixer panel,
choose 'Add Swatch' from the menu to store the selected color
7.
Similarly select another color from the background and store it into flash so
that we can create a gradient background for the top panel
8.
In the Color Mixer panel, select Fill
Style as 'Linear' and select the two colors which we
have stored. 9.
Choose Insert > Layer to insert a new
layer above Trace layer 10.
With the help of Rectangle Tool create a rectangle
of width 779px. and height 210px. to match the stage size 11.
The rectangle gets filled with the linear gradient. But we want the gradient effect
from top to bottom 12.
Choose Paint Bucket Tool from the Tool Box,
click it on top of the rectangle and drag the mouse downward so we get gradient
fill as shown in the image 13.
Select the rectangle and choose Insert > Convert to
Symbol 14.
Convert it into a Graphic with Center
registration point selected and name it as 'background'
15.
Rename the layer as 'Background' For
animating objects in the top panel we have created separate .png images from Photoshop
like center_panel.png, globe1.png, liks_panel.png, map.png, white_line.png etc. |