Jeanette's Blog

Using a Simple Storyline Number Variable to Show Learners How Many Objects They've Found

Jeanette Brooks — Fri, 04 Jan 2013 14:32:00 GMT

I love Storyline variables. Which might come as a surprise if you know me, because I am SO not a programmer! But that's the cool thing about Storyline—variables and other concepts that used to feel way above my head are now actually really easy and <gasp> fun if you use Storyline. Even cooler is the fact that variables can be great tools for making a course more interactive and responsive to your learners.

Check out the example below. It's a simple demo that was shared in a forum conversation with fellow community member Anne England. Anne wanted to create a seek-and-find interaction in which a visible counter shows learners how many correct objects they've found so far. Storyline variables to the rescue! By using a number variable and just a few simple triggers, you can easily create a tally to keep track of how many items the learner has clicked.

Want to learn more? Take a five-minute tour of how to build the interaction:

And if you'd like to take a look at the source project, you can download the .story file here.

How are you using Storyline variables in your projects? Head over to the Storyline forum and share your tips, tricks, and samples with the rest of the community! Or, if you have a project where you think variables might be useful but you're not sure how to incorporate them, post your questions in the Storyline forum and let the community help you out!

Hiding a Base-Layer Object from Appearing on Other Slide Layers in Articulate Storyline

Jeanette Brooks — Tue, 02 Oct 2012 17:14:00 GMT

Articulate Storyline's triggers and slide layers make it crazy-simple to build explorable content—like tabs interactions—in just minutes. Often, as folks experiment with creating interactive slides, they ask: "My triggers and layers are working great... but what if I have a few things on my slide's base layer that I'd rather not show when learners view a different layer? Is there a way to hide those items?"

A common example is this: say you've added some introductory info, or a "click the tabs" callout, on a slide's base layer. While these objects can be really helpful when learners first arrive at the slide, you might not want the objects to stay visible once learners start clicking the slide to reveal different layers of your interaction.

The solution: on any slide layer, just turn off the visibility of whichever base-layer objects you want to hide. Here's how:

A Color Diagram to Help You Customize Your Storyline Player Colors

Jeanette Brooks — Wed, 06 Jun 2012 15:38:00 GMT

It's amazing how much flexibility Storyline gives you when it comes to customizing your course's player! Not only can you choose exactly which player features you include, but you also have total control over every item's color.

We've got a handy tutorial that walks through the steps for changing the colors on your player, but since there are so many items you can customize, we thought it would also be helpful to give you a quick-reference diagram. That way, when you need to change the color of a certain player element, you can quickly find the parameter that controls it.

You can click the picture below to view or print the PDF, and you can also find it in the downloads area. Oh, and the colors in the diagram are purposely kind of loud and high-contrast, just to make it easier to see what's what. Happy customizing!

A Simple (and Free!) Set of Tabs Interactions for Your Articulate Storyline Projects

Jeanette Brooks — Thu, 17 May 2012 13:36:00 GMT

Creating a tab-style interaction in Articulate Storyline is a quick and easy way to make your content more explorable. By combining the power of slide layers with simple triggers, you can transform static content into a click-and-reveal interaction in just a couple minutes! And the best part is, the entire interaction is contained on a single slide, which you can easily reuse and customize in other projects.

Click the demo below to see an example of what a simple tabs interaction could look like:

To make it super easy to build your own, here’s a free template that contains a whole collection of ready-made tab sets. You can use them for whatever you like. Just choose the tab set you want to use, then add your own content to each tab and layer. And if you want to customize the look of the interaction with your own background, that’s simple too. Here’s a quick look at how:

Want to learn how to build a tabs interaction of your own? Here’s an overview of how I built the one in the example above:

To dig deeper into some of the features mentioned in the screencasts above, you might also like to explore the tutorials on States, Triggers, Slide Layers, and Button Sets.

Have fun building your interactions, and feel free to share your work in the Storyline forum!

3 Paths in 1 Quiz: Possible? Yes!

Jeanette Brooks — Thu, 01 Mar 2012 13:29:00 GMT

An Articulate user asked us a great question recently. She wanted to build an Articulate Quizmaker ‘09 quiz consisting of three paths, with each path containing a different group of scenario-related questions. Rather than make all of her learners complete all the questions, she wanted to let each learner choose just one of the paths at the beginning of the quiz.

