3D CITY EFFECT

IN THIS THOROUGHLY EXPLAINED, DETAILED FLASH LESSON, I WILL SHOW YOU HOW TO CREATE ADVANCED 3D CITY EFFECT.

YOU DON'T HAVE TO USE ACTION SCRIPT CODE TO MAKE THIS EFFECT.

YOU CAN USE THIS EFFECT FOR SOME FLASH BANNER, OR HEADER. USING THIS LESSON, YOU WILL ALSO LEARN:

1. HOW TO APPLY SOME SPECIAL FLASH TRICKS ON ANY OBJECT, 2. HOW TO DRAW ON A SIMPLE WAY CITY, 3. HOW TO IMPORT ANY PICTURE INTO A FLASH,

4. HOW TO CREATE SKY ON A SIMPLE WAY, 5. HOW TO USE BRIGHTNESS AND MUCH MUCH MORE.

STEP 1
Before we start a flash, find on internet or somewhere any picture of city that you want to draw

FOR THIS EXAMPLE I WILL USE A PICTURE OF NEW YORK CITY. YOU CAN ALSO DOWNLOAD MY PICTURE IF YOU LIKE.

STEP 2
Create a new flash document and choose Modify > Document (Ctrl+J). Then, set your Flash movie's frame rate to 24.

STEP 3
Choose File > Import > Import to Stage (Ctrl+R) and Import a picture of city.

STEP 4
Double click on layer 1 to rename its name in city. After that, lock that layer and create a new layer above that layer and name it city contour.

STEP 5
Take the Line Tool (N). Select a line color (some contrast color - for this example I have used #00FFFF), and choose Solid as type of line, with thickness set to 1.

STEP 6

After that, start drag a city contour. See the picture below.

AFTER THAT, YOU'LL NEED TO GET SOMETHING LIKE THIS:

STEP 7
Take the Selection Tool (V), click once on layer city to select it and after that click on Delete layer icon to delete it. See the picture below.

STEP 8

STEP 9
Press Ctrl+A key (Select all) and for Stroke Color choose black to change a "city" color in black. See the picture below.

STEP 10

Take the Paint Bucket Tool (B), for Fill color choose balck and paint the "city".

STEP 11
Press again Ctrl+A key (Select All) and after that F8 key (Convert to Symbol) to convert this "city" into a Graphic Symbol.

STEP 12
While the new graphic symbol is still selected, take the Selection Tool (V), press and hold down Alt+Shift key and duplicate the "city" like it is shown on the picture below.

STEP 13
After that, take the Free Transform Tool (Q), press and hold down Shift key and do like it is shown on the picture below.

STEP 14
Take again the Selection Tool (V), click once on the city that you just duplicated and go to the Properties Panel (Ctrl+F3) below the stage.On the right, you will see the Color menu.

SELECT BRIGHTNESS IN IT AND PUT IT DOWN TO 85%. SEE THE PICTURE BELOW.

NOW YOU GET THIS:

STEP 15
It's time for "sky", so create a new layer and name it sky.

STEP 16
Select that layer, take the Line Tool (N), Select a #84E7FF as line color, and choose Solid as type of line, with thickness set to 1. draw this:

STEP 17
After that, take the Paint Bucket Tool (B), for Fill color set #84E7FF and paint the "sky".

AFTER THAT, TAKE AGAIN THE SELECTION TOOL (V) AND USING THE "DRAG AND DROP" TECHNIQUE MOVE THE SKY LAYER BELOW THE CITY CONTOUR LAYER. SEE THE PICTURE BELOW.

STEP 18
Select the sky layer and press F8 key (Convert to Symbol) to convert this layer (sky) into a Graphic Symbol.

STEP 19

Repeat steps 11,12 and 13, but for this time, do that for "sky". See the picture below.

STEP 20
To make alive this picture, we will create a little "plane" and animate it.

STEP 21
Create a new layer above the city contour layer and name it plane.

STEP 22
Using the Flash Tools for drawing, draw a simple "plane" and place it on the position like it is shown on the picture below.

STEP 23
Take the Selection Tool (V), select the "plane" and press F8 key (Convert to Symbol) to convert this plane into a Graphic Symbol.

STEP 24
Click on frame 300 of layer city contour and sky and press F5 key. After that, go back on layer plane, click on frame 300 and press F6 key. After that, place the plane on this position:

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.

STEP 26
Take the Selection Tool (V) and double click on "plane" to go in its inside. After that, while the "plane" is still selected, press Ctrl+C key.

STEP 27
Go back on the main scene (Scene 1), create a new layer above the plane layer and name it plane shadow. After that, select it and press Ctrl+V key (Paste).

STEP 28
After that, place the "shadow plane" on this position:

STEP 29
While the "shadow plane" is still selected, press F8 key (Convert to Symbol) to convert this "shadow plane" into a Graphic Symbol.

STEP 30
After that, take the Free Transform Tool (Q) and repeat step 13 but for this time do that for "shadow plane". Now, you have this:

STEP 31
Take the Selection Tool (V) click once on the "shadow plane" to select it and go to the Properties Panel (Ctrl+F3) below the stage.

ON THE RIGHT, YOU WILL SEE THE COLOR MENU. SELECT BRIGHTNESS IN IT AND PUT IT DOWN TO 64%. SEE THE PICTURE BELOW.

STEP 32
Click on frame 300 and press F6 key. After that, place the "shadow plane" on this position:

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

TEST YOUR MOVIE (CTRL+ENTER).

THAT'S IT. WE'RE DONE!