|
Animated Gif Tutorial
This is gonna be a simple, yet complete 'how to' guide on making an animated gif from an avi file.
RULE 1: YOU WILL NEED TWO, AND ONLY TWO PROGRAMS TO MAKE AN ANIMATION FROM AN EXISTING AVI FILE
RULE 2: ONE PROGRAM IS GIF MOVIE GEAR
RULE 3: ONE PROGRAM IS VIRTUAL DUB
RULE 4: FUCK EVERY OTHER GIF ANIMATION PROGRAM. PERIOD.
**If you want to make animations out of other media(flash/quicktime/etc) you will need programs that can convert those mediums into a raw avi file that you can edit with the following programs
----------------------------
Using VirutalDub:
----------------------------
Step 1: Open the avi file you want to cut down in VirutalDub.
Step 2: Using the "in" and "out" markers, delete all sections of the video that ARE NOT associated with what you want to animate.
** To do this, goto the FIRST frame of the part you want to DELETE and click the left arrow button. This will mark the "beginning" or "in" point. Then you go to the LAST frame of the part you want to DELETE and click the right arrow button. This in turn, marks the "end" or "out" point.
Step 3: After doing Step 2 you will notice that the part of the video you are trying to DELETE will become highlighted. Hit the delete key on your keyboard and it will in fact, be deleted.
Step 4: Delete all "repeating frames" manually by going through the video file and deleting any frame that is a duplicate. This cuts down on file size, and makes the animating job easier.
Step 5: Save your new avi file UNCOMPRESSED(click "video, compression" and pick "uncompressed" prior to saving the video file), and name it accordingly.
----------------------------------
Using Gif Movie Gear:
----------------------------------
Step 6: Open your newly saved avi file in Gif Movie Gear.
Step 7: Check the file size of the animation to see how large it is(don't worry if it's pretty big at first).
Step 8: Check to see how many animation FRAMES it has.
Step 9: To trim down on file size, THIN your animation by "2".
**If the animation looks choppy, you can edit the TIMING by adjusting the NUMBERS in the preview window.
Step 10: To trim down on file size, RESIZE your animation.
**No animation needs to be mega huge. Resizing often helps with the overall file size and makes it more accessible to people.
***Be sure to ONLY resize by using the BILINEAR option.
****If you are trying to rip sprite animations resize by using the NEAREST NEIGHBOR option.
Step 11: To trim down on file size, CROP your animation.
**This feature allows you to basically crop off parts of the animation...mainly for personal preference, but it does help reduce overall file size.
Step 12: Once you have your animation at a reasonable pixel width(from RESIZING) and you have thinned the animation, OPTIMIZE it.
Step 13: If the animated gif is at a reasonable file size, SAVE it.
---------------------------------------------------------------------------
Things to watch out for as you perfect the craft:
---------------------------------------------------------------------------
Try to develop an eye for making animations loop when you can. Especially if it helps the overall flow, or can lower file size.
When doing animations, the less background movement/noise, the better the optimization will be(and the smaller the file size will be). When that can't be helped, pray that you can get a decent file size out of it at around 256pixels wide.
-------------------------------------
Optimization, and you:
-------------------------------------
Optimizing an animation can work wonders if used correctly. This option allows the program to share colors and information between frames to save file size on your work. However, there are a few things to remember when using optimization and this example pertains to "image movement".
Static backgrounds
Notice the completely static background, as the only moving object is the character itself. This leaves the entire background to be shared AMONG frames(thus not requiring it to be drawn in every single frame of the animation). This is when optimization works it's absolute best. Secondly, if an image has no background motion, you can usually get away with making it a tad larger than normal as the file size will still stay REALLY low.
Backgrounds w/motion
See how the background moves in almost every frame as she starts to crouch? This means that the optimization doesn't have the ability to share the color/palatte information between frames(ie; it has to draw the background for each frame), which makes the file size larger(I even dropped the color quality down to 128[from 256] on this to lower the file size even moreso.)
------------------------------------------------------------------------------------------------------------
Dithering. What it does, how it can help AND hinder your animation:
------------------------------------------------------------------------------------------------------------
Dithering is a technique that you can use(edit~preferences~palette tab) to up the overall color quality of your animation. Unfortunately, while dithering adds tons of small pixel 'dots' to your animation(in each frame) to help 'spread' the color palatte around evenly, it also increases(exponentially) the overall file size of your animated gif.
So, if you want to use dithering it's up to you to find a good palette balance that lets you keep the image quality high, while retaining a low file size. Two examples below show the difference between having a dithered image, and NOT having a dithered image.
Un-Dithered
This image is a PERFECT example of what a NON DITHERED animation looks like. Look closely at the security guard's outfit(around the stomach area). You can easily see where it SHOULD be a smooth gradual shading of colors, but instead it's blotchy and seperated.
Dithered
This is a perfect example of what dither can do in terms of overall image quality. Take a look at this one and compare it to the security guard gif. Her skin tone is completely smoothed out, the colors are vibrant, the animation is fluid, and there is NO blotchiness to be found anywhere.
MrWhitefolks
|
All content, designs, graphics © 2001-2003 Pimp-Productions.com
Founded and created by Edward Veira, Austin Castillo, and Jacob Childs
|
