search

airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
30.34k stars 2.87k forks source link

BODYMOVIN animation is jittery/skipping frames #2588

Open Dardanber95 opened 3 years ago

Dardanber95 commented 3 years ago

Hi there,

I am doing a logo animation in for WEBFLOW in AE. I used BODYMOVIN for export. The animation is jittery and it's skipping frames on the browser. I am using track matte to mask, which is supported by bodymovin (at least that is what I read). For the animation itself I used keyframes since wiggle and other native effects are not supported by bodymovin. Also, I used 60fps.

Here's the screen video. https://drive.google.com/file/d/1xBKYmo8De7jLTqToeY-lOivBvUKSoHz1/view?usp=sharing

any suggestions? @bodymovin?

bodymovin commented 3 years ago

hi, is the animation exported as a PNG sequence? Have you tried profiling it with the dev tools?

Dardanber95 commented 3 years ago

Hi there, The animation is an svg. In dev tools the path is also just jumping from one state to another. I already tried different methods of masking. Also, I didn't use effets like Wiggle which are native to AE, but rather used keyframes.

From: hernan @.> Reply to: airbnb/lottie-web @.> Date: Monday, 19 July 2021 at 00:44 To: airbnb/lottie-web @.> Cc: Dardan Berisha @.>, Author @.***> Subject: Re: [airbnb/lottie-web] BODYMOVIN animation is jittery/skipping frames (#2588)

hi, is the animation exported as a PNG sequence? Have you tried profiling it with the dev tools?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/airbnb/lottie-web/issues/2588#issuecomment-882126331, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ASO32UCLK25U5PQVGRJ7E6LTYNKLXANCNFSM5ARBOPDA.