|
Written by Rawpulse
|
|
Wednesday, 12 October 2005 |
|
Learn all about the basics of motion guides to bring your animations to life, and to save yourself time.
This is a tutorial to utilize the Motion Guide feature. It's a simple
effect, and allows you to set a guide for your graphic to follow. For
example you could create a spiral to follow, rather than it simply
taking a direct route to the end location, in a straight line. You'll
find a lot of uses for this, especially if you're getting into
animation or games.
I created this motion guide with Flash MX Professional 2004, as with my
other turorials. I created a spaceship to demonstrate this effect,
which you can see below.
So, first make sure that you have the Snap to Objects button selected. This is located under Options when you have the Selection Tool selected. Attaching graphics to motion guides is difficult without this turned on, so ensure that it is.
Next insert your graphic onto the page. This can be done by importing it from File > Import > To Stage... or by copy and pasting an image. At this point turn your image into a graphic if you haven't already. Go to Modify > Convert to Symbol... and select graphic under behaviour. Rename layer 1, where your graphic will be, to "graphic".
Add a keyframe at frame 30, by right clicking the space under the 30, and selecting Insert Keyframe.
Keyframes define areas of your project where change occurs (see
Keyframe tutorial). In this tutorial we only require two. One at the
begining and one at the end.
With the graphic layer selected, right click and select Add Motion Guide from the drop down list, as seen below:
Your timeline should now look like this:
The guide layer is now set (it is the top layer named Guide:graphic).
On this layer, draw a line using the pencil tool. This is the path that
the graphic will follow. I drew a line that dips down, but you can make
any path, as long as you have a clear beginning and end. It does not
matter what colour or thickness the line is, because it will not be
seen on the animation. This line is a pathway for the graphic to
follow, but in the end result it is not shown.
This is where you attach the graphic to the guide, but because you turned Snap to Objects on, it's fairly simple. Select the graphic with the Selection Tool
and you will see a small circle appear in the middle. Click this and
drag towards the beginning of your line. You will notice that as you
approach the point where you wish to connect, the graphic will "snap
to" it. It should now look like this (if you're going from right to
left):
Now go to frame 30, which you made a keyframe, and do the same with the
image. This time however, drag your image over the end of your line.
You have now created the starting point and ending point of your
animation, but you will notice nothing happens in between. The final
part requires you to add a tween, like regular motion tweening. To do
this, click on frame 15 (or anywhere in between frame 1 and 30), then
select Motion from the Tween drop down box, located in the Properties menu.
You have now completed your motion guide animation. Test it by pressing
<b>Ctrl + Enter</b> and you will see that the graphic
follows the line you have drawn. It does not turn as your line does,
instead it remains pointing in the same direction all the time. This
will be addressed in my next tutorial, entitled "Advanced Motion Guides"
|
|
Last Updated ( Wednesday, 12 October 2005 )
|
