Adding Animations to an Experience

knlowledgeart

Adding Animations to an Experience

Adding animations to an Experience is one of the easiest ways to make your content come to life. But choosing the right animation can be a bit of an art. Which is why we’ve included 61 different entry, exit and attention seeking animations for you to choose from.

To add an animation, simply select the object you want to animate, navigate to the animations panel in your inspector window, select whether it will be triggered On View or On Hide, select the animation action, and set a delay and duration. To take an even deeper dive on animations, be sure to check out our Designer Lesson on Animating Your Content.

Animations-2-gif

Note: You can apply up to three different animations to the same object.

Definitions

  • On View: This will trigger the animation when the folder or object comes into view.
  • On Hide: This animation will only fire when that folder or object is hidden.
  • Delay Optional: Animations will only be triggered when the object is visible on the screen. By applying a delay you are saying, when the object is on screen, delay animation by x seconds. A delay of 0 will automatically trigger the animation.
  • Duration: The length of time, in seconds, the animation will take to complete. Durations can be as little as .1 and have no upwards limit.
  • Repeat: After the animation completes, you can choose to repeat the entire animation (delay and duration) again. This is great for attention seeking animations.
  • After Previous Effect Completes Optional: This allows you to add an additional animation to play after the previous animation. You can add up to three separate animations to the same object.
  • Repeat Entire Animation Sequence Optional: This selection allows you to repeat the combination of 2 or 3 different animations in sequence.
  • Replay When Scrolled Onto Screen Optional: This selection allows the animation(s) to be triggered again if it is scrolled off of the screen.

Below is an experience with a preview of every animation available in the studio. Just remember, you can create a ton of customized effects by combining two or three animations in sequence! If you would like to add this experience to your Studio, click here.