Jan 27, 2008

Rotating Objects with Motion Guides in Flash.

Before proceeding to Motion Guide animation please also check for animating body parts of character. I do not want to repeat same tutorial here again and again which has already been explained in my new site TutorialBalcony. I want to share this with visitor of my blog here. This post is about brief discussion on animating Parts of an Object or Character.

I always go for three types of animations in simple flash projects with no action script involvement.

(1) Motion Tween.
(2) Frame-by-Frame Animation and
(3) Guide Motion.

This post is about Motion Guide.

We can create some eye catching animations with Motion tween and Motion Guides. Motion Tween can only be applied to Graphic symbols. We need to first convert all the graphics to be animated in to Graphic Symbols. At the same time we can't apply Shape Tween to Graphic Symbols. Briefly...apply Motion Tween for Graphic Symbols and Shape Tween for Non-Graphics Symbols. It means there is no need to convert a Graphic in to symbol to apply shape tween to it.

Motion Guide Animation is very useful when it comes to animate an object in certain curve or zig zag direction. It needs a path to be drawn on separate layer and Graphic Symbols/Movie Clips to be animated in particular path to be placed on another layer.

If a propeller is rotating its blades and we need to rotate the propeller in circular motion along with its blades rotation than we need to put the the propeller blades rotation in Movie Clip and again this Movie Clip to be attached to a circular Motion Guide.

I explained below with rough examples:

I am not able to upload .swf files.
You can view the above propeller animation

It is a movie clip of a propeller and Attached to a circular Guide path (see below image). Propeller not only rotates on its own axis but also it follows circular guide path while rotating. Guide path can't be seen while playing movie. I added an extra layer at bottom to show the circle.
The full animation you can view


1. Propeller Rotation.
2. Propeller Rotating along with Circular path.

The Propeller is a Graphic symbol. Rotated 180 degree at frame 10, applied Motion Tween and converted to movie clip. Propeller movie clip attached to a circular guide path which is consisting of total 100 frames at the rate of 36 frames per second.

I very rarely go for Shape Tweens. It does not mean that I hate Shape Tweens. I use as and when I feel it is very necessary to insert. To make shape tweens perfect we need to insert "Shape Hints" which is almost time taking. Shape Hints are very useful to animate shapes in particular directions. Complex Shape Tween is possible only with shape hints.

Implementation of action script in animations will bring file size considerably down. But we need to plan logically every bit of animation. But it is important to know basics of actionscript. If we do not know how to stop an animation at the end of the frame than the animation will loop again and again.

In my next post I will write about Shape Hints and its awesome animation effects.