How can you export a gif with a transparent background?

[melissab54230122]

I'm trying to export a gif with a transparent background, but the gif always has a black background even if there's none in the composition.

[imeilfx · Accepted solution]

GIF is a graphic file not video/movie file and AE is not the best tool to export that but if you wish to do that straight from AE - you have to use script called GifGun.
I you don't wanna spend money on that - you have to:
- export your animation to image sequence with alpha channel
- open that in PS
- export to GIF by going to File/Export/Save for web

But you have to remember that GIF don't have actually real alpha as f.eg. png. As for small in size animated stuff with alpha - you can try to experiment with animated webp format.

[Ibtessam ul Hasan]

Well this is strange! photoshop can do the job but after effects or Media encoder can not !

[ellies8376963]

Hi,

I have tried this method but once I go to export my GIF from photoshop I get an error message :  'Adobe save  for web error: Could not complete this action. An uknown error has occurred'

I have read on other forums to reduce the image size but this still does not work.

[Rick Gerard]

If I need an animated gif from an After Effects comp I do the following:

1. Set the comp frame rate to 8, 12, or 15 - there is no need for any higher frame rate in an animated gif
2. Set the comp frame size to an even number of pixels high and wide because Gif's work better that way
3. Make sure that are no duplicate frames in the animation (see details below)
4. Add the comp to the Render Queue and choose the Lossless With Alpha preset in the Output Module settings
5. Render the file and open it in Photoshop
6. In Photoshop, adjust the duration of any frames that I want to last longer than one frame (read the explanation)
7. Use the Photoshop File menu to export an animated gif for the web using the Legacy option

That's it. 

Let me talk about the no duplicate frames. Inside Photoshop you can set any frame for an animated gif to any duration. You can have that frame last for 30 seconds if you like. There is never any need for duplicate frames in an animated gif. Let's say you are designing an animated banner for a website. The banner starts with a static image. Fifteen seconds layer there is a 10 frame transition to the next frame and it holds for 15 seconds, then there is another 10 frame transition to the next frame, then that frame (image) holds for another 15 seconds, then the third transition for 10 frames to the final frame before the last transition back to the first frame.  The total length of the banner is 45 seconds plus 4 * 15 frame transitions. 

The way I would set up the comp is to start the first 15 frame transition on frame 1, finish it on frame 16, then start the next transition on frame 18 and finish it on frame 33, then start the next transition of frame 35 and finish it on frame 50, then start the last transition on frame 52 and finish it by ending on the first layer at frame 67. 

The entire comp is 67 frames long, with only 0 frames that are not animated every 15 frames. When you open the rendered movie in Photoshop you go to frame 1 and set the duration to 15 seconds, then move to frame 17 and set the duration to 15 seconds, and so on. You have reduced the frame count from 960 frames to 67 and reduced the file size by about 90%. You can't do that with Gif Gun. 

If your animated gif has constant motion, just reduce the comp frame rate and use Gif Gun, but I still prefer the render to lossless with alpha/open in Photoshop/Export using Legacy for the web workflow because you have complete control over the compression and the frame duration.

[Yashkovskiy]

We've created a free script for exporting GIFs from AE and it support transparent background as well. Download and learn more at https://aejuice.com/blog/how-to-make-a-gif-in-after-effects/?utm_source=adobe_comment

[VioletMystery]

I just used this - cut a ton of time out of gif making for streamer alerts and frames and so much more!  Thanks!

[asd21ewads]

You're very welcome! Glad you're enjoying it 🙂