Problem with lottie scroll animation

Design help Animations & Interactions
1

Hey,

I am new to webflow and I have created my first page here: https://trooperbrowser.webflow.io

Now the reason I chose webflow was to use the lottie scroll animation to show how our product works. In the fourth section I have a 4 step process that explains this. In the column on the right hand side, there is a lottie file that is made sticky.
This lottie file should animate as the user scrolls on the website.

So my desired result is:

  1. User scrolls untill the animation is in view.
  2. When animation is 100% in view, the animation starts.
  3. The animation goes based on the scroll of the user. But this needs to go smooth and that is where I have my issue.
  4. When the animation starts to get out of view, the animation should be done.

Now I can’t figure out how I can configure this lottie scroll animation so that it moves according to the scroll of the user…

Here you have my current configuration:

image
image235×640 20.2 KB

image
image238×901 14.8 KB

Please can someone help me? You would be my lifesaver!

Anton