web design template web design template web design template

Page : 1 2 3 4

1. Insert a new layer (Choose Insert > Layer) above the layer named as 'Button Panel'

2. Rename the layer as 'Border'

3. On the layer named as 'Border', draw only a rectangular outline with the 'Rectangle Tool' , width = 418 px,
height = 240 px,
color value of the outline = #9BAFC8

4. Select the rectangular outline, convert it into a Movie Clip with the top-left Registration point selected and name it as 'border'

5. Select the Movie Clip named as 'border', choose Window > Info

6. In the Info panel, set x position = 0 and y position = 0, keeping top-left Registration point selected.

7. Choose Control > Test Movie


1. Insert a new layer (Choose Insert > Layer) above the layer named as 'Button Panel'

2. Rename the layer as 'Logo'

3. Import (Choose File > Import) the logo in any format supported by Flash MX or create your logo in flash and convert it into a Movie Clip with the top-left Registration point selected and name it as 'Logo'

1. Insert a new layer (Choose Insert > Layer) above the layer named as 'Logo'

2. Rename the layer as 'Title'

3. On the layer named as 'Title', type the following text 'Dynamic Images Slider' with the Text Tool and in the Properties panel apply the following text settings : Text Type = Static Text, Font = Impact, Font Size = 14, Text (fill) Color = #535E6C, Text Align = Align Right and Character Spacing = 1.

4. Choose Control > Test Movie

Layout will appear as shown in the image given below.


1. Insert a new layer (Choose Insert > Layer) above the layer named as 'Button Panel'

2. Rename the layer as 'Buttons'

3. Double click on the 'Rectangle Tool' to open Rectangle Settings panel, specify Corner Radius = 10 Points so that the drawn rectangle is a rounded corner rectangle.

4. Draw the rectangle of height = 79 px and width = 79 px, as shown in the image given below.

5. Since we want the button to be rounded cornered from the top ends and of height = 31 px from the top, we will delete the lower portion of the rectangle as shown in the image given below.

6. Use the 'Paint Bucket Tool' to apply Liner Fill in the rounded corner rectangle with color values as #FFFFFF and #9BA4B2

7. Delete outline of the rounded corner rectangle.

8. To get a proper fill effect use the 'Fill Transform Tool'

9. Click anywhere inside the gradient fill area. An rectangle that indicates the shape and location of the gradient appears around the rounded corner rectangle. The rectangle has controls for the location, width, scale, and rotation of the rectangular gradient.

10. Drag the center control down as shown in the image given below,

11. Select the rounded corner rectangle, convert it into a Movie Clip (Choose Insert > Convert to Symbol) with the top-left Registration point selected and name it as 'mouseover'

12. Select Frame 1 on the layer named as 'Buttons'

13. Convert the 'mouseover' Movie Clip into a Button (Choose Insert > Convert to Symbol) with the center Registration point selected and name it 'about us' as shown in the image given below,

14. Select Frame 1 on the layer named as 'Buttons'

15. Choose Edit > Edit in Place

16. Rename the layer as 'Mouseover Shadow'

17. Select Frame 4 i.e. Hit Area and Choose Insert > Frame, as shown in the image given below,

18. Select the layer named as 'Mouseover Shadow'

19. Choose Edit > Copy Frames

20. Insert a new layer (Choose Insert > Layer) above the layer named as 'Mouseover Shadow'

21. Rename the layer as 'Mouseover'

22. Choose Edit > Paste Frames

23. Hide the layer named as 'Mouseover'

24. At Frame 1 on layer named as 'Mouseover Shadow'. Select 'mouseover' Movie Clip, nudge it 2 px upwards and in the Properties panel select the following options: Color Style = Tint, Tint Color = #535E6C, Tint Amount = 20%.

25. Insert a Keyframe (Choose Insert > Keyframe) at Frame 2 of layer named as 'Mouseover Shadow'. Select 'mouseover' Movie Clip and in the Properties panel select the following options: Color Style = Tint, Tint Color = #535E6C, Tint Amount = 30%.






© Image Online  2001-2003