How to create high-quality GIFs (from any video!)

Apr 23, 2024 - 8 min read

gif new.webp

How to create high-quality GIFs (from any video)!

Author: Andrew Goble

You deserve smooth and cinematic gifs. (Yeah, we said it!) 

alt=""

These little moving images pop up everywhere, from text messages to LinkedIn feeds, and even jazzing up those otherwise yawn-worthy emails. 

GIFs are pretty widespread, but let's face it, they often look dated. They're usually small, low-resolution, and seem almost like a relic of the past. 

Sure, they're great for adding the perfect movie reference or reaction, but couldn't they look, well… prettier? 🤔

Luckily, there’s a light at the end of the pixelated tunnel. Content creators have found new ways to break free from tiny, choppy frames and usher in an era of high-quality, visually stunning GIFs. 

Here's how you can join the GIF revolution too!

What exactly are GIFs and why are they usually pixelated?

GIF stands for Graphic Interchange Format, a digital image file that's been with us since the dawn of the internet era.

And as for whether or not it’s pronounced "jif" or "gif?"

Well, the creator of the GIF insists on "jif", while the Oxford Dictionary says either works. So, ultimately, it's up what ever you prefer (although some swear against using a 'hard J')!

But, debate aside, why can some GIFs be a bit of a pixelated mess?

Well, this is because they were born in an age where using the internet meant unplugging your home phone. (Yes, millennials, the dial-up sound haunts our nightmares too). 😂

alt=""

GIFs were originally built for speed, not beauty. Limited to a basic 256-color palette, they were best suited for short clips with pretty similar frames. 

Wanna see what we mean? Check out this (surprisingly still-active) Bob Dole 1996 campaign website. Talk about a blast from the past.

Another challenge for GIFs is their size. It’s tough to make a series of moving images the same file size as a static image, like a JPEG. Worse still, the more a GIF is shared, saved, and re-uploaded, the worse its quality becomes.

But worry not – high-quality GIFs are possible! 

We’re not kidding, there’s even a whole Reddit community (r/HighQualityGIFs) devoted to making superior GIFs.

Their recipe for these top-tier GIFs comes down to four elements: resolution, smoothness, visual effects, and software

But how exactly do you create such a GIF?

The answer lies partly in new technology that makes sharing crisp, vivid video clips a breeze.

Image hosting platforms like GIPHY and IMGUR have developed new file formats (GIFVs) that display video clips as though they were GIFs. This makes it easy to embed them into your content, share them via text, or save them as old-school GIFs for emails.

So, it's time to start making smooth, vibrant, animated GIFs, all with a dash of eye-catching special effects.

Let's dive into some best practices for finding, editing, saving, and sharing high-quality GIFs! 👌

How to find GIF footage

GIFs and GIFVs formats are designed to display quickly, which leads to them being compressed in size.

So, when making a GIF from a YouTube video, a movie clip, or even your original footage, it’s important to start with the highest quality video you can get. Because, sadly, the quality can only decrease from there.

Luckily, you don't need to be an expert to source top-quality footage. There's a wealth of material available online for free, including sites like www.keepvid.com and www.savefrom.net. These let you download footage from YouTube and Netflix to use in your snazzy high-quality GIFs.

When picking what video clips to turn into GIFs, short, looping clips work best as they’re the most engaging. Think funny movie one-liners, brief YouTube snippets, or clips with repetitive movements. 

Some of the most classic GIFs (we’re looking at you Parks and Rec 😉) are often just repurposed scenes that are shorter and able to loop seamlessly.

How to edit GIFs

Once you’ve got the source footage, you’re ready to turn it into a GIF. It sounds hard, but transforming a video to a GIF isn’t too difficult. If you just wanted to turn a portion of a YouTube clip or video into the GIF file format—no subtitles, transitions, or other special effects—you don’t even need extra software. Try this GIPHY GIF maker. Or this one from IMGUR. Those are the two main sites for hosting your GIF, so it makes sense to create your GIF there, too. Just drop the web link or file, and boom: you’ve got a GIF. Or a file that works pretty much exactly like one.

If only your GIF-fing forefathers could see how easy you have it.

But to really make a GIF stand out you’ll want full control over the type, effects, and looping effects. So you’ll need to edit the footage as a video, converting it to a GIF at the end of the process.

