1.

Background Design

Aim

To Create Background Design In Flash

Procedure

1. Setting up

Open partial_tutorial from the tutorial files. This file has been set up with all the elements you need to

complete the tutorial. The stage has been set up at 900x700 pixels and the frame rate at 21 frames

per second.

2. Position the sky

Hit Ctrl and L to bring up the Flash library. From this, select the movie clip sky and drag it onto Layer

1. Hit V to access the selection tool and select the sky movie clip. In the properties inspector, position

the movie clip on the X and Y axis at 0.0. Rename this layer sky.

3. Cloudy layer

Create a new layer and name it clouds. Drag an instance of clouds group onto this. Use the property

inspector to position this at X and Y axis at 0.0. Select the movie clip and Ctrl+C to copy it. Now

choose Edit > paste in place.

4. Grouping the clouds

With the new copy of the clouds group selected, change its X-axis property to 900. This will shunt it to

the right of the stage by 900 pixels. Select both copies and hit F8 to convert to a movie clip. Name it

clouds group x 2. Select this clip on the stage.

5. Editing in place

Hit F8 again to convert this to the movie clip well animate. Name it cloud anim. Right-click on it and

select edit in place to enter the symbols editing mode. Click on the outlines square to make the

clouds easier to see.

6. Tween the clouds

Right-click and choose insert keyframe at frame 225. With the cloud anim movie clip selected,

change the X-axis value to -900 to shunt the clip off to the left by 900 pixels. Go back to frame one,

right-click and choose Create motion tween.

7. Seamless looping
Frames 1 and 225 are currently the same, which will cause a brief stutter to the animated

background, so right-click on frame 224 and select insert keyframe. Right-click on frame 225 and

choose clear keyframe then remove frames. Hit Ctrl + Enter to preview your looping clouds.

8. Buildings

Under the clouds layer create a new one named buildings. From the library drag an instance of the

clip cityview onto it. Position it at X 312.0 and Y 167.9. Select the clip and hit F8 to covert it to another

clip. Call this one building anim. Right-click on building anim.

9. Plotting keyframes

Select edit in place. Right-click and select insert keyframe at frame 450. Select the cityview movieclip

and in the X axis change the value to -578.0. This moves the city view over to the right. Go back to

frame one, right-click and choose Create motion tween.

10. Stutter out

Frames 1 and 450 are the same. So, as before, this will cause a stutter to the animation. To fix this,

right-click on frame 449 and select insert keyframe. Then on frame 450 right-click, choose clear

keyframe and then remove frames.

11. Make the plane fly

Create a new layer above the clouds layer and name it plane. Drag an instance of plane onto this.

Position this at X -153.1 and Y 80.7. Select the movie clip and hit F8 to convert it to another movie

clip. Name this plane anim.

12. Editing the flight

Right-click on plane anim and select edit in place. Plot a keyframe at frame 276. Move the plane

movie clip to X 1010.1 and Y 59.5. Go back to frame one, right-click and choose Create motion

tween. Right-click in frame 500 on the plane anim timeline.

13. Preview

Select insert frame to extend the hold time before the plane is seen on the stage again. Hit Ctrl +

Enter to preview the animation. You now have a looping animation. It gives the impression of objects

moving at different speeds, which results in a more realistic animation.

14. Masking
Create a new layer and name it mask. Onto this, drag an instance of mask shape from the Flash

library. Position this at X 12 and Y 12 on the stage. Right-click the mask layer and select mask from

the pop-up menu. The plane layer has now become masked.

15. Bulk masking

To mask the remaining layers, right-click on the clouds layer and select properties from the pop-up

menu. In the Layer properties box that appears, select masked from the options available. Repeat this

process for the clouds, buildings and sky layers.

16. Add some content

The mask shape has acted like a cookie cutter to cut through four layers. Create a new layer, above

the mask layer, and name it content. Onto this, drag an instance of central content from the Flash

library. Position this at X 0,0 and Y 0,0.

17. Your animated background

Press Ctrl + Enter to preview the site animation. Your content will remain fixed within the site as the

background loops repeatedly. This type of design is perfect for an advertising micro site or

promotional area. The looping animation adds visual interest to the promotion on offer.

5.30 second Create animation

Aim

To create 30 second animation in flash

Procedure

2. Choose File > Open from the main menubar; the Open window is displayed.

3. Choose the start.fla file from the Open window and choose the Open button; the file to be used in this
tutorial is opened.'

