Overview
When using full-screen panels in your GAC story, you can add two new animation styles - a "pan and zoom" animation which slowly animates across your image, and a "3D depth" animation which uses ML to detect the relative depths of the objects in the image and animates the detected layers. Examples of these animation styles are below:
| Example of the depth animation |
Example of the pan and zoom animation |
This article provides step-by-step instructions on how to enable these animations for your story, or you can watch our how-to video here:
How to enable animations in the GAC Story Editor
Getting Started
Animations are available when using Full Screen story components. Once you have added your image to the full-screen panel component in the story editor, you will see the button to enable animation for that panel in the toolbar:
Clicking on this button opens the animation configuration menu, with no animation enabled:
In this panel, you can select and configure either the Pan and zoom animation or the Depth Animation.
Configuring the Pan and zoom animation
The "Pan and zoom" animation moves between a starting and ending point in your image in a loop. When you select this option, we set the default to move across the image (for landscapes we pan from left to right, portraits top to bottom).
You can also modify the default to select your preferred starting and ending position. Just click the pencil icon next to the position you want to update. Pan and zoom to the preferred new position, then click the "Set position" button:
You can preview the animation in a new window by clicking the "Preview" button. After you have configured the animation to your preference, click the "Save" button.
Configuring Depth Animation
The depth animation uses a Machine Learning model to infer the relative depth of objects in your asset, and then we use this information to animate the perceived layers at different intensities. Given this, not every item in your collection may be suitable for depth animation.
To get started with Depth Animation, select the option from the animation panel:
When depth animation is first selected for an asset, you will see a sign that the preview is generating. It may take around one minute to generate a preview the first time for any given asset.
You can select the intensity of the animation for your asset, with higher intensity meaning that the distance of animation between the foreground and background will be higher. After the preview has been generated you can easily toggle between different intensities and re-preview the results to choose the best option for your asset.
Once you have enabled your preferred depth animation settings, you can click save to enable the animation for that panel.
Reverting an animation
In the main story editor view, you will be able to see which full screen panels have animation enabled in the upper left hand side below the toolbar:
If you no longer wish a panel to be animated, you can press the animation button in the toolbar to open the animation panel, and click no animation:
Press save and the animation will no longer be active on the panel.