Is it possible? Definitely! All it takes is some simple branching techniques in Quizmaker, and an unscored survey question at the beginning. Here’s how you can do it:

First: create your questions and organize them into groups

Although it’s not mandatory, separating your questions into groups makes it much easier to visually organize them when you're creating your content. By default, whenever you start a new quiz it contains a single question group, and all your questions end up there. But you can easily add more groups and reorganize your questions to be in whichever groups you want.

Start by clicking the Question Group button:

Quizmaker adds a new group header to your question list. Double-click the group name if you want to change it to something more intuitive. You’re the only one who will see the name—it won’t appear to learners—so you can call it anything you like.

Now create your questions, and drag each one into the appropriate group. You can also rearrange the order of the question groups themselves if you want—just click and drag the group header to a different place in the question list, and any questions in that group will travel together.

In the example below, I’ve created three question groups and placed two questions in each group:

Second: insert an unscored question at the beginning so learners can choose their path

Once your questions are arranged into groups, you can create one more question group at the beginning to contain a single “gateway” question. This is just an unscored question that lets learners choose which question group they’ll complete. You can use a survey question in Quizmaker—since survey questions don't have a point value, the question won’t impact the learner’s score. Here’s what to do:

Third: apply branching

Finally, you’ll need to add some branching. There are a couple places you’ll want to do this:

On the survey question at the beginning, you’ll add branching on each of the three choices, so that learners jump to the right questions, based on their choice.
After the final question in both the 1st and 2nd question groups, you’ll add branching that takes the learner to the end of the quiz. (You don’t have to do this for the final question group, since that one’s already at the end of the quiz.)

Here’s a quick look at how to set up the branching:

That’s all there is to it! If you choose to include a result slide at the end, the score that appears there is based on only the questions the learner answered (not the entire lot of questions in the quiz). So in my example below, even though my quiz actually contains six graded questions worth 10 points apiece, the learner’s score is based on just the two questions (20 points) that comprise the question group they complete. And if you include a Review Quiz button on your result slide, during the quiz review your learners will only see the questions they answered (not the questions that were part of the other question groups).

Below is a sample of the published quiz, and you can also download the source file if you’d like to deconstruct.

View the published sample | Download the quiz

7 Easy Ways to Emphasize Important Text or Key Words in Articulate Presenter

Jeanette Brooks — Wed, 21 Dec 2011 14:22:00 GMT

Recently I saw an interesting question in the forums here at E-Learning Heroes. An Articulate user was looking for a way to emphasize key words, because her slides contained a lot of text to go with her narration.

Now, we all know what the right answer is here, right? Of course! Reduce the amount of text on each slide, so that learners don’t need so much help to focus on the main points or key words.

And that's totally valid advice! Unfortunately, though, there are times when course creators might not have the permission or flexibility to re-work slide content — especially if they’re updating an existing course, and stakeholders aren't willing to invest time and resources in new slide designs or the approval of re-worded text.

In those cases, simple techniques that call attention to crucial words or phrases can be an easy way to improve the learner’s experience without doing a total overhaul.

There are lots of interesting ways to emphasize text, but if you're looking for something super-quick and easy, below are seven techniques to try, with short tutorials that show how to create and apply each one. For the techniques that involve using PowerPoint animations, you can use Presenter’s Sync Animations tool to make the effects appear at just the right time with your audio narration. You can download a sample of these techniques right here.

Want to share your own ideas for text emphasis? Post a comment at the end of this article, or join the forum conversation here!

And if you'd like to explore some even snazzier ways to dress up key words and phrases in your course, here are some additional ideas from folks in the Articulate community:

Giving Learners a Way to Write & Print Their Key Takeaways from Your E-Learning Course

Jeanette Brooks — Fri, 04 Nov 2011 12:24:00 GMT

One of the things I love about the Articulate tools is that they’re flexible enough to do some out-of-the-box things. For example, most people think of Quizmaker '09 as just a quizzing & assessment tool. But in a recent forum discussion, Quizmaker popped up as a solution for giving learners a chance to reflect on & print their key takeaways from an e-learning course.

If you’re looking for a way to do this, check out the following quick example of an end-of-course reflection question:

View demo of an end-of course reflection question

Basically, the Quizmaker portion of the sample is just a simple one-slide “quiz” that contains an Essay question. The result slide at the end of the quiz is used as a thank-you message and as a place to provide a Print button, so learners can print out what they wrote.

How to build it

It’s pretty easy to build something like this. If you’d like to use the sample above as a starting point, you can download the Articulate package right here. Or, if you’d like to build something similar from scratch, here’s how you can do it:

Launch Quizmaker, click Create a new quiz, and choose Survey. This creates a new file that contains just one result slide (rather than a separate result slide for passing and failing) and no scoring info on the result slide or the quiz player.
Add a Survey Question and choose the Essay question type.
For the Survey Result, make sure to mark Allow user to review quiz and Allow user to print results.
Now customize the question and the result slide to look however you want. It’s a great idea to switch to Slide View for this step, because that gives you a lot of control over the visual design of your slide.
You can also customize your quiz player to suit your fancy. In the published sample I posted above, I changed some of the text labels because I wanted the Submit button to say “Save my answer” instead. I also changed the text of the Review, Print, and Finish button, and I removed the question navigation panel because it really wasn’t necessary. As a final step, I made my quiz player transparent because I wanted my PowerPoint slide master to show through behind it when I added it to my course.
Now add your quiz to your course, and you’re all set!

When learners get to the quiz you designed, they'll be able to type their reflections in the Essay question. On the result slide, they can click the Print button to open an HTML page containing the text they wrote. From there, they can use their browser's Print option to print the output.

Modifying the look of the report

An optional step is to customize the way the printable report looks. By default, Quizmaker's Print Results feature (which relies on a file in your published output called report.html) includes a lot of details, some of them related to scoring and whether the learner's answers are “correct” or “incorrect.” In my demo above, though, I didn’t need or want all that — I really only wanted to show the text of the question and the answer that the learner entered. So, I followed Dave Moxon’s instructions for modifying the report.html file. I only made a few simple modifications, and you can download my customized report.html here if you'd like to use it. If you know some HTML, you could certainly customize the look of the file even further.

Note: If you modify your report.html, keep in mind that you’ll need to copy it into your published output each time you publish, since previous files get overwritten whenever you republish your course. You’ll want to save a copy of your modified report.html somewhere along with your other source files, so that you can easily copy it over to your published output if you publish your course again.

Quizmaker '09 Tip: Adding Images to Your Matching Drag-and-Drop Questions

Jeanette Brooks — Thu, 21 Jul 2011 13:24:00 GMT

Matching drag-and-drop questions in Quizmaker ‘09 are an easy way to make your content more interactive. With this question type, you present a fixed list of items on the left, and draggable choices on the right. Learners drag and drop the choices, to form what they think are the best matching pairs.

But what about if you want to incorporate images in the question instead of just text? You can do that by leveraging the Slide View of Quizmaker’s question editor. Here’s a walk-through of how to do it:

In Quizmaker, click Graded Question and choose Matching Drag and Drop for the question type.
When the Form View of the question editor appears, enter your question text, and then enter your choices and matches. The text you enter in the Choice column won’t be seen by your learners (they’ll see an image instead) — so whatever you put there is really just for your own reference.
Click Slide View.
Choose Insert>Picture and insert the pictures you want to use in place of the items listed in the left-hand column. In my example in the screencast above, I used images of three different musical instruments.
If you like, resize the bounding box of the drag-and-drop items so that the draggable items on the right are a width that looks nice with your text.
Now position each of your images on top of the appropriate items in the left-hand column, so that the images cover up the text.
If there’s too much of the puzzle-piece-shapes showing behind the images, you can use the Insert>Shape tool to draw a shape that covers up the parts that you don’t want to be visible.

Using Quizmaker '09 to Build Magazine-Style Assessments

Jeanette Brooks — Thu, 19 May 2011 13:43:00 GMT

Every so often I talk with a Quizmaker user who wants to create what some folks call a “magazine-style” assessment. You know the kind — it’s the type of quiz that guides people through a series of questions and then, based on their score, tells them what category or type they fall into.