4. Next, choose File > Import > Import to Stage from the main menubar; the Import window is
displayed. Navigate to the folder that you downloaded and select the background.psd file.
Choose Open to import; the Import background.psd to stage window is displayed, as shown in
the figure below.

*.psd is the file extension for a photoshop file. In Flash CS5, you can import a photoshop file directly
to stage.
5. Select
the left_tree from the top left of this window; its corresponding parameters are displayed on the right.

6. Next, select the Loseless option from the Compression drop-down list in the Publish
Settings area.6. Similarly, set the same parameters for front_tree and background icon. Now,

choose the OK button; the images are imported to the stage area as shown in the Figure below.

On importing the images on the stage, the existing biker movie clip is hidden behind.

7. Choose Window > Timeline from the main menubar if the TIMELINE panel is not displayed.

The layer named biker is at the bottom of all the layers in the TIMELINE panel.

8. Select the biker layer and drag it above the layer named background; the biker will bevisible in the
stage area, as shown in the figure below.

Adding Motion Tween to the Biker

1. Select the biker movie clip from the stage area and move it to the left, out of the stage area; as shown the
figure below.
The biker movie clip is moved on the left, out of the stage area, so that while publishing the final animation the
biker appears to enter into the stage after an interval of 2-3 secs.

2. Select the keyframe in front of the biker layer in the TIMELINE panel. Make sure the keyframe is selected
and right click over it; a flyout is displayed. Choose Create Motion Tween from the flyout; the motion tween is
added to the Timeline in the biker layer, as shown the figure below.

You can identify that a particular layer is having a motion tween added to it by the box shaped symbol at the
front of the layer name and the blue background colour of that particular layer in the timeline.

Everytime you add motion tween to a layer, the number of frames added in the timeline will play the animation
for 1 second. For e.g, if the frame rate is set to 24fps (frames per second), the number of frames added willl be
24 in number. You can view the default frame rate or change it from the bottom of the timeline, as shown in the
figure below.

3. Choose the Selection Tool from the Tools panel and select the rightmost frame of the biker layer. Press and
hold the left mouse button over it and drag it to frame 160.

4. Next, select the biker movie clip from the stage area. Press and hold the SHIFT key and drag the movie clip
to the right, out of the stage area,

The green colored line created represents the motion tween path for the biker movie clip. The color of the
motion tween path is similar to the outline color of the layer in the TIMELINE panel.
5. Press and hold the CTRL key and select the blank frames for the left_tree, front_tree, and
the background layer on frame 160, as shown the figure below. Next, press the F5 key from the keyboard to
add blank keyframes in the timeline for the selected layers.

The playhead in the TIMELINE panel at frame 160 shows only the biker movie clip in the stage area. It is so,
as the other layers except the biker layer did not have any frames till frame 160. F5 key adds blank keyframes
having the same content as of the first layer of the respective layer.

6. Press ENTER to preview the motion tween in the stage area. If the animation works press CTRL + ENTER
to publish the animation; a new window displaying the motion is displayed, as shown the figure below.

Adjusting the Motion Tween Speed

1. Choose the Selection Tool from the Tools panel and select the green colored motion tween path for the biker
movie clip.

2. Choose Window > Properties from the main menubar to display the PROPERTIES panel, if it is not
already displayed.

3. Set the Ease value in the EASE area to -100.

Tip! Easing is a process for controlling motion tween in flash. Easing can be further classified into Ease In and
Ease Out. In Ease In, the motion begins slowly, before gaining speed as time progresses with a positive value
and in Ease Out, it happens exactly opposite with a negative value.

4. Choose CTRL + ENTER from the keyboard to publish the easing effect in the motion tweened animation.

The biker starts slowly and gradually speeds up as it progresses to the end, you can also do the opposite by
entering a positive ease value.

Adding Snow Particles in the Scene

1. Select the biker layer from the TIMELINE panel and choose the New Layer icon at the bottom left of the
panel. Rename the new layer as snow_1.

2. Choose View > Rulers from the main menubar to display the ruler marker on the edges of the flash area.

3. Next, choose the Deco Tool from the Tools panel and then expand the PROPERTIES panel.

4. Now, select the Particle System option from the drop-down list labeled Vine Fill in the DRAWING
EFFECT area; the Particle System options are displayed in the PROPERTIES panel, as shown in figure
below.

