Assets Library & Saving Animations As New Elements

In this tutorial, you will learn how to save animated components from one project and reuse them in another while keeping all keyframes and timing intact.

Step 1 - Save The Animated Components

Select the parent group containing all the animated elements on your canvas. Right-click and choose Save to Library, or use the Properties panel and click on Save to Library. The element is now saved with all its animations intact and can be reused in future projects. It will appear in the Uploads section of your library.

Step 2 - Open Another Project And Refresh The Library

Switch to the new project and open the library panel. Hit Refresh to load the saved animation from before. Move the playhead to 0 seconds, preparing the canvas for the animation insertion.

Step 3 - Add The Saved Animation To The Canvas

Click on the saved animation in the library to add it to your canvas. The animation’s keyframes will start from the current position of the playhead. From here, adjust the animation’s position, scale, or other properties to fit the new project’s layout.

Step 4 - Lock Unnecessary Groups To Simplify The Timeline

Switch to the Elements tab and lock groups that are not part of the new animation. This hides their keyframes from the timeline and provides a clearer view of the shapes animation just added.

Step 5 - Adjust The Timing To Match Existing Animations

Play the animation and compare it with other elements on the timeline. Extend the last keyframes of the added shapes animation to 4 seconds, and move the intermediary keyframes to 2 seconds. This ensures the new animation stays in sync with existing animations.

Step 6 - Review And Finalize The Animation

Play back the scene to confirm timing and alignment. Make any further adjustments needed to the position, scale, or keyframes. Once synced, the animation is ready for use across projects.