How to create Animation Effects

There are 3 default types of animation:

1. Animation Effects: The effects in this section can be applied to all widgets and can be triggered by most Triggers (e.g. Page visible, Scroll position, Click, Toggle, Rollover, etc.).
2. Scroll-driven Animation: The animation effects in this section are triggered when the user scrolls to the element where the action is applied. The animations continue to run as you scroll and stop when you stop scrolling.
3. Text Animation effects: The effects in this section can be applied only to the text block widget and can be triggered by most Triggers (e.g. Page visible, Click, Toggle, Rollover, etc.). Unlike Animation Effects, Text Animation Effects have more detailed settings that can be applied to both words and lines.

Animation Effects: here you can choose and apply the desired animation style.

To open the Adjustment menu, simply double-click the selected animation effect or hover over the effect and click the gear icon on the right side.

Animation effects. Adjustment.

Direction: This attribute controls the direction of the animation, if applicable.

Easing: This attribute controls the smoothness of the animation and the style of that smoothness.

Duration: This attribute allows you to control the speed of animation.

Delay: This attribute allows you to postpone the start of the animation.

Repeat: This attribute controls the number of times the animation repeats.

Scroll-driven Animation

To enable the Scroll-driven Animation section, select 'Scroll' as the trigger for the action.

Text Animation Effects

Here you can choose and apply the desired text animation style.

The main difference between Animation Effects and Text Animation Effects is that Animation Effects apply to the entire widget, while Text Animation Effects apply specifically to the text within your text block widget. This allows for more detailed adjustment of the animation.

Text Animation Effects. Adjustment.

Direction: This attribute controls the direction of the animation, if applicable.

Apply To: This attribute allows you to select what exactly will be affected by the animation - line, word, or letter. For example, if you select the ‘word’ option for the Fade In animation effect, the text block will appear word by word.

Order: This attribute controls the direction in which the animation is executed.

Easing: This attribute controls the smoothness of the animation and the style of that smoothness.

Duration: This attribute allows you to control the speed of animation.

Delay: This attribute allows you to postpone the start of the animation.