iosafter-effectslottiebodymovin

Lottie animation has missing parts in iOS but works perfectly in html and Android


I've made an animation of a ship with a moving flag and waves in After Effects and exported it to JSON using Bodymovin. I used the wave warp effect for the flag and the waves but since Lottie doesn't support that effect I fixed it using auto-trace and now the animation works as expected when in HTML. Problem is, I need it to work on iOS but the red part of the flag and the little waves are missing from the animation when run on iOS. I even tried running it in an Android app and everything works there too. Has anyone ever encountered something like this before?

I've attached the picture that I want to animate, the file structure and also, the JSON file.

Here is the animation that I want to achieve Here is the file structure of my AE project


Solution

  • In my case, my file was just simply too big due to the auto-tracing.