Basic Shading
Shading is another technique that can add a lot of depth to an shape in a 3D space. Basically, you're just colorizing your shapes based on some factor like rotation or, surprise surprise, depth. Perhaps you want to give the impression of fog or night. Shading faces white or black as those faces recede into the distance can give these effects. What about shading based on a light source. Also doable... but more complex. You start getting into higher math at this point - something I've been trying to avoid so it won't be covered (...yet?). Fog, however, is fairly easy and can be beneficial if you want to prevent having to worry about objects being drawn far off in the distance.

Simple Fog
Given any shape in your 3D scene, you have a specific coordinate telling you where that object is in relation to the view in terms of z. Using this distance, you can apply a fog of some sort by tinting a shape or face directly proportionate to that z value helping you achieve a greater sense of depth. We'll bring back our two rows of figures and add fog to them.

[ fog applied to figures in the distance ]

Steps to Create Animation (partial)

1. Basically, the only difference here is the inclusion of the fog (that and the ground imagery was changed with a gradient that suggested a foggy background). This is a color addition using the Color object in Flash that is simply a tint applied to each figure, assuming its visible, based on z. A tint can easily be applied using setTransform and adjusting the rb, gb and bb values - each which relate to the addition of either the color red, green or blue. Adding them all at once will add white. The range of these values will span from 0 (normal color) to 255 (all white) so it is up to us to get a tint value for that range based on z. This example uses the following.

Here, col, a color object for the figure is set to have a tint 1/5 the value of z (out of 255). This means that the figure will be fully white when its z is 255 x 5 or 1275. Of course the Color object, col, would need to be defined...

2. So be sure to define a Color object variable (col), which is simply a new Color object, when each clip is attached.

3. As an added bonus, this example adds a new twist in navigation. The mouse is used for turning, the UP and DOWN arrows for moving forward and back and LEFT and RIGHT are used for side-stepping. Side-stepping is nothing more than taking movement forward and backward and adding a 90 degree (or Math.PI/2 radian) spin on the angle used for that. Here is the full walk around (theScene's onEnterFrame) function used for that.

Prev Page

Index

Next Page