Blog Post

Discover
1 MIN READ

Storyline: Simple Motion Graphics Template

AllisonLaMotte's avatar
AllisonLaMotte
Staff
7 years ago

Whether you’re an e-learning newbie or a seasoned expert, it can be hard to come up with new ideas to catch your learners’ attention. Videos with motion graphics like this one are really clever, but I’ve always felt too intimidated to try and recreate that effect in my e-learning courses … until now! With some simple shapes and animations in Storyline, I was able to create a simple yet eye-catching introduction for an e-learning course.

See this project in action.

I tried to keep this Storyline* template as generic as possible so it’d be easy for you to pop in your own content and hit the ground running.

If you like the fonts I’ve used here, you can download them for free:

Enjoy!

P.S. If you’re looking for a more complex example of motion graphics created in Storyline, check out this impressive demo by community member Ian Monk.

*This template will work for folks using Storyline 360 (included in Articulate 360). Want to try it out? Get a free trial of Articulate 360.

Published 7 years ago
Version 1.0
Download
storyline 360
Template
Visual Design
  • MichaelCatta446's avatar
    MichaelCatta446
    Community Member
    7 years ago
    Thanks Allison,

    I really appreciate examples like this. As a newbie, I'm always wondering 'how was that created'? Examples like this allow me to break each component down and practice the process logically and methodically, thus enhancing my skill set. A big thank you for sharing and, as previous comments have stated, for doing the hard work.
  • LisaPeppers's avatar
    LisaPeppers
    Community Member
    7 years ago
    Hello there, for some reason I am only able to download this in Storyline 3, not 360. Can you assist me with this? Thank you!
    • AllisonLaMotte's avatar
      AllisonLaMotte
      Staff
      7 years ago
      Hi Lisa!
      What exactly happens when you try to open this with Storyline 360?
      • LisaPeppers's avatar
        LisaPeppers
        Community Member
        7 years ago
        Hello there Allison!
        Thank you so much for responding to my comment.
        I get the following message when I try to open the motion graphics in 360. "This project uses features that are not available in this version of Storyline. Please upgrade to the latest version in order to open this project." An "OK" button appears and when I click it, nothing happens.
  • EricBryant's avatar
    EricBryant
    Community Member
    7 years ago
    Thanks, very nice! I have a related-but-more-general question. When using text animations, is there a general rule of thumb on how long the text should stay on each slide before exiting? I understand that it would depend on how much text is on the slide (and that less is better), but just curious if you (or anyone) has any guidelines they use?
    • PeteBrown1's avatar
      PeteBrown1
      Community Member
      7 years ago
      Hi @Eric

      I'm not sure if a reliable metric exists as a guideline to answer your question. Even if it does I'm not sure I'd take too much notice of it; there are potentially too many variables that are likely to impact it.

      If it were me, I'd be inclined to put myself in my audience's shoes and consider things like, word count, message complexity/density/familiarity, audience education/literacy skill, concurrent on-screen audio (music, narration, volume), concurrent on-screen activity/animation whiz-bangery, likely physical environment distractions, overall presentation duration (attention may flag over time), is this an isolated presentation or is it in the middle of a longer session...

      After objectively considering stuff like that and wearing your audience persona, I think a realistic number will present itself - should certainly get you close enough for the pilot testers to not be too grumpy!

      PeteB
      • AllisonLaMotte's avatar
        AllisonLaMotte
        Staff
        7 years ago
        I'm not sure if any specific guidelines exist, it's basically trial and error for me. I put a duration that I think will be long enough, and then preview it. When I preview it, I try to read the text and see if I have enough time. Since I'm also the person that wrote it, I tack on an extra second or so since I may be reading it faster because I know what it says.

        I also send my course to someone else and try to get their feedback about whether or not it's on the screen long enough (or for too long!).

        I wish there was an easy answer to this question, but there really is no magic formula.
    • JenniferPohl's avatar
      JenniferPohl
      Community Member
      7 years ago
      I heard once that you should allow roughly 3 seconds per sentence, as a general guideline... but of course that does not take into consideration any of the wonderful things Pete Brown mentioned. And, like Allison mentioned, I always preview it first and send to others to test out as well.
  • joannekasten's avatar
    joannekasten
    Community Member
    7 years ago
    Hi Allison,
    I was just starting my search for some good examples of motion graphics when I found yours and absolutely love it. It's perfect....except we are still using S2 and I cannot download your template. We have initiated the request for 360 (YAYYYYY!!!!) but it'll be awhile before we get it. Is there anyway you can re-save the template to be available for earlier versions? Or...add a player with controls to pause and refresh, so I can play just that part again. I can figure out the triggers in S2 to mimic, it would just be so much easier to have your template or be able to pause and review.
    • AllisonLaMotte's avatar
      AllisonLaMotte
      Staff
      7 years ago
      Hi Joanne! I'm so glad you like my template. It's too bad you don't have Storyline 360 yet! Unfortunately there's no way to just re-save the template so that it works for Storyline 2, I would have to rebuild it from the ground up.

      FYI I used mostly enter and exit animations, with a couple fade, zoom in/out animations (on the End slide), and a path animation thrown in there (on Slide 1).

      Here's a version of it with the progress bar so you can pause it: https://360.articulate.com/review/content/13e70110-13be-48ca-a163-bd496812f8da/review

      Hope that helps make it easier for you to rebuild it in Storyline 2! :) When you're done if you feel like sharing, I'm sure there are other Storyline 2 users who would be super grateful.
  • joannekasten's avatar
    joannekasten
    Community Member
    7 years ago
    Allison, thank you for the link, it helps. I love that circle arrow at the end. Can I do that in S2?
      • RachelHorton-8b's avatar
        RachelHorton-8b
        Community Member
        7 years ago
        Hi Allison. I'm trying to figure out how you built the last slide. You said you used the circle arrow from the Content Library but I see there are 5 Freeform objects. I am not understanding how this is built. Can you enlighten me. Thanks!