The ScrollTrigger has several options to configure although the default settings is usually enough for on scroll animation below the fold.
If you want to animate the element on the scroll that is already in viewport, tweak the values of the Scroller start/end positions.
A rule of thumb is to have the Start position above the element you want to animate and End above the Start position.
If the "Display Scroller Markers" option is enabled, you will see visual markers on the page showing you the position of your start and end Scroller.
Let's take a look at specific settings of ScrollTrigger.
Lock to scrollbar
Create a nice scrubbing parallax effect by enabling this option. It will basically moves the animation's playhead as you scroll up and down the page.
Make sure to have the Live mode enabled to see the preview in the builder, however you can preview the scrubbing animation using the player as well.
You can also add the delay, which softens the scrubbing animation by a given amount of time. It's like the Ease-out effect that happens when you stop scrolling, so the animation doesn't pause instantly.
Toggle Actions
This option is not visible if "Lock to scrollbar" is enabled, as these two options naturally do not play together.
Here you can set the behavior of your animation when triggered.
Animation Start / End
This section is set as a good starting point, and in many cases, you can leave it as is.
But if you want to change the triggering points of your elements, you can do it here.
Scroller Start/End
After you have your Animation Start/End set, you can check Scroller Start/End.
The animation will get triggered once the Start position of the Scroller meets the Start position of the Element and ends when the Scroller End meets the Animation End position.
Other lessons:
Lesson 1: Getting started with motion.page
Lesson 2: How to use motion.page to create your first animation