📤 Import & Export

Connect the web page and import your created animations via menu Site > Import. This enables you to quickly preview and iterate over created animations.

You can export your animations by clicking on the copy or save button. The animation data is exported as .json and can be loaded with the web player.

Animation groups are grouped by a container element (as shown above). You can assign multiple groups to a single container.

To embed the animation on your web page you'll need the web player to be included.

The Spirit web player is an open-source Javascript library (~10KB gzipped) which you can use to play the exported animations on your web page.

Play animation from clipboard data:

spirit.loadAnimation({
  animationData: {...} // copy & paste from Spirit Studio
});

Play animation from url:

spirit.loadAnimation({
  path: './animation.json'
});

More on using the web player.