How to Transform a Course with Timing and Animations

Have you ever taken an e-learning course where things didn’t flow smoothly? Perhaps items just randomly popped onto the screen or text disappeared before you had time to read it, or maybe there were just too many objects on the screen at once, leaving you unsure of where to look. These are all issues you can improve or even fix altogether by adjusting the timing and animations in your Storyline 360 courses. 

Adjusting Animation Timing

To adjust the timing in Storyline 360, simply move objects on the timeline panel. To add animations, which include entrance and exit animations, motion paths, and transitions, simply select an object, slide, or layer and apply the desired effect from the animation or transition tab. These steps are easy to do—but often overlooked by busy course designers. 

And what a big pay-off you'll have by taking these few steps. Take a look at how these simple timing tweaks and animations can transform an e-learning course.

View Demo

The version without animations feels quick and choppy: there’s a lot of text on those slides and it's not clear where to look first when a new slide comes up.  The version with animations and transitions flows a lot more smoothly: the on-screen objects appear in a more digestible manner, which makes it easy for a learner to absorb the content.

As you can see, controlling the order and duration of objects impacts the learning experience. Instead of dumping all of your content on your learner at once for them to sort, take control of the learning experience by specifying the order in which objects appear. Create some visual hierarchy for them by presenting content in a logical way: heading, subheading, body text, for instance.

Another reason for using animations is to create a smoother learner experience. Without animations, slide objects just appear on-screen suddenly, which can feel jarring. Applying some subtle animations makes the content appear in a more controlled and fluid fashion for a better visual experience.

Take a look at the following example to see how the same slide looks without any timing adjustments or animations, then with timing adjustments only, and finally with both. Notice how much smoother it is when timing and animations are added?

View Demo

Ready to go for it and use animations in your next project? That's awesome, but here are a few more simple tips and reminders for using animations effectively.

Be Consistent

Don’t mix and match too many types of animations. Choose one or two and use those types consistently throughout your project. If you’re using a “fade” transition on your slides, then do so consistently. Don’t do a fade, then a grow, then an uncover, in any random order. It’s neither cohesive nor professional. But you can jazz up the same type of animation by having it enter from different sides of the slide if you really want to add some diversity.

You should also be consistent about which animations you apply to what objects, as well as the duration of the animations. And remember to use the animation painter to quickly duplicate an animation effect from one object to another to save yourself development time once you’ve got your animation working just perfectly on an object.

Don’t Overdo It

Remember to use animations sparingly and carefully. You don’t want to overwhelm your learner with on-screen movement, so don’t get carried away. And while it can be fun to get a bit wild and use the grow and spin animation types, remember that the type of animations you use should work with your content and audience. If you’re building a serious accounting course for professionals who are taking an exam, using the bounce and swivel options might not complement your course.

My go-to animation favorites are fly in and fade in. I also love the fade as a go-to transition. And don’t forget that you can apply transitions not only to your slide but to each slide layer.

Group Objects

If you have multiple items that you want to have come in at the same time, consider grouping the objects and applying one animation to the group instead of applying an animation to each individual object. Remember to have the group itself selected when you apply the animation, and not an object within the group, or things can get a bit confusing.

Adjust Your Options for “When Revisiting”

If you’re adjusting the timing and animations for your slides, you ought to consider how the slide looks when a learner revisits it. Do you want to make the learner sit through the animations and content one object at a time again? Personally, I don’t like to make the learner sit through all of the animations and timing of the content a second time since they’ve already been through it once and are likely going back to review or clarify some previous information and just want to go through quickly. Luckily, you can easily adjust this option for slides and layers. Simply pop into the slide or layer properties window and adjust the option under the “When Revisiting” drop-down menu. It will be set to “Automatically Decide” by default, but you can change it to either “Reset to initial state” or “Resume saved state.” Select the latter if you don’t want to make learners sit through all the animations again.

Those are just a few of my top tips for working with timing and animations in Storyline. Do you have any tips or tricks of your own for working with the timeline, animations, or transitions? If so, please leave a comment below to share your thoughts.

Follow us on Twitter and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning.