July 1, 2021 : Gif Making In Adobe

Over the years, I’ve created plenty of animated gif’s for various clients… and maybe a few for personal enjoyment. However, it wasn’t until recently that I did some research on the various ways of making a Gif in Adobe.

I’m working on long-term project, creating 3-second looped gifs of various icons. Below is a collection of some of the first drafts (click on the image to view the gif in all its glorious motion):

There are over a hundred that need to get done, and I have maybe fifteen. I try to crank one out every week or two… did I mention it’s a long-term project?

In the past, my process of creating a Gif was:

  1. Create the animation in After Effects
  2. Render out an mp4 (via Encoder)
  3. Import the mp4 into Photoshop
  4. Export the mp4 as a Gif

I recently found out Encoder renders Gif’s directly. While this reduced the steps, there were issues with the final render. Below is a version using this process:

Obviously the color bleeding/ artifacting was unacceptable. As such, I reverted back to the Photoshop Export. For good measure, I adjusted some of the export settings (most notably increasing the Dither to 100%). Below is the end result:

Chef’s Kiss! This project not only verified the necessary pipeline for creating an acceptable Gif in Adobe, but it forced me to dive deeper in Photoshop’s Gif export Settings… something I hadn’t done before. It’s not often I get a chance to dig into the nuts and bolts of Adobe so this was a fun (and worthwhile) exercise.

posted by Pi Visuals at 11:11 pm

Tags:  ,  , 
comments powered by Disqus