LottieFiles pros, do any of you have experience with converting json to gif but with transparent background? For example let’s say I have an animated circle (with no fill) #000000 and I set the background to #ffffff00 using the Lottie to gif function, it looks fine in preview but when I download the gif, the background is transparent but the animated circle that was once black is also now transparent. This doesn’t happen with any other background color. If I used #ffffff the gif generates fine with black circle and white background. I’ve tried this with many different animations, they all fail in the same way with transparent background.
Have any of you experienced this (or is it just me). Any thoughts on how to resolve?
Please as anyone found a solution to this issue?
I find it impossible to convert json file to gif and have a transparent background
Kindly help please!!
The best option is to export your animation from After Effects with a transparent background either as a Movie file with Alpha Channel or a PNG sequence with transparency turned on. Then import into Photoshop and export a GIF with transparency.
You can also try to add the sequence to the Media Encoder out of After Effects and see if it’ll let you do a transparent BG for the Animated Gif Export.
@koluwafisayomi@amberharris786
The tricks in this article could help you.
However, please take note that your animation may be degraded in quality because the amount of colours GIF support is lesser than a Lottie hence the quality may drop and sometimes it won’t even look the same depending on the complexity of the Lottie animation.
Easy Process.
Download JSON data>import using bodymovin in after effect> Export it using GIFGUN scripts.
Use GifGun to export GIF animation. Transparent or with the background. You can add a number of color shades like 256, 120, 60, etc.
you can download it as JSON then upload it to this link https://lottiefiles.com/lottie-to-gif/convert to convert to GIF then reduce the transparent of the background color like the blue circle in the picture
