Step 17

Create a new layer above the preloader and name it preloader animation.

Step 18

Go back on preloader layer, take the Selection Tool (V) and double click on preloader to go again in its inside.



Then, lock all layers except layer 1 and line layer. See the picture below.



Step 19

After that, press Ctrl+A key (Select all) to select the rectangle (fill and stroke color) of preloader. Then, press Ctrl+C key (Copy).

Step 20

Go back on the main scene (Scene 1), select the preloader animation layer , click on frame 2 and press F6 key. Then, press Ctrl+V key (Paste).

Step 21

After that, while the rectangle (fill and stroke color) of preloader that you just copied is still selected, go to the Align Panel (Ctrl+K) and choose the following options:

1.Make sure that the Align/Distribute to Stage button is turned on,
2.Click on the Align horizontal center button and
3.Click the Align vertical center button.



Now you have aligned the rectangle (stroke and fill color) of preloader with the background.



Step 22

While the rectangle of preloader is still selected, press F8 key (Convert to Symbol) to convert this rectangle into a Movie Clip Symbol. See the picture below.



Step 23

Click on frame 10 and press F6 key.

Step 24

After that, take the Free Transform Tool (Q), press and hold down shift key and decrease the rectangle like it is shown on the picture below.



Now, you get this:



Step 25

Right-click anywhere on the gray area between the two keyframes on the timeline and choose Create Motion Tween from the menu that appears.

We're done!

Now, it's time for flash site loading.

Go to Part 2- Flash site loading