Resizing An Animated Gif

Resizing An Animated GIF

Guide Overview

The purpose of this guide is to teach you how to take an Animated GIF file, and reduce the size of it.
One of the reasons you might want to reduce the size of the GIF, you have a nice animation you want to use as an avatar on this forum. For the purpose of this tutorial, let's assume the GIF is 100 pixels wide x 100 pixels high. This forum will not support an avatar that is larger than 83 pixels high x 83 pixels wide, so it needs to be resized to work properly.

An animated GIF, is a file made up of layers of images, stacked one on top of the other.
In each layer, the image is a little bit different than the previous image.
So, when each image is "flipped through" at a given speed, the image appears to move, like a flip-book.
This is a rather simplistic explanation, but that's how it basically works.

If you try to use a GIF larger than 83 x 83, the forum's software will reduce it to those dimensions. Since the software doesn't support animation resizing, the first image that makes up the animated file will be resized. It will ignore, and discard, the other images, leaving you with an image that is not animated.

This Tutorial will be broken into 2 parts.
The first part will deal with using Irfanview, to extract the frames of the GIF, then resize and convert them.
The second part will discuss the actual re-compiling, of the extracted frames.

A short Flash presentation is also available for viewing. As there are several steps involved, and the use of 2 programs, I suggest you first read through the tutorial to familiarize yourself with the process, then watch the video,
If you still have question rereading the Tutorial, should answer most of them.
The written Tutorial, will give you a bit more detail about the Resizing operation.
Animated GIF Resizing Video

Tools Needed

• Irfanview
• UnFREEz

Instructions: Part 1

• Open Irfanview, click File, and select Open.
  
  
• Navigate to the GIF you want to resize, highlight it, and click the Open button.
  This will load the file into Irfanview.
  
  
  
  
• Click Options, and select Extract all frames..., which will seperate the animation into it's individual frames.
  
  
  
  This will open the Browse for Folder dialog box.
  
  
• Select the folder you want the extracted frames sent to, and click OK.
  
  
  
  
• Click File again, and select Batch Conversion/Rename...
  This will open the Batch conversion dialog box.
  
  
  
  
• Click the dropdown arrow next to the Look in: box, and navigate to the folder you extracted the GIF frames to.
  Use the dropdown arrow next to the Files of type: box, to make sure BMP/DIB/RLE is selected.
  
  
• Highlight the extracted files, and click the Add button.
  
  
  
  This will add the files to the Input files: list.
  
  
  
  
• In the Output directory: section, click the Browse button, which will open the Browse for Folders dialog box, and navigate to where you want the converted files saved.
  
  
  
  
• In the Work as: section, put a tick next to Batch conversion.
  
  
  
  
• In the Batch conversion settings: section, under Output format:, use the dropdown arrow to select GIF.
  
  
  
  
• Click the Options button.
  This will open the JPEG/GIF save options dialog box.
  
  
  
  In the GIF section, the only thing that should be checked is, Save interlaced.
  
  
  
  Click the OK button.
  
  
• On the right, put a check in the Use advanced options box.
  This will activate the Set advanced options button.
  
  
  
  
• Click the Set advanced options button.
  This will open the Settings for all images: dialog box.
  
  
  
  
• This is a list of what should be checked/ticked in this dialog box:
  Resize
  Set new size:
  pixels
  Set long side to: (type 83 in the box, as shown)
  Preserve aspect ratio (proportional)
  Use Resample function (better quality)
  
  If anything else is checked, remove the checks/ticks, then click the OK button.
  
  NOTE:
  These settings will remain the same, everytime you open Irfanview, unless you change them, so if you have several GIF's to convert, you won't have to reset them.
  
  
• Click the Start button.
  
  
  
  
• You'll see the files being processed.
  
  
  
  When it's finished, click the Exit button.
  
  
• Close Irfanview.

That concludes the extraction, conversion, and resizing part of the operation.
That wasn't too hard, was it?
Now, on to the making of the animated GIF.

Edited by tg1911, 16 November 2006 - 08:46 PM.

Instructions: Part 2

• Open Windows Explorer, and navigate to where you saved the converted files.
  
  
  
  
• Open unFREEz.
  
  
• Resize the window containing the converted files, so you can put unFREEz underneath it.
  
  
  
  If you put unFREEz on the window, and you go to select the files, it will hide unFREEz behind the window.
  When you select unFREEz to bring it to the front, it will deselect the files, so you'll end up going in circles, trying to view them both.
  
  