Contrary to the quizzes you might see in actual magazines on your supermarket checkout racks, these sorts of assessments don’t have to be tacky or cheesey. If they’re well-designed, the assessments can be a great way to create engagement and interactivity in your course. Personality-type quizzes are common examples, and so are quizzes that have titles like “Find Out Your Risk Level for…" (Heart Disease, Identity Theft, Investment Loss, Sun Damage, or some other thing).

So, how do you build a magazine-style assessment in Quizmaker ‘09? At first, it might seem challenging because currently, the results that learners see at the end of a quiz are based on just two outcomes: pass or fail (rather than on specific scoring brackets). But all it takes is some consistency in the way you craft your questions, and a little creativity with the Slide View of the results slide, to help learners interpret their scores based on whatever scoring categories you choose.

Here’s a walk-through of how to do it:

To sum up, these are some things I'd recommend:

Be consistent with questions and scoring. When you craft your questions, use the same question type throughout, and use the same scoring rationale on each question. For example, in my sample quiz above, I give the learner just two response choices per question — if the learner picks the response that suggests a more visual learning style, I give them 6 points. If they pick the other response, I give them zero points. You can use this same approach if you prefer multiple-choice questions rather than true/false. You'll want to Score By Answer and assign a staggered point value to the possible responses. For example, if I were to allow 3 choices per question, I’d score them incrementally, like maybe 0 points, 3 points, and 6 points.
Turn off question feedback. Since I didn't want the learner to feel there's a specific right or wrong answer to each question, I eliminated the pop-up question feedback that normally appears after the user submits each answer. You can do this by setting the Feedback selector on each question to None. Or, you could achieve a similar experience for your learners by changing your quiz player template’s navigation to Submit All At Once, since question feedback isn’t used with that navigation method.
Remove scoring info from the player. I didn't want any scoring info (such as the possible points on each question, or the points earned so far) to appear on my quiz player, so I removed all that. Brian Batt has a good tutorial about how to do it, and you can find it here.
Make the result slide look less “quizzy.” On the Pass Result and Fail Result, I removed all references to “passing” or “failing” the quiz, and I even removed the score percentage. I also made both the Pass Result and the Fail Result slides look identical, since I didn't want learners to feel this is a test that they’ve passed or failed. It’s really more about showing them their score and giving them a way to interpret what that score means. Which brings us to the final point…
Include an intuitive key on the result slide. You want to make it easy for learners to see what their score means. An easy way to do this is by including a scoring bracket on the result slide. If you open the Pass Result or Fail Result slide and switch to Slide View, you can design your slide to include whatever information you like. In my example, I added a simple key which shows three scoring brackets and a brief description of what each one means. This way, learners can compare their score with the key to find out which category they fall into.

Why Hotspot Questions are Hot (and 10 Examples of Ways to Use Them)

Jeanette Brooks — Thu, 28 Apr 2011 13:23:00 GMT

I really like hotspot questions in Quizmaker ‘09, because they open up all sorts of unique ways to involve and engage learners.

Here’s how they work: you present learners with an image, and in order to answer a quiz question, learners need to mark a place on that image. There are no visible clues unless you build them into the image itself — the learner has to know which part of the picture to select, without relying on suggested answers or other guidance.

I love this, because that’s how stuff works in real life! A machine operator needs to know which controls to use on the control panel. A dental student needs to recognize tooth decay on an x-ray. A copy editor needs to be able to find a typo in a block of text.

Since learners constantly need to absorb and apply visual data to make decisions on the job, why not use hotspot questions to provide them with the same experience?

The other neat thing about hotspot questions is that they require learners to slow down and do some serious processing and discernment — often to a greater degree than if they were answering a more conventional question, such as a typical multiple-choice or true/false. And that act of processing and discerning is where the real magic happens! It not only helps us to better assess whether learners truly know their stuff, it also helps the learners to actively practice and reinforce what they’ve learned.

In case you haven’t experimented with hotspot questions yet, below is a quick run-through of how to set one up. It’s super easy. You just type your question, choose an image, and then tell Quizmaker where the hotspot is:

10 Examples for You to Check Out

If you’re looking for some ideas for ways to use hotspot questions, here's a demo of 10 sample questions to get your wheels turning. You can click the quiz below to see the published quiz. You can also download the Quizmaker file here if you’d like to deconstruct or adapt some of the ideas for your own quizzes.

View the demo | Download the source file

Even More Cool Examples

