New in Flash CS4 is the ability to position and animate objects in real three-dimensional space. However, objects need to be movie clip symbols to move them in 3D. Two tools allow you to position objects in 3D: the 3D Rotation tool and the 3D Translation tool. The Transform panel also provides information for position and rotation.
Understanding the 3D coordinate space is essential for successful 3D placement of objects. Flash divides space using three axes:
- The x axis runs horizontally across the Stage with x=0 at the left edge.
- The y axis runs vertically, with y=0 at the top edge.
- The z axis runs into and out of the plane of the Stage (toward and away from the viewer), with z=0 at the plane of the Stage.
Changing the 3D Rotation of an Object
For this example, we'll add some text to an image. To give it a little more interest, we'll tilt the text to put it in perspective (see Figure 1). Think about the beginning text introduction to the Star Wars movies and see if you can achieve the same effect.
Follow these steps:
- Insert a new layer and rename it text (see Figure 2).
- Choose the Text tool from the Tools panel.
- In the Property inspector, select a large-size font with an interesting color that will add some pizzazz.
- Click the Stage in your text layer and begin typing your title (see Figure 3).
- To exit the Text tool, select the Selection tool.
- Your text is created, but now you must convert it to a movie clip symbol to rotate it and position it in 3D.
- While the text on the Stage is still selected, chose Modify > Convert to Symbol.
- In the Convert to Symbol dialog box, enter a descriptive name, select Movie Clip for Type, and click OK (see Figure 4).
You now have a movie clip symbol in your Library with your text inside. An instance of the movie clip symbol appears on the Stage.
- Choose the 3D Rotation tool (see Figure 5).
A circular multicolored target appears on the instance, as shown in Figure 6. This is a guide for the 3D rotation. It's useful to think of the guides as lines on a globe. The red longitudinal line rotates your instance around the x axis. The green line along the equator rotates your instance around the y axis. The circular blue guide rotates your instance around the z axis.
- Click one of the guides—red for x, green for y, or blue for z—and drag your mouse in either direction to rotate your instance in 3D space.
If you prefer, click-and-drag the outer orange circular guide to freely rotate the instance in all three directions (see Figure 7).