This is a tutorial on how to rotate objects in a 3D motion using the 3D Rotation Tool in Flash CS5.

Please note:
1. You need to have Flash Player 10.0 installed to view the Flash animation.
2. Adobe Flash CS5 must be installed in your system to work with the downloaded *.fla file.

Before starting with the actual rotation of an object in 3D, follow the following steps to understand the concept and the basic tools and utilities in Flash CS5 that will be used to go through the tutorial.

  1. Start Flash CS5 using the shortcut icon from your systems desktop.
  2. Choose ActionScript 3.0 under the Create New area to load a new file that uses Actionscript 3.0 as its basics.
  3. Choose SMALL SCREEN from the interface type drop down list. The interface type drop-down is available on the right of the menubar area, refer Figure.     figure_1.jpg
  4. Invoke the Rectangle Tool from the Tools panel and create a rectangle in the stage area ( the stage area is the white area in flash where we do all of our artwork). Make sure that the Height of the rectangle is more than its width.
  5. Select the rectangle from the stage area and choose Window > Transform from the main menubar; the TRANSFORM options dialog box is displayed, refer Figure.

    figure_2.jpgThe TRANSFORM dialog box is used to transform the selected shape in the stage area. In this case, the options in this dialog box are not highlighted. To make them work we need to transform the selected shape into a movie clip.
  6. Double-click on the rectangle created in the stage area and choose Modify > New Symbol from the main menubar; the Create New Symbol dialog box is displayed, refer Figure.

    figure_3.jpg
  7. Name the symbol as Box1_mc and choose the OK button; the selected shape is converted into a movie clip.

    The name Box1_mc is followed by mc which means that it is a movieclip. To name a movieclip follow it with ‘mc’, in case of button use ‘btn’. This naming convention help;s a lot while doing actionscripting in flash.
  8. Select the Box1_mc movieclip from the stage. Press and hold the ALT key and make a duplicate copy of it. Align them together as shown in Figure.
    figure_4.jpg
  9. Select the left box and in the TRANSFORM dialog box set Y = -40 under the 3D Rotation area and for the right box set Y = 40 and align them, refer Figure.

    figure_5.jpg
  10. Press CTRL + a to select both the objects in the stage area. Next, try playing with the x, y, and z values under the 3D Rotation area. On doing so, the objects rotate in the 3D world, refer Figure.

    figure_6.jpg
  11. Select the first keyframe in the timeline, right click on the selected frame a flyout is displayed. Next, choose Create Motion Tween from the flyout.
  12. Move to the last frame and drag it to frame 55 and choose Window > Transform from the main menubar; the TRANSFORM window is displayed. Try changing the values in this window; the result is displayed on the stage area.
  13. To test the animated movie, hold down the CTRL key and press ENTER; a new window is displayed showing the published flash animation.

Using this concept and the traditional timeline animation you can animate any shape in 3D by just setting the keyframes.


No portion of these materials may be reproduced in any manner whatsoever, without the express written consent of Entheos. Any unauthorized use, sharing, reproduction or distribution of these materials by any means, electronic, mechanical, or otherwise is strictly prohibited.


Flash Tutorials & Resources

Animation Tutorials and Resources


Pinterest