Animated GIFs are one of the oldest and yet most popular image styles to grace the Web. Advertising banners, MySpace pages, Google+ streams, and forums are all commonly associated with the animated GIF. A GIF file, simply put, is an image container that is capable of holding multiple images that cycle at a given time. One of the early advantages of the GIF was that it allowed for transparency, making it a useful tool for applying rounded buttons and other images to a page.
Since the founding of the GIF, several arguably more compact and easily shared images types (including the PNG) have all but replaced it for simple transparent images. However, the GIF remains a popular tool for sharing funny moments that can only be properly relayed in motion. The GIF is still one of the simplest and best-supported solutions for doing so, far exceeding Adobe Flash and actual video files in efficiency.
So, how do you convert a video file into an animated GIF? I decided to pose the question to Kevin Staff, one of LockerGnome’s most active community members to get his suggestions for beginners.
What is an Animated GIF?
GIF stands for Graphics Interchange Format and it was introduced to the world by CompuServe in the late 1980s. Supporting up to eight bits per pixel, the GIF isn’t the most color-accurate image format out there, but it is one of the most popular due to its widespread support and flexibility.
GIF files are palette-based. This means that each image can draw from up to 256 colors, though the colors themselves can be defined from a greater color space in the millions. This means that one GIF may support a certain 256 colors while another sports an entirely different set. The limitation is per image rather than across the board.
That said, there is a way to force an animated GIF to end in a 256-bit color image. By using transparency, each sub-image can contain a separate 256-color panel. At the end of the rotation, an entire whole image is formed, which can appear as a 256-bit RGB true color image. The best way to think about this process is to imagine a newspaper printer adding one color layer over another until all of the colors are present in the final product.
How to Make Your Own
Making an animated GIF out of a video file is actually a fairly simple process. There are several methods to get this done. Some of them can be done with simple online tools that walk you through the process, while others take advantage of the power of professional image editors such as Photoshop and GIMP. Here are few ways to turn your video files into animated GIFs.
Gifninja is one of the simplest and fastest ways to turn your video file into an animated GIF. All you need to do is upload a video file, preferably two to 10 seconds long, add your title, dream up a clever caption, and adjust the animation speed. Once you hit submit, the page will go dark for a few moments while the GIF is generated and made available for you. This can take a few minutes if your source file is particularly large.
Be careful: The top link surrounded in green is actually a link that can be used to delete your GIF. The link you’ll need to share it with others using the site as a host is located below the GIF itself.
One thing I noticed with Gifninja is that it didn’t take my original video size on a first try using H.264 formatting on an .MP4 file. There is a tool to resize still images linked on the page, though there was no apparent help area to combat the video resizing issue.
GIFSoup is another handy resource for turning your video clips into animated GIFs. Not only can it turn your existing files into GIFs, but you can use your webcam to create one on the spot. This is a handy service, though you’ll need to upgrade to a premium account if you wish to create larger files (including HD), add text, remove the GIFSoup watermark, create 30-second GIFs, and more.
GIFSoup runs $5 for a one-month membership and $25 for a year. Whether or not this service is worth it to you depends entirely on your needs.
For guests, you can create animated GIFs directly from YouTube videos. Once you’ve inserted a YouTube video link in the field at the top of the main page, you’ll be taken to an editing page where you can refine your creation. You can:
- set a start time.
- set an end time.
- select a category.
- set to private.
- add a title and tags.
- choose a GIF size.
Premium members have more options available to them, but this should be more than enough to get you started.
GIMP with GAP
GIMP is one of the most powerful cross-platform image editing tools out there today. Not only is it leaps and bounds better than many budget consumer options out there, but it can arguably stand toe-to-toe with Photoshop on a variety of everyday editing applications. Oh, did I mention that it’s open source and free to download?
GAP is the GIMP Animation Package, a plug-in that allows you to turn video files into animated GIFs with relative ease and extraordinary customizability. You can use GAP to fine-tune your GIFs to meet file size requirements and frame rates that suit your needs.
Both GIMP and GAP can be downloaded for free through the download page on the official GIMP site.
Creating an animated GIF in Photoshop is relatively easy. All you need is a video in the .mov container format and Photoshop. If your source video is in another format, there are plenty of great tools (including QuickTime) to convert the file over to the .mov container format. H.264 is my preferred codec.
For the sake of saving time, you’ll probably want to edit down your source video prior to importing it into Photoshop. You can do this using either QuickTime X (or Pro for Windows users), ScreenFlow, Camtasia, iMovie, Sony Vegas, and others.
Once you load Photoshop, here are the steps to create an animated GIF:
- Select File > Import > Video Frames to Layers
- Choose your source video.
- Delete excess layers. The less layers you have, the faster your playback and smaller your file will be.
- Add text if you wish. Make sure the text layer is on top of all the others.
- Select File > Save for Web and Devices
- Set the size, colors, etc.
- Make sure the file size is within acceptable limits. Anything over 400k can take a very long time to load.
- Select Save.
Evan’s Movie to GIF Converter
For Windows users, there is a simple free program available that converts MPEG, WMV, and AVI files into GIFs with a few clicks of the mouse. Evan’s Movie to Animated GIF Converter is a quick and easy tool for clipping and exporting your video files to an animated GIF. You don’t have a lot of options for customizability, though the results aren’t bad looking at all. If you’re looking for something simple and quick, this is a viable solution for you.
Kevin Staff is no stranger to the animated GIF. He has created dozens of them for LockerGnome alone, many of which can be found on his Google+ profile. When asked what advice he would pass along to beginners, he stated: “An animated GIF is like a merry-go-round. Once you pick a video sequence, the GIF animation site turns it into a never ending ride you can never stop.”
Choosing the correct video clips requires a special balance between telling a full story and keeping the file size down. After all, if the file size is too large, who’s going to have the patience to download it? Kevin advised, “Choose short video scenes (two to 10 seconds) to create your animated GIFs so your finished file size is small and easy to download on the Internet.”
Another factor in the overall quality of your animated GIF is the clarity of the image. While your results are limited by the file’s 8-bit color limitations, you can still achieve amazing results when your source is of quality.
Action is also a factor in how the audience receives your animated GIF. “Use the most action-packed video segments for your animated GIFs to keep your viewer engaged,” Kevin said, solidifying the point that pretty much anything you put out on the Web needs to capture the attention of your audience and draw them in for the duration. Even if your GIF is two seconds long, you’re going to want to make it interesting to look at. What makes this GIF worth the extra load time over a JPG or PNG?
With these tools at your disposal, you should be able to create an exciting animated GIF without having to spend a fortune on high-end image editing software to do it. In fact, two of these solutions highlight the usefulness of the cloud, giving you the ability to be creative without even installing a single editing program locally.