• Highlight the converted files, and grab (left click, and hold the button down) the first file.
  
  
  
  
• Drag them into unFREEz's window.
  
  
  
  
  NOTE:
  If you don't grab the first file, when dragging into unFREEz's window, there's a possibility of the files not being loaded in the proper order. Grabbing the first file, while dragging, will insure they are loaded properly.
  
  
• Make sure the Loop animation box is checked.
  
  
  
  
• Set the Frame delay: to what ever value you want.
  
  
  
  NOTE:
  This will take some "playing around" on your part. An entry of 1 (one), will give you a frame delay of 1/100 of a second, so an entry of 100, equals 1 second.
  I'll explain more about this in the following steps.
  
  
• Click the Make Animated GIF button.
  
  
  
  
• This will open the Make Animated GIF dialog box.
  In the Save in: box, pick a place to save the new GIF.
  In the File name: box, give it the name of 1 (I'll explain this in a minute), and click the Save button.
  
  
  
  
• Open Irfanview, and make sure you can have more than one instance of Irfanview open, at a time.
  Options / Properties... / Misc. 1 tab / uncheck Only 1 instance of Irfanview is active
  
  
• Click View, then Display options, and select Do not fit anything.
  
  
• Open the resized GIF you just made, in Irfanview.
  
  
• Open the original GIF in another instance of Irfanview.
  
  
• Put the 2 Irfanview windows side by side, so you can compare the 2 GIFS.
  
  
  
  Depending on what you set the Frame delay: at, in unFREEz, your new GIF will probably not be moving at the same speed, as the original. Here's where the "playing around" comes in.
  If your new GIF is moving slower than the original, the Frame delay: will have to be set to a lower number.
  If your new GIF is moving faster than the original, the Frame delay: will have to be set to a higher number.
  
  
• Go back to Step #4, and repeat, adjusting the value in Frame delay: up, or down, as needed.
  Each time you have to repeat these steps, name the created GIF's in sequential order; 1, 2, 3, etc.
  
  
• When you have an acceptable animation, delete the others, and rename the completed animation with a name of your choosing.

While reading through this, it may seem like a rather involved process, but it's not really that hard.
As you do it a few times, it becomes much easier.
Just take your time, and enjoy.

Edited by tg1911, 16 November 2006 - 08:57 PM.

What about the transparency? Will it be converted to a background color? If yes, how can you change it?


Post Edit:
Actually it worked like a charm after I've ticked the box to select the transparency color two times: first time when I dismounted the frames and second time when I saved the changes for the new cropped frames. Just click the color you want to become transparent with your mouse for each frame upon saving.

Thank you so much for sharing this tutorial!

Edited by loglive, 18 August 2008 - 12:07 AM.

It will be converted to a background color.
To change it:

In Post #1, Step 11, where it says, "In the GIF section, the only thing that should be checked is, Save interlaced.", also put a check in the Save transparent color box, and a tick next to Choose transparent color during saving.

Then when you get to Step #15, and click the Start button, as the images are processed, it will display each image, one at a time.
Click the area (color) on the image that you want to be transparent.
Once you select the color on each image, you'll see the dialog box in Step#16, from that point on, follow the rest of the directions.
Your transparency should be preserved, in your final animated GIF.

How do I change the size?
This is what the forum avatar support

Note: The maximum size of your custom image is 80 by 80 pixels or 19.5 KB (whichever is smaller).

My gif avatar is 496 KB, 120 x 90.
Thank you.

I use fotosizer:
http://www.fotosizer.com/Download.aspx

Fotosizer will work, if it's not an animated .gif.
If it's animated, following the above procedure will help you reduce the size of the .gif

Post #1 discusses resizing the .gif images.
You can use Fotosizer after Step#3 in Post #1, if you want to, then continue on to Post#2 to re-animate it.

It worked! I'm having problems with this really big gif animation. Big gifs are very slow to load. I tried resizing all frames and it's really painful. Batch conversion are really helpful. Thanks!

I have found a great GIF resizer : http://www.ashongsoft.com/gif-resizer.html
It does everything in only one step.

Edited by Romeo29, 21 March 2010 - 07:27 PM.
Corrected the link

Irfan View sure is an amazing little piece of software ... and it's not limited to just image viewing/editing.


However, for creating or editing animated .gif files I use Jasc's "Animation Shop"

Another one - online: http://www.online-image-editor.com/

A site personally tested by me:

http://picasion.com/resize-image/

Best Resize WebApp for gif and png image.

https://www.imagecompresser.com/resize-image

Some posters seem to have lost track of the fact that still images (.jpeg/jpg, etc.) don't play by the same rules as animated .gif files, which was the subject of this topic, way back when.

 

Louis

you can use jpeg compressor tool for Resizing Gif with original quality file. you can check the Gif file size