5. Set the color of Particle 1 and Particle 2 to white by choosing the black colored box below the Edit button
in the DRAWING EFFECT area, refer the below figure for you reference.
3. Next, expand the ADVANCED OPTIONS area if it is not by default. Set the following values in this area:

Total Length =160 Particle Generation = 160

Rate per frame = 3 Rotation rate = 180

4. Press CTRL + - to zoom out of the current view and click above the stage area near the horizontal slider
marked 200; the particles are generated till frame 160.

5. Choose CTRL + ENTER from the keyboard; a new window is displayed showing the particle generation, as
shown in the below figure.

The particles are generated only on the left of the scene area. To allow the generation of the particle on the
entire scene we need to create one more particle system

6. Select the front_tree layer from the TIMELINE panel and choose the New Layer icon at the bottom left of
the panel; a new layer is created. Rename this layer to snow_2.

7. Choose the Deco Tool from the Tools panel and set the properties in the PROPERTIES panel as discussed
in step 3.

8. Create a particle system on the right of the stage area where no particles were generated earlier.

9. Choose CTRL + ENTER from the keyboard to view the final motion tween animation, as shown in the below
figure.

First, draw your torso and head.

 Now make this drawing a symbol (I
called mine Walkcycle because I'm original), and put the head
and torso on separate layers. Also make this symbol as long as
your walk cycle will be. Mine repeats the first pose at frame
17, so I make mine 17 frames long.

Go back out to the stage. Move

your symbol over to the left. Decide how far your character
will go in two steps, and key out that length at the frame
number where your loop repeats (frame 17 for me). Then
create a motion tween, and make sure there is NO EASING on
the tween.
 The motion tween gives us
perfectly equal spacing for each frame of our walk. Now for
my cycle, I'm going to start with the two contact poses. The
first contact pose happens on frame 1 and frame 17. The
second contact pose happens on frame 9. So go to frame 9 and
add a keyframe. Then remove the motion tweens.

Now we need to worry about the

legs, so make a new layer underneath your torso layer, and
label it Sketch. We'll be doing rough drawings on this layer.

I start by drawing the legs for the first contact pose on the
sketch layer. This pose is the same as the pose for frame 17,
so I copy the frame, paste it on frame 17, and line it up with
the torso there.
 Now move to frame 9, and sketch
out your contact pose there. Since we've already sketched the
first and third contact, it's very easy to see where the feet go
for the second contact. If you find that your second contact
pose is more compact or wide than you like, just go alter the
first pose, and that should fix your problem.

Now our breakdown poses are on

frame 5 and 13. In a standard walk this is our pass position,
where the back leg now becomes the front leg. The first thing
we want to get is the horizontal position for this pose, so
motion tween your symbol, and add keyframes at frame 5 and
13. Then remove the motion tween.
 We bounce when we walk, so we
need some vertical motion as well. To do this, go inside your
walk cycle symbol and move the head and torso up a bit at
frames 5 and 13. Also, make sure to rekey your head and
torsos at frame 9 and 17 to their original height.

Go back out on the stage, and, on

the sketch layer, draw your legs for the pass position.

And now you should have an

animation like this
Not the most exciting walk, but you get the idea. Next comes
the inbetweens. Let's start with the the up positions on frames
7 and 15. Make your motion tweens, key out the walk cycle
symbol at frames 7 and 15. Remove the tweens, go inside the
walk cycle symbol and adjust the torso and head to be at their
highest position. Then go out on the stage and sketch your
legs.

Then do the same thing for the

down position at frames 3 and 11.

And let's see what we got here.

Okay so now we have the right leg positions for our walk. But
chances are, your leg volumes are inconsistent (mine sure
are). To fix this, we do our leg clean ups INSIDE the walk
symbol. This way we use our original sketch as reference for
the correct foot position, but when when we're inside the
symbol, our torso isn't moving, so it much easier to compare
the volumes of each leg. This is basically the Flash version of a
traditional animation technique, which was explained really
well by the disgustingly young and talented Matt Williames on
his blog Hand Drawn Nomad Zone. (working professionally for
Warner Brothers at age 14????)

So go inside your walk cycle symbol, and create two new

layers, one for each leg. Then at frame one, go inside your
symbol and draw your cleaned up leg. Move to frame 3 on the
stage, go inside the symbol and clean up those legs etc etc. I
cleaned up one leg at a time, and worked straight ahead. This
helped me keep track of things like the spot where the leg
connects to the hip, and the angle of the thighs and shins. I
would also start the clean drawing with the rough visible, but
then turn off the rough to finish the clean drawing on it's own.

When you're done, you'll have a walk that moves through

space, but also one that can be stationary, if you keep the
symbol stationary. Here's my "final". For yours, I would
recommend at least adding arms and a head bounce. And if
you're really good, you'll also redraw the torso and hips so that
they twist in space and don't look like the super lame stiff
animation that gives Flash it's bad reputation.

Now you probably want more than two steps out of your cycle.

To do this, on the stage, copy your frames, and on a new layer

paste them starting on frame 17. Then using the edit multiple

frames option, move these newly pasted frames so that they

start where the bottom layer stops.

 Now move the top layer frames

down into the bottom layer. Then go inside the walk cycle

symbol, copy all the frames, and paste them starting at frame

17, so that now your walk cycle is 33 frames long. Then go

back out to the stage, select all your frames, right click and

select Synchronize Symbols.

And you can keep doing this as

 long as you want, to make any length walk cycle you desire.

Here's my walk cycle moving across the whole stage

9. To Create Flash website design

Aim

To Create Flash website design using flash

Procedure
1. The first step is going to be creating your workspace in Flash. Begin by opening Flash and clicking File, at
the top of your screen, then selecting New. A window should pop up similar to the one below asking you
what kind of new document youd like to create. select ActionScript 3.0, which is a little easier for beginning
Flash developers to work with, then click OK.
2. From here were going to want to resize our stage to 790px wide by 630px tall.
3. This will pop open a box for you to navigate to the Site Images folder and select home.jpg.Once it
imports in to your library go ahead and drag it on to the stage, then, use the alignment tab to center it and align
it to the bottom of the stage. If your alignment tab isnt open, go to Window on the top bar and select
Align.
4. In order to keep things organized, lets name this layer bg pic on the timeline. To do so is as simple as
double-clicking Layer 1 and changing its name. After weve named our background picture layer well create
another layer for our content. you can do so from the top menu bar by going Insert Timeline New Layer; or
by right clicking (if youre on a Windows machine, control click if youre on Mac) over the bg pic layer
name, this will cause a menu to pop up and you select Insert Layer.
Go ahead and add three new layers to your timeline and then name them, starting from the top, navigation,
footer, and content, with bg pic being the layer on the bottom. And finally lets lock the bg pic layer by
clicking the dot for that layer that corresponds with the lock icon above it, which should be the dot on the right.
5. Lets make our Flash website navigation. Click on frame 1 of the navigation layer. The color should change
from white to gray, this means that anything placed on the stage now goes on the navigation layer. Well
begin by selecting the Text tool from our toolbar and creating separate instances for each page link we want
on our Flash site. In this Flash design Ive planned for six pages, Home, About, Blog, Links, FAQ and Contact.
6. Sticking with the navigation layer, lets now go ahead and convert all of those text blocks to buttons. To
convert a text block to a link you simply click on the text you want to convert, a blue box should now frame
your text to let you know its selected. Then, once its selected, you right click \and choose Convert to
Symbol.
7. Once youve selected Convert to Symbol a new menu should pop up asking what kind of symbol youd
like to convert it to and what youd like to name your symbol.. About would be buAbout, Blog becomes
buBlog and so on. Go ahead and convert all of your text elements to buttons.
8.Well start by expanding our timeline from the single Up frame its at now all the way to Hit by simply
right clicking (or control + click on a Mac) and choosing Insert Keyframe from our list of options.
9. Now that weve got a new key frame under Hit lets go ahead and define the live area that we want our
viewers to be able to click on to follow the link. The easiest way to do this is by breaking our text box down
twice, until its a flat image. You can do this by selecting the Home text and hitting Control + B twice first
time you break the text apart it breaks down to individual letters, the second time is a flat image and is easier to
spread your target hit box over.
Once youve broken the text down, select the rectangle tool, thats two spots below the text tool on your
toolbar, and make a rectangle over the word Home. The Hit zone is not visible by the viewer, youre only
defining the live are in which they can click to follow the link. Thats why when I set my Hit area I like to use
an obnoxiously bright color so that it sticks out and doesnt blend in with the background colors.
10. Now lets insert a keyframe for our Down and Over attributes as well. Down will remain the same as
Up, but if we dont break them all in to separate keyframes then once we change the Up effect, it will carry
over to the Down effect.
Once youve got all the attributes with their own separate keyframe we can tackle the Over effect. To do this
were going to need a new layer so we can place the white hover block behind the text. So, click on Layer 1
and select Insert Layer. Once the new layer appears youll need to drag it below Layer 1 because we want
the color block to appear behind the text. And then we only want it to appear during the Over state so go
ahead and Insert keyframe for the Over and Down state.
Now we can click on the Over state inside of Layer 2 and draw our box. I think a 20 px marking on the left
and right of the word will look nice as well as filling the entire black portion of the Flash website navigation
box vertically. In order to do this well need a box thats 40 px wider than our text, so if you click on the text
youll see its 52.85 px wide, meaning our box needs to be 92.85 px wide. The black area of our navigation bar
is 37 px tall, which means our box has to be 37 px tall as well. Select the rectangle tool, go to your Properties
window, set the fill color to white (#FFFFFF) and no stroke color, then drag out your box. If it needs fine tuning
once you dragged it out, all you have to do is click on it to select it, then go to the Properties window and
change the Width to 92.85, and the Height to 37. Then to move it in place make sure the X coordinate is set to
-20 and the Y coordinate is set to -8.
The final step to making our button is clicking on the Over state in Layer 1, selecting the text, and changing
the color under the Properties window to black (#000000) so youre able to read it against our newly formed
white box. If youve done everything correctly so far, your button stage should look like this in the Over
state.
Go ahead and see if you can do the rest of the buttons on your own. Keep in mind that your next button should
be spaced 40 px from the right side of your previous button to allow for the hover effect. The simple calculation
for this is, Width + X Coordinate + 40. Your Y coordinate should stay at 8 to ensure all your buttons maintain
the same Y-axis. And that your Hover effect should be 40 px wider than your text, with a 20 px margin on the
left and right. The X and Y coordinates of your Hover square should always be X: -20 and Y: -8.
Howd you do in creating a Flash website, does your Flash website site match this?
If not, no need to fret. Surely it was a miscalculation on button placement. Heres a little cheat sheet for you.
Home: x = 20
About: x = 112.85
Blog: x = 206.85
Links: x = 289.7
FAQ: x = 379.25
Contact: x = 461.75
And remember, the Y-axis on those should always be 8.
Now would also be a good time to not only save your project, if you havent done so already, but to export what
youve done so far to see if your buttons are working properly. To export your editable .fla file to the .swf
format thats readable by web browsers, you can either go to File Export Export Movie. Or utilize the
shortcut keys and hit Control + Shift + Enter on a Windows machine or Command + Shift + Enter on a Mac.
11. Now lets program those links to go somewhere. Click on buHome and then select the Actions window.
Under the Actions tab, in the top right corner you should see an icon with Code Snippets next to it, and then
another icon just to the right of that icon, which looks like a magic wand. Make sure you click the wand as it
will help you write the ActionScript needed to make the buttons function.
On the left side should be a scroll box. Double-click on Timeline Control to get the menu to expand and drop
down, then double-click goto. This should make a menu appear to the right asking more specific questions.
First youll want to click the Go to and stop radio button, scene should remain at, under type youll want to
change Frame Number to Frame Label, and then under Frame enter home. Thats it.
Now go ahead and do that for the rest of your buttons, but the Frame name should coincide with the link
youre programming. For example, when youre developing the code for the About button you would simply
write about in the box next to Frame.

12. Working our way down the layers latter of our timeline, next up should be footer. For this were just
going to create a basic footer with some social media links as a way of closing of the bottom of our site and
giving it a little extra aesthetics. But before we dive in to the footer, lets go ahead and lock our Navigation
layer, since were done with that and dont want to accidentally screw anything up in that layer.
For our footer were going to create a black rectangle with a 60% opacity thats 30 px tall and spans the width
of our stage. To do this we first want to make sure were in frame 2 of the footer layer. If youre already
there, then all you have to do is select the rectangle tool from the toolbar and drag out a rectangle. Once you
have a triangle on your stage you can easily edit it to perfection by selecting it, going to your Properties
window, and entering the above attributes. Then, once youve got the proper shape size and opacity, you can go
to your Align window and tell the rectangle to Align horizontal center and Align bottom edge.
13. Now lets add those social media icons to our footer by importing them to our library first. If you dont
remember how to do this from step 3, Ill give you a hint. File Import Import to Library. And youre going
to want to import email.png, facebook.png, and twitter.png.
Once theyre in your library go ahead and drag them on to your stage. Where to place them is a personal
preference, but I like mine in the bottom right corner. My Y coordinate is set to 606, while my X coordinates
are:
Facebook: X= 715
Twitter: X = 740
Email: X = 765

14. If youd like to link the icons to your social media site the process is quite similar to the navigation buttons
we did. Click on the icon youd like to link and open the Actions window. Rather than going to Timeline
Control this time, were going to go to Browser/Network and select getURL. This will select a menu
similar to this one and youll want to enter the corresponding URL in to the appropriate box and select what
window youd like the link to open in (the current one, a new one, etc).

15. Now that were done with the footer layer of our Flash website you can go ahead and lock it and well move
on to the content. Like the footer, were going to start by dragging out another rectangle with a black
background and opacity of 60%. Only were going to make this rectangle 355 px wide by 483 px tall and nestle
it on the right side of our site at X: 395 Y: 77. Remember, to apply those changes you do so under the
Properties window.
Once we have our rectangle set at the proper size and in place were going to polish it up a bit by softening the
edges. To do this we select our rectangle, go to Modify on our main menu bar at the top of the screen, then
select Shape, followed by Soften Fill Edges. This should pop up a small new screen asking what distance
and number of steps youd like your edges softened. I think a distance of 10, with 4 steps and expanding should
do the trick for us.

16. In order to enter text on top of our rectangle well also need to create a text box. Doing this is a combination
of what we did to create our buttons and how we create our rectangles. Select the Rectangle Tool from the
toolbar and drag out a box on the stage. I allowed for a 10 px margin all around on mine, so my text box is 335
px wide by 463 tall and sits at X: 405 and Y: 87.
Once your text box is created you can enter any text youd like, Im just going to enter some Lorem ipsum to
fill the spot.

17. The home page on our Flash website is now created and our entire Flash site is almost created. From here
were going to want to create frame labels and our next five pages. Going back up to our timeline, create a new
layer at above all your other layers and name it actions. Once the layer is created click on frame 2 of the
actions layer then go to your properties window. With actions frame 1 still selected, type home in to the
box labeled Name: under Label in the Properties window. A little red flag looking thing should pop up
under frame 1 of actions. This means that frame 1 is now labeled home, as this is where our home page lies
on the timeline and from now on the buHome will point here. And if you expand out the timeline by adding
more frames under this keyframe, youll see that it says home next to the flag.
To keep our Flash website from playing straight through every page with out hitting any links, were going to
have to tell it to stop on each frame. With frame 1 of the actions frame still selected, go back to the Actions
window where we programmed out buttons. Also similar to our buttons, were going to want to use the
Timeline Control to tell our site to Stop. So, go ahead and double-click stop so that the site knows to stop at
frame 1.

18. To create the next five pages on our Flash website is simple. We start by inserting a new keyframe in frame
2. To do this we need to click on frame 2 of actions and drag down to frame 2 of bg pic, highlighting all of
the frames. Then we right click (or Control + Click on Mac) and choose Insert Keyframe. Youll notice the
red progress bar that runs vertically through the timeline has moved to frame 2, thats because were now
working on frame 2 of our timeline.
Since weve already learned how to make a flash website and done all the hard work of creating everything,
now its just a matter of editing it slightly to correspond with the correct page. Since our second link is About,
it would make the most sense to have frame 2 be our About page. First things first, lets click on frame 2 of
actions, go back to properties and name this one about. After that we need to tell it to stop here like we did on
the home page, otherwise it will just play this one frame before looping back to the home page and stopping
there. So, with frame 2 of actions selected, go back to the Actions window and double-click stop under
Timeline Control.
Now select frame two of your content layer and edit the text so that it coincides with what you want on your
About page. Once youve finished that go ahead and unlock the bg pic layer and delete that image. After the
image is deleted import about.jpg to your library, drag it on to the stage and align it to the horizontal center
and bottom of the stage using the Align window and PRESTO! Your page should look similar to this.

Now that youre a Flash website expert, see if you can create the last four pages on your own! Be sure to export
it again and test your navigation to see if the links take you to the proper page.
If youre feeling like Flash is just too complicated, then I recommend using the free drag and drop site builder
from Wix, which allows you to quickly create a professional website for free.
About the author: with over ten years in the freelance web design and writing fields, Scott Stanton has had his
finger on the beating pulse of the industrys hottest design trends and bends for the past decade. Scott regularly
writes for Wix.com the free website builder.