The animation in Flash
Flash 8 is a program oriented mainly to the animation that is the aim of this unit. However, to continue creating more and more complex animations, beyond all, it's needed a lot of practice.
In this unit and the successive ones we'll show the basic techniques of animation in Flash. Joining together all these techniques will be the one that will allow us to create the most variated and showy animations.
In animation, Flash provides many facilities, obtain effects that require much knowledge and storage space to be created in a very simple way, with no need of excessive knowledge and taking very small disc space.
Although Flash provides better techniques, one can also create animations as a animated GIF. Assigning to the movie the animations frame by frame. These are the most basic animations and it is worth knowing them. For this it is worthwhile to visit our basic theme:
The Animation in Flash
An animation is nothing more than a sequence of frames reproduced at a so high speed that the human eye isn't able to perceive the change from one image to another one.
Although the limit in which the human eye detects these changes on the monitor of a computer goes up approximately to 18 frames per second, Flash places by default its lines of 12 times to fps, due to that some monitors don't support well enough this frequency.
Flash 8 incorporates techniques that apparently don't use successive sequences of frames, like the motion tweening. In these cases, we don't see frames "physically", or in other words, if the animation takes 20 frames in the timeline, the fact that not all of them are keyframes simply indicates an improvement in the storage capacity of Flash, because it doesn't need to know how are the intermediate steps of the animation. If all frames were keyframes, the size of the file would increase considerably.
This last one happens, for example with the animated GIFs, although being widespread used in the Web world. They are not only made up of Bitmaps (we've already commented about the larger size of these graphics), but each frame is a complete bitmap, which increases significantly its space of storage in memory and disk.
Creating Frame by Frame animation
Although Flash incorporates superior techniques than these, it also allows "to simulate" the way a GIF creates an animation, since sometimes the animation is very sudden or the change isn't "automatically" attainable with Flash or simply our objective is to export the graphics created as this type of bitmap.
In order to create a frame by frame animation is enough to introduce the initial appearance of the object in the first frame, make all those frames that are going to take part in it to be keyframes, and modify them, progressively, one by one, since a very great difference of one frame to the following would make an sudden hit to whom visualizes it.
Once the animation is finished we'll have something like what we show in our timeline:
We'll see the difference in sizes of the different animation techniques for the same movie:
We have the following animation. The appearance will practically stay equal in all these cases, but there is the possibility that by doing it frame to frame, small errors of positioning in the trajectory are committed that Flash wouldn't commit:
And we have these three forms to create it with its corresponding sizes:
1. Motion Tweening: With the next timeline:
Size: 961 Bytes
2. Frame by Frame exported as Flash (SWF) movie: As we see the timeline has all frames as keyframes:
Size: 1 KByte
3. Frame by Frame exported Animated GIF: The timeline is the same as in the previous case:
Size: 2 KByte
Although the differences would be observed better in more complex movies, in this example we can see how the size is smaller using the technique of Flash 8 of Motion Tweening, it is greater in the frame by frame animation and doubles for the case of an animated GIF.
We've said that sometimes it 's inevitable to make a frame by frame animation. Here is an example of this type.
Next we'll see the different types of animations that the creator of Flash movies will have to take as initial guides. It is worth to highlight that we will be able to apply several of these animations placing them in different layers. With this in hand we will obtain both the most spectacular and useful effects.
It is very important to understand clearly a concept: one shouldn't create animations in pages where it isn't necessary, nor create animations that distract the viewer's attention from the really important issue, the message.
Tweening Motion (I)
It is the basic action of the animations in Flash. It allows us to move a Flash symbol from one place of the stage to another, being necessary only two frames, which optimizes a lot the movie performance.
It is important to emphasize that to correctly execute a tweening motion the involving objects must be converted to symbol previously.
You should also be careful when making a tweening with two symbols that are in the same layer, since the animation motor will group them as the only one and the result will be unexpected. By this it is advisable to make sure two issues:
- Separate in different layers the fixed objects and the ones thatwill be animated.
- Also put in different layers objects that are going to be animated with paths or different shapes.
Let's proceed to the theme in question. A tweening motion, as we've said, is the displacement of a symbol from one to another point of the stage. The fact that only two frames are needed is because Flash, only with the starting point and end point, "knows" the path in straight line and represents it (we'll see that also no rectilinear movements can be made).
When we do the tweening correctly we will observe a sign like this in the timeline.
This indicates that the animation will change the position of the symbol of the frame 1 to the position of the same symbol in the frame 20, using exactly 20 frames. The number of frames that are used in the tweening motion will indicate the substages of the animation. The more substages you add, much more vivid will be the sensation of "continuity" (lesser abrupt jumps) but simultaneously lesser its speed in the movement.
We can also change the speed of the motion in the movies by modifying its value in the time bar,
but this will not change what we have commented previously.
The rate is expressed in Frames Per Second (pps) and it can be modified by double clicking in the indicated place of the time bar. The larger value, the higher speed will be. But to develop the animation as we want, enough frames are always to be set.
In the Unit 1 animation you could see how to make a motion interpolation.
Keep in mind that when you make a motion interpolation the start and final frame will have to be different, in the contrary it will not represent any movement at all.
Look at the next images and observe where is the ball placed in each frame of the animation:
Here you can see how to tween motion
If the object with which we want to motion is not converted to symbol we'll find something like...
... and the animation will not work.
Also we can make the tweening in another way, without converting the object to symbol previously, since Flash will automatically convert it to symbol if we don't do it, giving the name "Animate" plus a number.
It is enough to right click on the frame that contains our object (in the timeline) and select Creating Tweening Motion. Create a keyframe in another place of the timeline and the tweening motion will be created automatically, and we will only have to modify this last frame to produce the animation.
Perhaps this isn't most advisable in large movies, as we've already commented, because of the large amount of symbols that can appear and confuse by many symbols with similar names.
Flash also allows us to create animations with rectilinear trajectories in several phases, with different directions. For it, once the tweening created, it is enough to select one of the intermediate frames and create a new keyframe. If we move the symbol in that frame to another place of the stage and play the animation, it will go first to this position and then to the final position.
If we do this several times on various frames we'll obtain several consecutive trajectories more.
Tweening Motion (II)
We've just seen the motion tweening as a method to move a Flash symbols from one side to another of the stage. Nevertheless, we can take advantage of this program command to make animations in which our object increases or decreases its size in a progressive way.
This is very simple with Flash 8; it is enough to modify the symbol instance in the last frame of the tweening motion, but this time changing the size.
We can apply both effects simultaneously, so that the change of size will occur while the object moves. Also we can do the change of size in several phases or sequences chained as in the common motion tweenings.
The following example incorporates these three characteristics of the Tweening Motion of Flash 8.
And the timeline what's left is something as simple as this:
More Flash & Swish: 
