> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: wix-animations-frontend



## Article: Introduction

## Article Link: https://dev.wix.com/docs/velo/velo-only-apis/wix-animations-frontend/introduction.md

## Article Content:

# Introduction
Animation sequences are composed using a timeline. A timeline defines what animations
 are played on which page elements and when those animations are played.

 ### Typical Animation Process

 The following outlines the typical process of creating and playing an animation 
 timeline:

 + Create a new timeline using the [`timeline()`](#timeline) function.
 + Add animation attributes and sequence them within the timeline using the
   [`add()`](wix-animations-frontend.TimeLine.html#add) function.
 + Control the playing of the timeline using the
   [`play()`](wix-animations-frontend.TimeLine.html#play),
   [`reverse()`](wix-animations-frontend.TimeLine.html#reverse),
   [`pause()`](wix-animations-frontend.TimeLine.html#pause), and
   [`replay()`](wix-animations-frontend.TimeLine.html#replay) functions.

 Get hands-on experience with Animations on our [Hello Animations](https://dev.wix.com/docs/coding-examples/getting-started/hello-world/hello-animations.md) example page. 

 To use the Animations API, import `wixAnimationsFrontend` from the `wix-animations-frontend` module:

   ```javascript
   import wixAnimationsFrontend from 'wix-animations-frontend';
   ```