Adding animations and transitions

This video shows you how to add animations and transitions to your website. We will first select the component that triggers the animation. We can make the animation event trigger whenever a component enters the visible field of the browser and we can also make it replay whenever the user scrolls out and back again.

Then we'll head to the transform part and add the variable we want to transform. The first value is the end-point of the animation. Then we'll additionally add a variant for the variable (in this case the Rotate X variable that we by default want to be at 0 degrees). In the animation variant we define the starting point of the animation.

We'll also add a scale (ie. zoom bubble) effect to the button, whenever it is scrolled into view.