Use artboards, save as PDF and then just upload

This is somewhat inside baseball, but I love using animated GIFs. They’re great for illustrating ideas and I use them in a lot of articles. Making them, however, used to be a pain, until I figured out this one trick.

Designers are either Photoshop people or Illustrator people. If you’re a Photoshop person you don’t need this, PS does animated GIFs natively. Illustrator, however, does not. I used to output images and do the animation in Photoshop, but that’s a huge pain. If you want to fix one spelling you have to do the whole thing from scratch.

This is much easier. Here’s the method, in its entirety:

1. Make each frame an Artboard in Illustrator
2. Save As a PDF
3. Upload the PDF on ezgif.com

That’s pretty much it, Ezgif lets you set the timing for each frame (and any transitions) and outputs an animated GIF. The cool thing is that PDF is a native editing format for Illustrator, so you don’t need to export anything. I just upload the same file that I work on.

I’ll go through each step in detail.

Make each frame an Artboard

If you’re completely new to Illustrator, an Artboard is the ‘printable’ area. The thing you’re ultimately working on. You can create multiple Artboards. Just click on the Artboard icon in the toolbox or go to File/Document Setup/Edit Artboards.

From there I usually Option-Click and drag an old artboard to make a copy. It also copies all the objects as well. That makes it pretty easy to do basic animation. You can copy the old frame, make changes and so on.

Save As PDF

For me, this is the cool part. I can go from original artwork to animation really quickly because it’s all based on one file. In Illustrator you can save your files as PDF or AI. It makes no difference. So just go to File/Save As and save as a PDF. This means the file you’re working on is the same one you’ll upload, no exports required.

Upload To Ezgif

Finally, I go to Ezgif and use their PDF to GIF convertor. There may be other services to do this, but I use Ezgif. It lets you upload the PDF and then you can check ‘Create animated GIF’. You can set a delay time for every frame, or change the delay one by one. You can also crossfade between the frames.

Then it outputs an animated GIF, which you can optimize or resize if you want.

And that’s basically it. I just thought I’d share because it’s the best way I’ve found to make animated GIFs. This lets me use my preferred tool to make my preferred image format — animated GIFs.