I want to make my lottie animation smooth

Hi everyone,
Does anyone know how I can make my Lottie animation more smooth, when the page is previewed it stutters and does now play smoothly, is this just my computer? is there any way around this issue?
I’m wondering if there could be a way to load the page before the animation plays.
Many thanks!


Here is my public share link: LINK

Hi there…

It looks like you are using png images in your lottie - try to do it vector only - and judging by the image you can pretty easily… also, when you making the comp in AE set the comp to 60fps - it should help with the smoothness

as for loading the page first, just put a delay on the animation (using the webflow interactions) so it loads after “x” amount of time or “after page load”

1 Like

I have exported the animation as vectors at 60fps, and the interaction is set to play on page load. However, the animation is not running smoothly yet, it skips a few frames before playing smoothly.

can you upload your animation json to lottiefiles and provide a link – I will have a look and see if there is anything else I can suggest…

Sorry @IVG i provided the wrong link:

it seems to run smoothly on here.

it does… try previewing the published site in incognito mode, different browsers and different machine - try to isolate where the problem occurs…

I have tried using incognito and safari and it doesn’t seem to work, safari is even worse :confused:
I have tried using a delay at the start of the animation, still no luck.
Does anyone have any other ideas?

I had the same issue, and I was importing my objects from illustrator

I had to convert all the layers to After effects shape layers in order to be able to make it a lot lighter…
Mine was better in chrome… but I think that it has to be great in every browser…

if you don’t know how to do that follow this simple tutorial:

tutorial link:

https://helpx.adobe.com/pt/after-effects/how-to/convert-illustrator-layers-to-shape-layers.html