# Adding Animations

Flex uses Greensock.js as the underlying system for animations.

Animations can be created in the animation studio in the Settings section of Flex.

# Animation Studio

Animation Studio

Animations are run top to bottom and execute various effects

Effect: What the animation actually does, such as "Move up 10 px"
Duration: How long the animation takes
Delay: How long before the animation fires. This will be triggered by the event the animation is attached to.
Ease: The path your animation takes to get to the end point. Imagine the effect "Move up 10px" as walking 10 steps forwards. Technically, you can reach your end point while going zig zag, waving around, or reaching 10 steps and then stepping back, and then forwards again. All would end at the same location.

Animations are implemented in the "action" section of the Flex Event system.

Animation Select