Articulate® Custom Quizzes – Not just for QuizMaker – Yes! Storyline!

Image of Storyline Quiz with Custom Feedback

Storyline Quiz with Custom Feedback

It has, once again, been forever since I’ve posted. I was inspired by this August 20th Word of Mouth Blog post by Mike Taylor: The Secret to Stunning Custom Quizzes: Slide View

Customizing quizzes is, of course, a great idea. Mike’s post and the linked examples encompass Articulate® Quizmaker® quizzes. They looked like they were also doable in Articulate® Storyline®, and I decided to give this one, Growth Chart, a try. And then I thought, why not share it?

So, here’s what I did. Beware, there are a LOT of steps here. I tried to capture many of them with screen shots. If you’re really interested in customizing quizzes and quiz feedback in Articulate® Storyline®, this could be for you. Otherwise, maybe not so much!

Oh, and here’s a demo: And a link to the Storyline file: Not sure how long it will be out there — but it’s there at the moment (September 4, 2013).

Create the Chart

The Chart

Image of PowerPoint hart

First, I created the chart in Microsoft® Powerpoint®. The image above shows what it looked like.


Import the Chart

import from new slide

Next, the chart was imported. It can be imported either into a new file, as shown in the screenshot above, by starting Storyline and then selecting Import PowerPoint from the startup screen

or –

– into an existing file while working in Storyline, as shown in the image below. This is done by 1) indicating that you want to create a new slide, 2) selecting Import, and 3) clicking PowerPoint.importnew


Set up the Slide

The goal is to set this up as a multiple choice quiz, where Learners will answer the question by choosing the correct month on the chart.


First, I inserted a text box at the bottom of the slide, providing instructions for the Learner, as seen above.


Insert and Name the Option Buttons

Slide image with option buttons

Looking at the image above, you can see what I did next.

  • I inserted option buttons over the data points on the chart. Option buttons, sometimes called radio buttons, are inserted by selecting the Insert tab, clicking the Button drop-down on the Interactive Objects groups, and choosing one of the Radio Buttons.
    These option buttons will become the multiple choice buttons.
  • It’s always a good idea to name items on the timeline. I used the names of the months that correspond to where the option buttons fall on the timeline.


Create Custom Feedback Master

Mike’s example had custom feedback, so I decided to do the same for my quiz.

feedback master

  • The image above illustrates what my next steps were:
  • Accessed the Feedback Master by selecting the View tab and clicking the Feedback Master button.
  • Duplicated the original master, by right-clicking on the master and selecting Duplicate Slide Master from the shortcut menu.
  • Preserved the original master by again right-clicking and selecting Preserve Master. I did this because I didn’t want to lose the original master. Don’t forget, there could be other quizzes in a project that wouldn’t work with this custom design.


Modify Custom Feedback Master

image of custom master described in contentNow it was time to modify the new Custom Master. First I clicked on this master to make it active, as seen above.

I knew the custom response placeholder rectangle was going to be in my way, as was the horizontal line, so I selected these and moved them offstage – that is, off the slide. Then I closed the Feedback Master.


Create the Quiz

To convert this into a multiple choice-type quiz, I clicked the Insert tab and then the Convert to Freeform button, and I double-clicked on the Pick One question type.

Image of Pick One dialog box

I selected the 6 choices in the Pick One dialog box, and indicated that March is the correct choice.


Customize the Correct and Incorrect Feedback

Remember, I’d decided that the correct and incorrect responses would be custom responses, rather than the default feedback. This next section describes the customizations I made to the Correct and Incorrect feedback layers.

For Both Correct & Incorrect Feedback Layers – Choose Design

Image showing selection of custom feedback master

In each of the layers, I right-clicked on the slide, and from the shortcut menu selected the custom design, as illustrated by the orangey shade in the image above.


For  Both Correct & Incorrect Feedback Layers – Customization

Image of changes to layers as described in content

Look at the screenshot above and note the modifications for both the correct and incorrect layers.


  • Default feedback text for the layer is hidden.
  • The instructional text box on the base layer is hidden

Slide Layer

  • Although it’s difficult to tell from this screen shot, the continue button has been moved down lower than its default position.
  • My plan, when the layers displayed, was to have a “selected option button” appear on the correct choice: March. I needed to simulate this, so I created a “fake” option button by grouping 2 shapes from the Insert shapes pane. I used a donut shape and an oval to create a button that looks like the Pick One button style I’m using for the quiz. I sized it so that it’s a bit larger than the default buttons.
  • Next, I placed the button over the position for the March option button on both layers.


For the Correct Feedback Layer

Image of customization to Correct Layer as described in content

As you see above, for custom feedback, I inserted a text box that says, “Yes, the greatest amount of growth occurred in March.” This text box and the “fake” option button are animated to fade in.

Animations are set by clicking on an object, then clicking the Animations tab, and choosing the desired animation and speed.


For the Incorrect Feedback Layer

Image of incorrect layer as described in contentThere are 5 potentially incorrect answers, so, I created 5 corresponding feedback textboxes. Because their initial states are set to hidden, they are difficult to see in this screenshot, so I’ve placed numbers close to each one to make it easier for you to see in this blog post (these numbers are not part of the quiz). For example, the number 1 is below the “You chose January” feedback.

Setting an object’s state to hidden is done by clicking the object, then selecting the States tab, and changing the initial state to hidden.

The text boxes are animated to fade in when triggered. For example, the trigger for the feedback if the Learner selects January is:

– Change the state of the “You chose January” text box on the incorrect layer to normal
– WHEN the timeline starts
– IF the January option button on the Pick One (base layer)
– is equal to selected

For information on triggers, check out this E-Learning Heroes tutorial: Working with States, Triggers, and Layers.

Note the additional feedback text box that fades in and says: “Actually, the greatest amount of growth occurred in March.”


One More Note on the Incorrect Layer

Screen shot of modifications to the incorrect layer as described in the content

This time, I’ve set the animation for the “fake” option button to grow. This provides a visual cue to Learners, making it easier to distinguish between their incorrect response and the correct one.

I’ve set both the “fake” button and the feedback on the timeline to occur at 1.25 seconds.

Finally, I’ve placed the continue button at 3 seconds on the timeline and set its animation as a Fade in.

Like I said, there’s a LOT to do. I hope to create a screencast to go along with this at some point. In the meantime, hope y’all find this helpful.

Warning: count(): Parameter must be an array or an object that implements Countable in /nfs/c09/h02/mnt/138262/domains/ on line 405

2 thoughts on “Articulate® Custom Quizzes – Not just for QuizMaker – Yes! Storyline!

  1. Mike Taylor

    This is fantastic Becky! Thanks for sharing it. I’m glad the sun came out for you before vacation was over…sounds like a productive AND fun time! 🙂


Leave a Reply

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