Animated GIFs have made a big comeback in the past few years. Chances are most of you have come across them in your personal life; but in case you haven’t, an animated GIF is an image file that acts like a short video that loops endlessly. Most people use them much like they do emojis, to express emotions via text message or social media. But have you ever thought of using them in your e-learning? They’re super eye-catching, which makes them a great way to capture and hold your learners’ attention.

Better yet, GIFs are super-easy to incorporate into your Rise 360 courses! Anywhere you can insert images in Rise 360 you can insert animated GIFs and it just works.

But if you don’t have a motion designer on hand, you may be wondering how you can create your own GIFs without a lot of time and effort. Good news! With Storyline 360, making your own animated GIFs is easy. All you have to do is follow these four simple steps.

1. Create an Animation in Storyline

Any animation that you create in Storyline can be converted to a GIF. But before you GIF-ify all your animations, think about whether it makes sense. Would turning this animation into a GIF help engage learners or distract them? Would it help them better understand the material or simply serve as visual bling? It’s important that the GIFs support your learning objectives, not take away from them.

For the purposes of this tutorial, I made a simple animation of a watering can pouring water onto a plant that could be used in a course on gardening.

To create this example I inserted some Content Library illustrations, added motion paths to the water droplets, and timed the arrival of the objects on my timeline.

For more information on how to insert motion paths and work with the timeline, check out these articles:

2. Publish Your Project to Video

Once your animation is complete, select the Video tab from the Publish window and click Publish.

Note that, by default, Storyline will publish your entire project to video. If you only want to publish a single scene or slide, simply click on the Entire Project link and select the scene or slide in question in the pop-up window.

3. Convert to GIF

Finally, upload your video to one of the many free online video-to-GIF converters. The one I’ve been using lately is called EZGif.

On EZGif, you simply upload your video, select the frames you want to include, and click Convert to GIF!

From there you can download your GIF and use it however you’d like!

And you’re done! It’s as easy as that.

More Resources

Now that you know how to create your own animated GIFs, you may be wondering how to use them in meaningful ways in your e-learning courses. Well, you’re in luck! There’s an article for that: 5 Ways to Use Animated GIFs in Your E-Learning.

Strapped for time? We’ve got you. Here are a bunch of beautiful GIFs you can download for free:

And if you’re looking for other visual design tricks to help catch and keep your learners’ attention, check out these articles:

Remember to follow us on Twitter and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. And if you have any questions, feel free to share them in the comments section below!

Felix Franke
Michael Marks
Mary Montgomery
Natalie A

Hi Everyone, I was watching the Creating Gif Animation webinar, and I am interested in placing a GIF I made in Storyline in my Rise project. I want to place my GIF towards the top of the page like by the title or a heading, but I do not see this option, and I do not see an option to change the size of my GIF. In the webinar, the presenter says how to add the GIF to the Rise project, but does not give the steps or demonstrate, does anyone know how to do this in Rise? I am not asking how to add the GIF to the Rise project as an interaction block, I am able to add the GIF as an interaction block. I am looking for the steps of how to add the GIF to the title or the heading of my project. If you are watching the webinar the question I have is at the 43:00minute mark: https://trainin... Expand

Felix Franke