Blog Post

E-Learning Challenges
2 MIN READ

Using Motion Graphics in E-Learning #418

DavidAnderson's avatar
3 years ago

Using Motion Graphics in E-Learning #418: Challenge | Recap

If you're looking for ways to quickly capture learners' attention, explain complex concepts, or promote your e-learning skills and portfolio, motion graphics might be the way to go.

Motion graphics combine text, shapes, images, and other visual elements to tell a story or convey a feeling or mood. They're frequently used in films, commercials, websites, social media, and e-learning courses.

Some common use cases for motion graphics in presentation and e-learning design include:

  • Course intros and title sequences: Use motion graphics to add a visual appeal and capture the audience's attention at the beginning of presentations.
  • Slide transitions: Use animations and motion graphics to transition smoothly into your course's main content. 
  • Branding and identity: Use animated title sequences to bring life to your organization's logo, colors, and branding elements.
  • Data visualization: Use motion graphics to guide the learner's focus to present complex information that's easy to digest and understand.
  • Setting the tone: Depending on your subject matter, you can use different visual styles, colors, and animation techniques to set the mood or tone of your course.

Here’s a great example of what’s possible using motion path animations in Storyline 360 from Ian Monk.

Challenge of the Week

This week, your challenge is to create a demo to show how course designers can use motion graphics in e-learning.

Resources

Here are a few more examples and articles to help you get started working with advanced motion path animations:

Share Your E-Learning Work

  • Comments: Use the comments section below to link your published example and blog post.
  • Forums: Start a new thread and share a link to your published example.
  • Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure.
  • Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness.

Last Week’s Challenge:

To help set your creative wheels in motion, check out the accessibility makeover examples your fellow challengers shared over the past week:

Accessibility Makeovers in E-Learning #417: Challenge | Recap

New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

Learn more about the challenges in this Q&A post and why and how to participate in this helpful article

Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback:  https://bit.ly/ElearningChallengeForm.

Published 3 years ago
Version 1.0

140 Comments

    • RachelHarris's avatar
      RachelHarris
      Community Member
      Hi,

      I'm new to storyline and have been trying to make something like your animated intro for a while and cant seem to get my foam to appear that it is coming out of the hose it always comes flying in from off screen.

      What animation did you use to achieve this effect? Thank you in advance :)
      • SyedAmjad-Ali's avatar
        SyedAmjad-Ali
        Community Member
        Hi Rachel,

        We applied an Arc motion path animation for the sun and the moon. After the item finishes its animation, we have changed the state of the sky, building, and heading text to a different colour (night version or day light version).

        An action is given as follows: After the animation is complete, the other items animation starts, so it works in a loop.

        Thanks
    • Yvonne's avatar
      Yvonne
      Community Member
      Appreciate seeing three different course introduction media types. Thank you for sharing. :)
  • Hello!

    When David thanked me for not reimagining his avatar again during last week's challenge, I took that as my unofficial challenge for this week.

    HOLEY ANIMATED INTROS!
    https://bit.ly/elhc418

    No download this week, as I've used motion graphics throughout the demo to explain how it's made.

    See you next week.
    Same Bat-time!
    Same Bat-channel!
    • JackieMatuza's avatar
      JackieMatuza
      Community Member
      Thank you Jonathan, such helpful tips within the design!
    • Ange's avatar
      Ange
      Community Member
      Great, nice tutorial too - thank you
    • Yvonne's avatar
      Yvonne
      Community Member
      Thank you for taking the time to integrate your "how to" explanations within the demo itself. :)