Authors

Video Tutorials

AI Assistant: Using AI Prompts to Create JavaScript Entrance Animations

E-learning authors know that entrance animations can transform a static course into a more dynamic learning experience. However, turning that creative vision into reality can sometimes be challenging.

That’s where the new AI JavaScript Entrance Animations feature in Storyline 360 comes in. Simply chat with AI Assistant to describe the animation you want. It converts your plain words into code—and even generates the required trigger automatically.

The following tips and examples go beyond the basics to help you make the most of this AI-powered feature, offering creative ideas and practical techniques to bring your courses to life. Read on to get inspired.

Begin With Simple Prompts

With AI Assistant, you don’t need to know how to code to create eye-catching entrance animations. Just describe your goal in plain language. Something as simple as “Make this object appear slowly,” will tell AI Assistant to create a fade-in effect for your slide object. You can also try instructions like “Make this shape slide in from the left” or “Make this image swivel” to see how different wording produces different results.

Once you’re happy with your basic animation, you can keep the conversation going to refine it. For example, you might say, “Make it faster,” “Add a slight delay,” or “Loop this animation.” AI Assistant builds on your earlier instructions, allowing you to chain prompts together naturally—no need to start over each time.

This conversational approach makes it easy to experiment and refine your animations until they move exactly how you imagined. Start simple, build step by step, and let AI Assistant handle the technical details while you focus on the creative side.

Fine-Tune Object Properties

You can reference the basic properties of slide objects in your prompts to control how animations behave. The table below lists common object properties along with examples to help you describe the effects you want and guide AI Assistant in generating the right animation.

Object propertiesEffectsExample usage in prompts
Motion and timingEasing
  • “Ease in” (Starts slow and accelerates.)
  • “Ease out” (Starts fast and slows down at the end)
  • “Ease in and out” (Starts and ends slow, with faster motion in the middle)
  • “Elastic” (Like a rubber band)
  • “Linear” (No speed change)
 Looping
  • “Loop infinitely”
  • “Loop forever”
  • “Take animation off the timeline“
 Speed
  • “Slow the animation down”
  • “Slow the animation down 2x”
  • “Speed the animation up so it takes 2 seconds total”
 Staggered
  • “Fade in sequentially”
  • “Fade in one after another”
Position and movement3D
  • “Spin the object in 3D”
  • “Spin the object in 3D with perspective”
  • “Add a 3D tilt”
 Distance
  • “Move rectangle to the right by 200px” (Ask AI Assistant what the slide size is to get an idea of how many pixels to specify.)
 Position
  • “Move to the left/right”
  • “Move to the center of the slide”
  • “Move to the bottom of the slide”
 Scale
  • “Scale 200%”
  • “Shrink 50%”
  • “Increase size 3x” (300%)
Visual and styleBlur
  • “Blur in”
 Hue
  • “Add a hue rotation” (Creates random color effects)
 Opacity
  • “Fade in”
  • “Fade out”
  • “Animate the opacity from 1 to 0.5” (Note that 0 is completely transparent, and 1 or 100% is completely opaque.)

Build Multi-step Animations (Video Examples)

Want to see what’s possible? The videos below demonstrate how to add motion, depth, and visual energy to your projects. From timeline sequences to looping motion and mask reveals, these examples show the creative range you can achieve with AI JavaScript Entrance Animations.

Timeline Sequences

In the video below (no sound), observe how entrance and exit animations work together in a seamless flow. Fades, transforms, and staggered timing add rhythm and polish to this coordinated sequence.

Sequential Animation

The example video below (no sound) seamlessly connects multiple effects—spins, pulses, and blurs—to create motions that evolve throughout the slide, resulting in a smooth, narrative flow.

Off-Timeline Motion Loops

The video below (no sound) shows continuous, looping motion that occurs outside the timeline. Soft oscillations and color shifts create gentle, persistent movement that enriches the mood.

Mask Reveals

Watch the video below (no sound) to see imagery revealed through masking, creating a smooth, layered effect. When paired with staggered entrances and follow-up transitions, it creates a visual, story-like moment.

Spark Your Creativity

If your slide is densely packed with objects and you're unsure what to move, fade, or highlight, ask AI Assistant for ideas. For example, ask AI Assistant which objects to animate, how to simplify the motion, or what animation styles might work best together. Sometimes a quick prompt like “What’s a good way to animate this slide?” is all it takes to get things going.

In the video below (no sound), you’ll see AI Assistant in action, offering smart suggestions to improve a busy slide. Notice how it analyzes objects and suggests organizing animations to make a cleaner, more intentional slide without losing creativity.

Updated 18 hours ago
Version 2.0