| One of our favorite 3D Flash techniques takes advantage of an object's natural perspective to create the illusion of 3D motion. We love this one because it only requires a single frameunlike a 3D rotation in Flash, which requires several frames . We employed the technique in the ad for the CPU's final appearance. As shown in figure 05:19, the CPU makes a split-fade and then disappears from view. The ad then moves on to show the client brand and user call-to-action. The split-fade is made from a couple of instances of the same symbolnothing really new. The twist is that it's done in 3D (see (see figure 05:19).
Figure 05:19. 
This was accomplished using Flash's scaling feature to animate a single image along lines of perspective. Objects or images that appear to be in 3D often have natural lines of perspective built into them. These lines, also referred to as orthogonal lines, point to an artificial horizon line somewhere behind the image (see figure 05:20).
Figure 05:20. 
To create the illusion of 3D using an object's built-in perspective, follow these steps: -
On the main stage, place a keyframe where you want the animation segment to begin. -
Drag out an instance of the 3D image symbol from the Library onto the keyframe. If the instance is of a symbol containing multiple frames, freeze it on the frame you want to work with using the Instance Properties dialog and Single Frame Play Mode (as in the previous example). -
Select the instance in the keyframe and use the Scale tool to reduce the size of the object to about one-fifth the original size , or so. Exactly how much is up to you. Move it to the left a couple of clicks using Shift-left arrow key. -
Add another keyframe about 10 frames or so after the first. -
Select the instance in the keyframe and use the Scale tool to increase it to 10 or 15 times the original size. Figure 05:21 shows what your stage might look like with both frames visible.
Figure 05:21. 
-
Choose the Modify Onion Markers button (directly to the right of Edit Multiple Frames) and select Onion All from the drop-down menu. Now, toggle on the Onion Skin button. Make sure the layer is unlocked, or the onion skinning will not be visible. Clearly, the CPU in this case will not animate along the correct lines of perspective (the top and bottom edges of the CPU's sides do not match up). See (see figure 05:22).
Figure 05:22. 
-
To identify correct perspective, select the smaller CPU in the earlier keyframe. Now, using the ghosts of the onion skinning as a guide (and the arrow keys), move the smaller CPU to the left until the top and bottom edges of both CPUs are aligned (see (see figure 05:23).
Figure 05:23. 
In figure 05:23, we've drawn in the lines of perspective for emphasis. When you tween the two keyframes, the result will be a CPU that animates perfectly along the correct lines of perspective using only a single image. |
