Skip to content

VIDEO: How to Develop a Customised Progress Bar

As I recently promised, I’ve put together a short video to show how to develop a customised progress bar. It’s pretty easy with Articulate’s Storyline 2.

progress bar demo
Click Play below to see the demo. It’s got the progress meter that the how-to video talks about.

Launch Presentation

What’s in the progress bar video?

The video below shows you how to:

  1. Create the different states for the bar
  2. Create the variables you’ll need to make it work
  3. Set the triggers to make it all happen.

There it is. Whether you want to call it a progress meter, a bar or a cocktail lounge, its all about states, variables and triggers. Simples!

Free download!

If you’d like to see how this was built, download the source file below (Storyline 2 file):

Published inStoryline 2Tips


  1. Joel MacDonald Joel MacDonald

    Very nice. Thanks for sharing. How did you create the effect on the question boxes? So you answer the first one correctly and then you see the lock change from locked to unlocked and then there’s some sort of animation effect I guess as the solid colour disappears and the next question appears. I would love to know how that’s done.

    • Hey Joel, thanks for your feedback! I have added a download link so you can look at the source file, but essentially, the lock animation happens on the next slide/question, so:
      Answer question 1, get feedback, and when you land on the next slide, question 2:
      – There is a ‘locked’ lock that appears at the beginning of the timeline, and ends at 1.5 sec with a wheel exit animation.
      – At 1.5 seconds, a second ‘unlocked’ lock appears with a wheel entrance animation, and disappear a couple of seconds later with a random bars animation.
      So, it’s just two objects placed at strategic points on the timeline.

Leave a Reply

Your email address will not be published. Required fields are marked *