Though most of the pros use Adobe After Effects or Adobe Photoshop in some combination, there is lots of software that makes special effects with GIFs possible. Programs like NukeX, GIMP and Blender are all free software on which you can edit and produce original GIFs.

For those using After Effects, paid plugins like GifGun help you render GIFs straight from After Effects. On the other hand, if Photoshop is your tool of choice, it would be useful to understand how to import videos into the app. This will help you edit each frame. You can find a detailed tutorial on how to do this here.

Most GIFs overlay text, since, you know, there’s no sound to hear what the character is saying. But if you overlay big, fat, Comic Sans speech bubbles over your video, you’ll undermine all that hard work you did in getting the high-quality footage in the first place. Take it from the HQ artists in the r/HighQualityGIFs subreddit: you have to consider a few components while laying out text on a GIF: font, color and layer styles.

For the font, they suggest using a serif font to make the text easier to read. They link to Google Fonts as a good source for font finding and recommend fonts like Coolvetica and Gotham for clear reading. For text color, they warn against harsher tones like bright pinks and greens, even black and white can be too intense.

For layer styles, they say you may want to add a drop shadow or outline to the text. However, with the motion of the GIF, this can become tricky. With limited data for pixels and colors, it can be hard for these effects to look realistic and natural as the image moves from frame to frame.

Fidget with the text so it shows up in the right frames — the more it feels like perfectly timed karaoke subtitles, the better. Once you’ve lined it all up, you now have a completed video. Now, we’re off to the technical part: retaining as much of the details and color as possible while exporting the GIF at a size that won’t take 10 years to load.

How to export GIFs

Your GIF export settings depend on the software you use. One rule of thumb tip is to avoid exporting your GIF too large. While small GIFs often fail, high-quality GIFs can also be too big.

Try not to make your GIF wider than 960 pixels. You might want to make it bigger after seeing it in high quality on your editing software. But since GIFs are mostly shared on phones or in boring emails, keeping the size down is the best way to keep the file size small and the quality high.

Here's a suggested setup for exporting in Photoshop:

Screenshot of GIF export settings window, showing options for colors, dither, transparency, and more.

Aim for under 2MB if you’re trying to make something ultra-shareable, which will require trimming down the length of your clip and further shrinking the size if necessary. Big-time GIF artists, who know their fans have all the internet bandwidth they could ever need, go to 10MB and beyond. But beware: if a GIF takes 9 seconds to load and it’s only 4 seconds in the first place, you’ll have some unhappy customers.

If your file is still too big, you can use features like Web Snap and Lossy to make it smaller. These are usually available in whatever software you use to create GIFs and can be helpful for big files, like a 20-second movie clip.

Web Snap helps to avoid color changes (or 'dithering') when your GIF is viewed online. It does this by changing some colors to ones that work well on the web. The more of these web-friendly colors you have in a GIF, the less color changes you'll see. 

Lossy compression makes the file size smaller by getting rid of some visual details from the GIF.

But we’re here to make high-quality gifs, not high-length gifs. And we’re sorry: if we’re going to re-watch over 20 seconds of Wolf of Wall Street, we’re probably going to want to do so with some audio. Keep it short, and you get to keep your clip beautiful.

How to host GIFs for sharing

Depending on the software you use, you’ll either end up with a finished video file or a finished GIF file. Now you’ll want to shrink it and host it on the web.

This is where even the most vaunted of GIF artists trip up. But don’t worry: If all those software skills and export specifications are out of your depth, there are streamlined methods of GIF creation and uploading optimized for users like you. Websites like Giphy and IMGUR have intuitive built-in tools that transform your too-large video or GIF file into a smaller, shareable version. Just drag it into the site, and minutes later, you’ll have a web link of your GIF, with different sizes (and file formats) to make sure your looping video looks its best no matter where you share it.

Share it with your friends. Put it on your website. Make the perfect GIF for the perfect Twitter reply to that user you desperately want to impress with your slick references. And if you need inspo? Head to the experts over at the HQ GIF subreddit to stay on top of the newest trends. Who knows? One day, you might end up on that top page—we think that’s an accomplishment you can brag about on your LinkedIn.