For even more cool ways of using hotspots, check out these additional links:

This blog post by Dave Moxon.combines hotspot questions with video for a creative approach to assessments.
Here’s another neat hotspot example — in this Quizmaker quiz from Tutor2u, learners use cash-flow data to answer a whole series of hotspot questions.
And if you’re looking for a way to allow users to select one of several hotspots on an image, you might also like this creative solution from Articulate user Tracy Parish.

How Are You Using Hotspot Questions?

Have you found some other interesting ways to leverage hotspot questions in Quizmaker ‘09? Feel free to share your ideas by adding a comment to this blog post — or, better yet, share your screenshots or links by posting in the Building Better Courses forum!

Creating a Click-to-Zoom Effect in Your E-Learning Course

Jeanette Brooks — Thu, 14 Apr 2011 12:03:00 GMT

In an earlier post, we looked at how to create a clickable pop-up effect in courses you build with Articulate Presenter '09. Did you know you can use a similar trick to create a clickable zoom effect?

All you need to do is create a duplicate slide with the enlarged image, and then add clickable areas to your slide, using PowerPoint hyperlinks. You can then use the Slide Properties in Articulate Presenter to control how learners interact with the zoom slide.

Here’s a screencast of the process, but if you prefer to follow written steps, I’ve included those below too:

Add a slide that contains your regular-sized image. Then create a duplicate of that slide, but replace the regular-sized image with an enlarged one.
On the regular-sized image, add a PowerPoint hyperlink:
- With the image selected, click Insert > Hyperlink.
- Then choose Place in this document and choose the slide where you’ve added the enlarged image.
Now switch to the slide with the enlarged image. Add an X or the word Close (or something else that tells the learner where to click to return to the original image).
Add a hyperlink on the X or the word Close (or both) so that learners can click on it to close the zoom. Make the hyperlink point to the slide that contains the regular-sized image.
Finally, click Slide Properties on the Articulate menu and make the following tweaks:
- On the slide that contains your enlarged image, right-click the slide and choose Hide in navigation panel. This prevents the zoom slide from appearing in your sidebar.
- Adjust the Branching behavior: On the slides before and after the zoom slide, change the Next and Previous actions, respectively, so that learners skip the zoom slide if they click forward or back on the player controls.
- Click in the Lock column for the zoom slide. This disables the player controls so that learners need to click the Close or X button to return to the regular-sized image.
- For both the slides where you added a hyperlink, change the Advance setting to By User.

Create a Strong First & Last Impression with an Intro or Summary in Engage '09

Jeanette Brooks — Thu, 31 Mar 2011 13:25:00 GMT

You might already know that Articulate Engage '09 gives you the option of including an intro to your interaction — but did you know you can include a summary too? These are both really helpful features, especially if you're using your interaction as standalone e-learning content rather than part of a larger course.

Why include an intro or summary? Because they function kind of like mental bookends, wrapping your content with a clear beginning and end. Here are some other good reasons to consider using intros or summaries:

An introduction can provide helpful setup info for your interaction content, such as an overview of what the learner's about to experience.
If you're using your interaction to build a scenario or knowledge-check, the intro can provide important context about the scenario or challenge that you're presenting to your learners.
An intro can also give learners important instructions or tips about how to explore the content. Check out the sample wording that Debbie Richards recently shared in the forums for all 10 of the standard Engage interactions. Maybe you've got some standard wording of your own that you like to use in your Engage introductions and can share that in the same thread.
A summary can be a great way to give a final call to action after the learner experiences your content.
Summaries are often a great place to provide hyperlinks to external resources that learners can check out if they need more info.

So how do you do it?

When you first start a new Engage interaction, it'll have an intro by default. If you also want to include a summary, you can click the Add Summary button on the toolbar, or tweak your Interaction Properties to turn on the Summary feature. From there, it's just a matter of deciding what your intro or summary should include. Like the other portions of your content, your intro or summary can contain text, hyperlinks, images, movies, or sound. Below is a walk-through of how to add or remove an intro or summary in your interaction. If you prefer to see step-by-step text, you can check out this tutorial.

How are you using intros and summaries in your Engage interactions? If you've got some cool ideas or samples to share, feel free to post in the comments or in the Forums!

