How to download animated png as lottie
Copy link to clipboard
Copied
Hi,
To make a twinkling star effect, I added a CC particle World effect to a solid layer over a png image.
I'm trying to upload my animated image as a lottie in Webflow. The animation works fine in After Effects, but when I upload it to Webflow it's only a solid color, no image. Does anyone know why this is happening? I'm using the Bodymovin extension.
Copy link to clipboard
Copied
Deleted per user request... Moderator
Copy link to clipboard
Copied
Also, I'm new to After Effects and followed this Youtube tutorial: https://www.youtube.com/watch?v=S_kx93-ucWE
Copy link to clipboard
Copied
After Effects makes video, it does not export Lottie files directly. You need a 3rd party plugin: https://lottiefiles.com/plugins/after-effects
There are severe limitations when you use AE to create graphics for the web. AE is not the most efficient tool for that kind of work.
Read all the documentation, and you may have some success. You probably cannot export clean code-based files from Particle World because those particles are pixels, not vector art.
Copy link to clipboard
Copied
As Rick already pointed out, Bodymovin/ Lottie is meant to export vector and animation data as SVGs or HTML canvas, not pixel data. It might be useful if you read the help on the plug-in and on a broader level also educated yourself about web techniques. Most of what you are trying to do here just makes no sense.
Mylenium
Copy link to clipboard
Copied
I figured it out.
After I created the animation and lowered the duration, I chose add to render queue under composition and outputted to mp4, rendered, and then uploaded the mp4 to Adobe Media Encoder as a png sequence, started the que (the green play icon), uploaded all sequences to After Effects, updated the still duration to 0;00;00;01 and checked sequence layers. I then used the Bodymovin extension where I compressed and included in json under assets, and rendered. Once the json is exported you can add it as a Lottie file.
Copy link to clipboard
Copied
Also, can someone delete my screenshots, please?
Copy link to clipboard
Copied
And my download too.
Copy link to clipboard
Copied
Looks like a forum moderator already took care of it.