Skip to main content

​
Overview

Animate blocks apply a delay, duration, and easing curve to multiple actions at once. Animate blocks help choreograph multi-action interactions without changing each action’s animation settings individually.

​
Anatomy of an Animate Block

Animate blocks have two sections: Animate and On Complete. Each has its own set of actions. Animate Block Actions on the Animate section will animate according to the settings on the Animate block. Actions on the On Complete section will fire immediately when the animation finishes (after the delay time + duration time). These actions will not animate according to the settings on the Animate block.

​
Animate Properties

​
Delay

The number of seconds between the trigger firing and the action(s) beginning.

​
Duration

The number of seconds the action will take to complete.

​
Easing

Choose the action’s easing curve: Default, Linear, Ease In, Ease Out, Ease In & Out, Spring, and Custom (write your easing curve using the Expression Editor).

​
Resources

Projects:

Learn Interactions 2.0