New Industrial-Themed Template from Mike Taylor, and Guidelines for Community Submissions

Jeanette Brooks — Fri, 25 Mar 2011 12:13:00 GMT

One of the really powerful things about a community like E-Learning Heroes is that cool stuff often evolves into even more cool stuff.

Case in point: Tom shared a nifty Flip Card template in the E-Learning Heroes downloads area awhile back, and lots of folks have been using it in their e-learning courses. Then Mike Taylor came up with a great spinoff, because he needed something with more of an industrial theme. The result? Mike generously offered to share what he created, so now you have yet another free and useful resource for your e-learning projects.

Below is a published sample of Mike’s design, and you can get the source file for the template here.

View the published Sample | Get the free download

Got Something of Your Own You’d Like to Share with Other E-Learning Heroes?

Everybody loves freebies! So if you’d like to follow Mike’s example and give away something you’ve made (such as a course template, cool graphics, fonts, or any other type of e-learning assets) here on E-Learning Heroes, here are some recommendations:

Share away! You’re welcome to post your resources in the forums anytime you want. Or, post your stuff on your own blog or on Twitter, and then spread the word by pasting the link into a forum thread.

Let us know if you think tons of other e-learning developers would love what you’ve made. Though we can’t guarantee that every submission will get added to the E-Learning Heroes downloads area, we do sometimes feature resources from the community under a Creative Commons share-and-share-alike license. Just drop a message to David or me if you think your resource is a good fit. Chances are greater if your submission is:

Super-practical and easy to use in a broad range of rapid e-learning projects.
Accompanied by a simple Screenr walk-through that tells the world how cool your resource is, and shows examples and simple how-tos for folks who are interested in using it.
Accompanied by a published example of how a designer could use the resource. (Kind of like Mike’s sample above — although you don’t have to provide a complete course; just a few slides would be fine.)

And of course if your work does end up in the Heroes downloads area, we’ll give you total credit for your awesomeness.

Share on!

Dressing Up an E-Learning Course with Variations of Black

Jeanette Brooks — Thu, 10 Mar 2011 12:55:00 GMT

So I’ve been working on a few template ideas, and I’ve found myself gravitating toward designs with lots of black.

I really like black. It’s versatile and classy, and it can add a feel of elegance and sophistication to your course. Kind of like a little black dress, except you never have to worry about whether or not you’ll be able to zip it up.

Pair your black course design with some sharp photos and bright accent colors, and the contrast can cause text and objects to seem almost luminous, like they’re lifting right off the screen.

Some Samples & Downloads

Below are a couple examples I built. These were inspired by some designs I liked at templatemonster.com. If you’re looking for additional inspiration, there are all sorts of other stunning black-themed websites out there that’ll spur some great ideas.

Check out the link below each thumbnail if you’d like to download the layouts and adapt them for your own projects.

View the published sample | Download the template

Want an Articulate Presenter Player to Match?

For a super-sleek look, you can also use tones of black or gray in your Articulate Presenter player. The samples above were published with a player color scheme called Blackest Black (you can get it here and unzip it into the location of your system's color schemes). Or you could try one of the built-in color schemes that come with Articulate Presenter. Several that look nice are with black-themed slides are Black ‘09, Silver ‘09, Slate ‘09, Charcoal, and Gunship Grey. Or of course you could always customize your own player color scheme to include tones of black or the accent colors in your course slides. If you’re not sure how to switch to a different player color scheme or customize your own scheme, check out this tutorial for step-by-step help.

Build a CNN-Style Q&A Interaction with PowerPoint 2010's Blur Tool

Jeanette Brooks — Thu, 03 Mar 2011 14:03:00 GMT

Have you noticed how the CNN website uses blurred images as a design element in some of their posts? Since the new image-formatting features in PowerPoint 2010 include a handy blur tool, it’s pretty easy to create a similar effect in your rapid e-learning courses. And it’s a really nice alternative to traditional bullet-style slides!

So, with inspiration from the CNN folks, below is a published example I cooked up, using PowerPoint 2010 and Articulate Presenter ‘09, with content adapted from heart.org. Following the example is a series of tutorials that show how to build the effect yourself if you have PowerPoint 2010.

You can also download the source files here if you’d like to take a look under the hood and adapt the project for your own courses.

Click to view the example