How to create a motion guide in Flash CS4
Need a Website? Contact Us Now!
We have already learnt how to move a ball from the left of the screen to the right, now lets learn how to move an object from the left to right not necessarily in a straight line but in a zig zag motion, let take an object aeroplane on stage and we want it to go from the left to right in a zig zag or a smooth curve motion, we can do that by using a motion path or guide in Flash CS4, we do that by drawing a stroke or curve on a different layer and orient to path,. lets take an object for example like this aeroplane on stage and save it as a graphic symbol called plane, now call this layer1 aeroplane layer, now you must create another layer called guide layer on top of the aeroplane layer.
Lets go an lock the aeroplane layer and also make it invisible by clicking on the lock and eye icon on top of the layers, and work on the guide layer, in this guide layer on frame1 draw a curve in the form of a snake shape, it doesn’t matter what color you use, just draw a curve in a zig zag manner going from left to right of the stage like the one below.
Now we need to attach this aeroplane to the guide layer, so unlock and make the aeroplane layer visible, and lock the guide layer above the aeroplane layer by clicking on the lock icon. Now with snap objects turned on, click on the little circle in the middle of the aeroplane and take it to the starting point of the guide, it will automatically snap in place, lets make a motion tween and snap it to the right side of the guide, so lets create a new keyframe by pressing F6 in frame 24, now when you look at the stage from frame 24, we cant see the guide layer, now where has the guide layer gone, we need to insert keyframes in the guide layer because only frame 1 has the guide lines showing, but frame 2 to frame 24 does not have the guide lines showing, so go to frame 24 in the guide layer and press F5, now you will see the guide layer visible in the entire animation like the one below.
So in frame 24 in our aeroplane layer we need to get this aeroplane on the right side, so go to frame 24 and place the aeroplane to the right by clicking in the middle of the aeroplane grab it and drag it till it snaps into place. So in frame 1 it is on the left side of the guide and in frame 24 it is on the right side of the guide like the one below.
Now make a motion tween by clicking in the middle of both the layers and select the motion tween. Now check your movie clip, you will notice that the aeroplane is going from the left to the right along the guide like the one below.
If you test you movie, the best thing about this guide layer is that it does not show up while running the movie clip. While you run the movie clip, although you see the aeroplane going along the path directed, but it is a little weird that it is wiggling back and forth, and that’s not the way an aeroplane flies.
Let’s use the free transform tool and go to the first frame and rotate the aeroplane in the way the guide is moving, also do this in the last keyframe (keyframe 24) and position it in the way the guidelines end like this one below.
When you test you movie clip, the animation is still not working properly as you see below
To get this properly click anywhere between your first and 24th key frame and go to your properties panel and you will notice that there is something called orient to path,
just check that option and test the movie clip.
If you find the animation too fast, that is the aeroplane moving from left to right too fast, you can insert some layers in-between the fist and twenty forth by clicking and dragging both the layers and pressing F5, lets say we want to take it up to frame 48, so insert frames in both the aeroplane and the guide layer till it reaches frame 48, now test you movie clip, you will notice that the aeroplane animates much slower and also looks good.
That’s it you have learnt how to make a motion guide in Flash CS4.
Flash CS4 Tutorials
- Flash CS4 Tutorial
- Introduction to flash CS4 authoring environment
- Panels and Panel workspace in flash CS4
- Drawing in flash CS4
- Use of polystar tool in flash CS4
- Object drawing Mode in Flash CS4
- How the Line tool, Pencil tool, brush tool and pen tool work in in Flash CS4
- How to use Ink bottle and paint bucket tool in flash CS4
- How to manage layers in Flash CS4
- How to make an image big on rollover in flash CS4
- Creating Mask in Flash CS4
- Moving Ball Animation in Flash CS4
- How to create a shape tween in Flash CS4
- How to create a motion guide in Flash CS4
- Learn how to create a bouncing ball in Flash CS4
- Learn how to put multiple classic tween on stage at the same time in Flash CS4
- Learn Complex Text Animation in Flash CS4
- Learn Create Animations involving Masks in Flash CS4
- Learn to create a movie clip that fades as the user moves the cursor away from it in Flash CS4
- Learn to create cloud animation in Flash
- Learn to import sound in Flash CS4.
- Learn 3D Art in Flash CS4.
- Learn to create a customizable pop-up window using Flash CS4.
- How to get an url in a blank window in a flash CS4 action script
- How to get an url in a blank window in an xml file
- How to put your favorite icon in the browser
- How to create a scroll bar in Flash CS4
- How to create a basic layout in Flash CS4
- How to load pictures in flash CS4 dynamically using the loader component
- Load External swf as2
- Upload a Website/ FTP
Tags: How to create a motion guide in Flash CS4
Posted in Flash CS4 Tutorial | No Comments »