 An animation is a sequence of pictures which are flashed quickly in front of your eyes, in order to simulate real motion. Our Communications Technology class has been experimenting with simple animated sequences using several computer programs. The most important program is the gif animator; we used Gif Construction Set, a commercial gif animation program available from MindWorkShop. Although the registered version costs about $30 or so, this is very inexpensive compared to traditional animation programs. (There is also a shareware version available). A series of small drawings are first made using a graphics program. We use ULead's iPhoto Plus, which (unlike Paint) allows smudging and individual object copying. The sequence includes elements which slowly change their position or shape from frame to frame. Here are the drawn frames from a sample animation:    Each one is identically sized at 200 by 111 pixels. In the example shown here, every frame includes the background. The object to be moved is selected, including a piece of the background behind the object. When it is pasted to the right, the background that came with it automatically covers the old image. This method is easiest, but won't work as easily if the object moves over a differing background; you might have to paint out the old image each time. Also, this method may result in a large final animation, due to the number of full frames. However, Gif Construction Set allows you to optimize the final image by removing the parts of each succeeding frame that don't change, which solves the 'size' problem. A variation on this method is to make a single background, and add the 'moving' object in each of the remaining frames. Here's an example:      The object was then selected, and pasted into the original frame in the correct position and orientation to make new frames. The advantage of this method is that you get more precise control of the object's position, and don't have to worry about changing background colours. Since each frame contains the entire drawing, optimization is again used to make the final animation smaller in file size. Gif Construction Set allows a third variation, which our students did not use. The object to be animated can be inserted into the animation in the correct location, without having to paste it to the background in the graphics program. Using this method, the final result will only contain a single background picture, along with the tiny pieces you're animating. This makes the file size much smaller. Animations were tested using Irfanviewer, an incredibly versatile graphics viewer and editor. (Download a free copy here). Next we used Gif Construction Set to combine the frames into a single gif file, and set the timing between frames. Let's look at some student work to see what kind of results you can get. Eyvind prepared a total of 15 background images of a basketball player making a shot, changing the player and ball position with each frame. Here are some selected frames:    These are frames 1, 3, and 7. See the final animation of all 15 frames here; remarkably, it's just 17k in size. Here are several pieces Kamie used to construct her animation of an apple falling from a tree.   See the final animation of all 10 frames here; this one is also just 17k in size. You can also look at Kenneth's animation of a motorbike; this one is 27k in size, and illustrates how you can crop and copy photos of actual objects to make an animation more realistic. See David's moving truck and Scott's dune buggy for similar exercises. Mandy's swimming fish shows a very nice 16k animation of several objects moving at once. David's man pulling a wagon illustrates simulated movement by scrolling the background. Jordan's arrow hitting a target is a very nicely drawn animation, and surprisingly only 16k. Cody's arrow hitting a deer was made using a photo and a drawn arrow, and is a little larger at 34k. Big animations without a correspondingly large file size can be achieved if the background colour is kept solid (and unchanged) for all frames in the animation; Scott's 44k basketball player illustrates this. More animations: Eyvind's spinning basketball Isaac's tumbling man David's baseball throw Another technique for animating a subject that will keep the result small in file size involves cutting the picture into pieces, and only animating the required portion. Here is a sample of that technique, using a photograph of Mandy.  A few of our students have also been experimenting with 'claymation', taking a series of digital stills of a posed figure, and creating an animation. Here is the first one, made by Stan and Braden. We also have David & Kenneth's claymation, called 'Obey Your Thirst'. It's considerably larger, at 209k, because there are 80 frames. Each one was a separate photograph taken of the clay figure as it was repositioned. The gif animation had to be considerably brightened and cropped in order to make it a reasonable size; as it is, it may require a few moments to load. Please be patient ... it's worth the wait. See it here.
In the course of making videos, we've also attempted some animations to embellish the final results. The animation portion a video is a series of stills, each created in a graphics program and imported into the video editor storyboard as a .bmp image. We've found that the processes involved in making animations and videos are very similar. You might also like to visit our pages about producing videos in the classroom, and making animated clay movies. |