- last post: 01.01.0001 12:00 AM PDT
ok Punk heres how to make animated gifs
The basic steps for creating animated GIFs are rather simple:
Create a series of individual pictures or frames, that when put together, create an animated "cartoon"
Collect each picture (or frame) together and build the animation into a GIF89a file
Embed your animation into your online instructional material
We will walk you through the creation of the teleost jaw as an example.
Create the frames for the animation
Special Software or Equipment
Scanner and scanner software for scanning line drawings
Graphics program for editing line drawings and adding color (or creating pictures from scratch if necessary)
Procedure
Scan in the series of drawings (or create a series of pictures from scratch). It is important that the size and orientation of the figure(s) are consistent throughout your series of pictures. Below is the original figure that we used to create the teleost jaw animation:
http://www.willamette.edu/wits/idc/howto/jaws.gif
We used DeskPaintTM to cut the above figure into eight separate figures or frames. We named the frames consecutively to be sure that we put them together in the animation in the correct order.
We then colored in the three bones of interest in each frame.
It was critical to orient the jaw in an indentical manner in each frame. The corner of the lower jaw was used as a reference point inorder to do this.
Build the Animation
Special Software or Equipment
GIF Builder 0.5
Procedure
Open GIF Builder. If no window opens up automatically, then click on Windows and click on Frames Window and then repeat and click on Preview Window.
Now click on File and Add Frame
Locate the directory with your animation frames and double click on the name of the file that will be your first frame.
Repeat these steps for each of the frames in your animation so that you end up with a list of all your files in the order you want them to run. If you need to reorder the files, you can click on a file name and drag it to where you want it.
There are a number of settings that control the running of your animation, many of which you do not need to bother with (leave them set to their default), but we'll mention some of them briefly here. To change any of the default settings, simply click on the first frame name, hold down the shift key, and then select the remainder of the files so that they are all highlighted. This will ensure that the change in settings affects all of the files. To change the option settings, click on Options on the menu bar and then click on the option you wish to change.
Dithering - should be set on for phogographs and off for drawings with few colors
Loop - this specifies how many times the animation is repeated. The viewer of the animation may repeat the animation by "reloading" the page. Suggested setting is eitherno or forever. In the teleost jaw animation, this was set to 10 with the instructions for reviewing the animation.
Interframe delay - this is the delay between the rendering of each consecutive frame. It's specified in hundredths of seconds. The teleost jaw animation was set at 40/100. The use of As Fast as Possible is not recommended.
Once you have set your run options, preview your animation by clicking on Animation on the menu bar and then Start. If you are satisfied with the end product, you are ready to save your animation. Click on File and Save.
Embed the Animation into an HTML Page
Animated GIFs get put into HTML pages just like any other graphic and you can use GIFBuilder to provide you with the HTML code:
Do not close GIFBuilider, but open up your HTML file and determine where you would like to place your animation.
Go back to GIFBuilder and click on Edit and then Copy HTML Image Tag.
Return to your HTML page where your animation should be and click Paste.
Use a browser to open the page to determine if you are satisfied with the location and running of your animation.
You may edit your animation settings by opening GIFBuilder, clicking on File and then Open.