3 Ways to Create Drag-and-Drops with Storyline 360
Are you looking for a way to make e-learning courses more dynamic and engaging? Look no further than drag-and-drop interactions. Drag-and-drop interactions give your learners the opportunity to make decisions and engage with course content, and can be an excellent learning tool when used appropriately. That begs the question, when should drag-and-drops be used? In my experience, they can really come in handy when you want your learners to: Sort correct and incorrect items (view an example) Order the steps in a process (view an example) Match items (view an example) Place items or objects (view an example) Storyline 360 offers a variety of ways to create drag-and-drop interactions. Let’s have a closer look at three easy techniques. Graded Quiz Slides Storyline 360 offers 11 graded question types, two of which are prebuilt drag-and-drop interactions. The nice thing about Storyline’s graded question slides is that they’re superquick and easy to set up since you don’t have to create a single trigger. All you have to do is select the type of drag-and-drop question you want—matching or sequence?—and insert your content. View a Storyline 360 Matching Drag-and-Drop Quiz Slide View a Storyline 360 Sequence Drag-and-Drop Quiz Slide Matching activities are great when you want learners to make a connection between several items, for example an event and the date it occurred. Sequence is great for having learners identify the order of a process or task. Freeform Freeform slides let you convert any regular slide into a graded drag-and-drop quiz slide in a few clicks. Freeform slides are a really powerful tool because they allow you to completely customize every single aspect of your slide and drag-and-drop interaction. Freeform is perfect when you want to create a drag-and-drop that is not a matching or sequence activity, for example, to sort incorrect and correct items or to match non-text items such as shapes or images. Here are some examples of customized drag-and-drop interactions created using Freeform slides: View a Freeform Gamified Drag-and-Drop View a Freeform Placing Drag-and-Drop Activity To create a freeform drag-and-drop interaction, insert a new slide and click the “Convert to Freeform” button on the “Insert” tab of the Storyline 360 ribbon. Select the drag-and-drop option, then click Insert. Storyline will automatically create a graded drag-and-drop quiz slide, and will even add the “Submit” button and the feedback layers. You will be presented with “Form View,” where you can assign your drag items and your drop targets. Storyline 360’s Drag-and-Drop Freeform Form View When you’re in Form View, you’ll notice that there are options available to you in the ribbon. Options available in Drag-and-Drop Freeform Form View A few things you can do here: shuffle the answers, assign a results slide, and assign the number of attempts learners have. Above all, the one key feature you need to know about is the “Drag & Drop Options” button. Drag & Drop Options Knowing about these options can save you a ton of time and headaches. These options give you flexibility when you’re tweaking your drag-and-drop interaction to work just the way you want it. Need your drag items revealed one at a time? No problem! Do you want to allow multiple items onto one drop target? Just check the box. These options will let you customize your drag-and-drop interaction to behave just the way you want. Triggers There’s one more, little-known, way to create a very simple, ungraded drag-and-drop interaction by using a single trigger. You’ll need at least two objects on your slide to make this work. The “When” drop-down menu in the Trigger Wizard offers two options: These Drag Drop Events are available in the Trigger Wizard By using either of these options in a trigger with two objects from your slide, you can create a very simple drag-and-drop interaction. However, you can’t customize that interaction in any way and it can’t be graded. For that reason, it’s typically recommended to use the freeform drag-and-drop interaction, which is superpowerful, graded, and offers many options for customization. In Sum Creating drag-and-drop interactions with Storyline 360 is intuitive and easy, no matter which method you choose. Go ahead, build your own drag-and-drop interaction so you can see for yourself how quick and easy it is. Let me know how it turns out in the comments below! Want to try something you learned here, but don’t have Articulate 360? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments.Everything You Need to Know About States in Storyline 360
The states feature in Storyline 360 is incredibly powerful. States allow you to alter the appearance of objects based on the learner’s actions. To illustrate this, take a look at the GIF below: See how the formatting of the buttons changes as I hover, and then again when I click on them? And did you notice that once I’ve clicked on the top three buttons, a fourth one appears? These formatting changes are made possible thanks to the states feature in Storyline 360. But this is only the tip of the iceberg when it comes to what’s possible with states. Let’s do a breakdown of this super-powerful feature to help you better understand how you can use states in your courses: Built-In Object States Custom Object States Drag-and-Drop States Character States Built-In Object States When you click on an object, open the States panel and click on the New State icon. You’ll notice that there are already a few built-in states: The great thing about these built-in states is that when you add them to objects in Storyline 360, most of them work automatically—without any triggers. Let’s take a look at how prebuilt states work and how you might want to use them in your courses. Normal This is what your learners see by default if they don’t interact with the object in any way. This state is created automatically when you insert an object. Any formatting that you apply to your object is automatically applied to the Normal state. Here’s a cool pro tip: you can actually add objects to the Normal state instead of adding them to your slide! There are many situations where this technique can be useful. For example, if you’d like to create a custom button by combining several objects, you’ll want to add the secondary objects to the Normal state instead of grouping them, because states can’t be added to a group of objects. To add objects to the Normal state, simply select an object, open the States panel, click on Edit States, select Normal, and insert the objects, as shown in the GIF below: As you can see, adding the icon to the Normal state instead of adding it to the slide itself allows you to interact with both the rectangle and the icon as if they were a single object. From here, you can add whatever other states you’d like! Speaking of, let’s take a look at the next prebuilt state. Hover This is what an object looks like when a learner moves their mouse over it. Adding a Hover state is a great way to signal to learners that an object is clickable. It’s up to you what formatting you apply to an object. Here’s an example of a Hover state that simply changes the fill color to a lighter shade of blue: Down The Down state appears when the learner is actively clicking on an object. This signals to the learner that their action is working. As always, the design of this state is your call. In the example below, the Down state simply changes the fill color to a darker shade of blue: Selected When you’ve added the Selected state to an object, it’ll appear when the learner clicks. If they click on the same object again, it’ll go back to the Normal state (unless they’re part of a Button Set). This state is great for interactions where you want learners to see which objects they’ve selected. Here’s an example of a couple of rectangles to which I’ve added Selected states with glow formatting: If you want to create an interaction where learners are supposed to select a single object from a set of options, you’ll want to use this state in combination with a Button Set, which automatically changes the state of a Selected object to Normal when the learner selects another object in the set, much like how radio buttons work in multiple choice questions. Here’s the same example you see above with a button set applied to the three rectangles: Visited Like the Selected state, the Visited state appears automatically when the learner clicks on an object. However, unlike the Selected state, which turns on and off automatically when learners click on the same object multiple times (unless they’re part of a Button Set), once the Visited state is activated, the only way to turn it off is by adding a trigger. This is because the purpose of the Visited state is to show that an object has been clicked on in the past, not to show that it’s currently selected. The Visited state is super-useful when you create custom menus or click-and-reveal interactions because it allows you to give learners a visual reminder of the buttons they’ve already clicked. Here’s an example of how that works: Disabled The Disabled state allows you to temporarily prevent an object from changing states or activating a trigger when learners interact with it. Unlike the other prebuilt states we’ve seen, you need to add a trigger for this state to work, unless you’ve set it as the initial state for an object. When the Disabled state is activated, nothing will happen when learners try hover, click, or drag that object. The Disabled state is useful in many situations. For example, if you’d like to create a custom menu that requires learners to view the different sections of your course in a certain order rather than allowing them to view the content in the order of their choosing, you can use the Disable state to unlock one button at a time, like in the GIF below: Notice how when I hover over the buttons, nothing happens? The Hover state doesn’t appear and the hand cursor doesn’t appear, making it clear that I can’t click on them. If you’d like to build a menu like this but are short on time, hop on over and download this template. Hidden As you may have guessed, when the Hidden state is activated, the object is invisible. Like the Disabled state, you need to add a trigger to activate this state unless you’ve set it as the initial state for an object. The Hidden state could be useful if you wanted to hide the quiz button until the learner completes all the sections of the course, as shown in the GIF below: Before we move on to Custom Object states, here’s another pro tip for you: if you’re creating states for an image, you can quickly create a series of states for it by bulk-importing image files. Find out how in this tutorial: Inserting Pictures as States. Custom Object States In addition to these prebuilt states, you can create an unlimited number of Custom Object states that can look and work any way you want. Adding a Custom Object state is super-easy! Simply select the object, open the States panel, click Edit States, and type the name of your Custom Object state, as shown in the GIF below: Once you’ve created your Custom Object state, go ahead and format it any way you’d like. Then, add a trigger to that object to show that state whenever you’d like it to appear. There are tons of situations in which it can be useful to create Custom Object states. One example would be to create different versions of the same object that appear as the learner interacts with a slider or a dial, as shown in the GIF below: To create the example above, I inserted a bunch of Custom Object states and changed the height of the rectangles in each one. Check out the screenshot below to get an idea of what my states look like: This is just one example of a situation where you might want to use Custom Object states—there are plenty of others! Let your imagination run wild. Drag-and-Drop States When we were looking at prebuilt states earlier, you may have noticed that at the bottom of that drop-down list there was another category of prebuilt states: the Drag-and-Drop states. As their name suggests, these states were specifically designed to be used with drag-and-drop interactions. They allow you to give the learner visual feedback as they’re interacting with the exercise. There are three Drag-and-Drop states. Let’s take a closer look at each one. Drag Over If you add this state to a draggable object, the learner will see it when an object is dragged over a drop target. If you have multiple drop targets, this state will be applied no matter which one it’s dragged over. Take a look at this GIF to get an idea of what that could look like: Instead of adding this state to a drag item, you could add it to your drop target(s). Here’s what that looks like: No matter which option you choose, the objective is the same: to give the learner a visual cue that they’re dropping the object onto a drop target—without letting them know if their answer is correct or incorrect. Drop Correct and Incorrect States The remaining two states are generally used together. The Drop Correct state is what your learner will see when they drop an object on the correct drop target, and the Drop Incorrect state is what they’ll see if they drop an object on the incorrect drop target. By default, these states won’t appear until the learner clicks on the Submit button, like in the GIF below: This is a great way to let learners know which answers they dragged to the right and wrong spots, instead of simply telling them they didn’t drag them all to the right spot. If you want the Drop Correct or Drop Incorrect state to display right away, simply go to the drag-and-drop options and uncheck the box marked Delay Item Drop States until Interaction Is Submitted, as shown in the GIF below: Once you’ve unchecked that box, your interaction will work as shown below: This option is great for practice exercises, where the score doesn’t matter. Pro tip: Did you notice that in addition to changing the color of the draggable items for the Correct and Incorrect states, I added icons to indicate whether they were correct? It’s a good practice to avoid using color alone to indicate correctness; this enables people who have trouble distinguishing colors or who come from cultures where green and red don’t indicate Correct and Incorrect to be able to understand. Character States Did you know that the illustrated characters in Storyline 360 come with a dozen prebuilt states? Well, now you do! There’s a prebuilt state for each of the 12 facial expressions included with each illustrated character. So if you want your character to suddenly look angry or disappointed, you don’t have to build out those states—they’re already there! All that’s left to do is insert an illustrated character and set up a trigger to change the state. Wrap Up And there you have it—you know everything there is to know about states in Storyline 360! Well, maybe not everything, but pretty close. If you want to dig even deeper, check out these great resources: Adding and Editing States Definition of Built-In States Want to try something you learned here, but don’t have Articulate 360? Start a free 30-day trial. And subscribe to our newsletter to get the latest product updates, e-learning examples, and expert advice directly in your inbox.How to Customize This Storyline 360 Countdown Quiz Game Template
A few weeks ago I decided to createthisStoryline 360gamified quiz template: Click here to view the interactive version and download the template. If you’re curious about my thought process in creating this example, jump over to this article:A Behind-the-Scenes Look at How I Designed This Gamified Quiz. If you’ve downloaded this template and want to adapt it, keep reading! In this article, I’m going to walk you through the top-four FAQs about adapting this template: How do I change the passing score? How do I change the number of questions in each level? How do I change the amount of time in each level? How do I change the number of levels? This template uses Storyline 360 features like question banks, states, variables, trigger conditions, and slide masters. If you’re not comfortable with how those work, you might want to check out the linked tutorials before continuing. Alright, here we go! How do I change the passing score? By default, I’ve set the passing score to 50 percent. However, depending on the project, you may need learners to get a higher percentage of correct answers to pass. Good news: making this update is super easy! Simply open each result slide, click on Edit Result Slide, and change the percent required to pass, as shown in the GIF below: Note that if you update the passing score, you might decide you also want to update the scores required to earn one, two, or three stars. See the next section of this article to learn how to do that. How do I change the number of questions in each level? By default, each question bank in this template includes 20 questions. If you want to increase or decrease the number of questions, in addition to adding or deleting those questions in the question banks, there are a few other things to update. Let’s walk through each of them. Update the Instructions Slide If you update the number of questions, it’s important to update the on-screen instructions so learners understand how the course works. To update the instruction text, go to your timeline and click on the eye icon to hide the objects that you don’t need to edit. After you’re done making edits, remember to show all the objects again. Update the Question Slide Master Another place you’ll want to update the on-screen text is on the question slide master. Next to the variable that keeps track of the question number you’re currently on, you’ll see it shows the total number of questions—which in this case is 20. Once again, this is a pretty quick fix. Simply replace the number after the slash with the total number of questions in your project. Update the Result Slide for Each Level On the Success layer of the result slide for each level, learners see how many stars they earned as well as a message that explains what those stars mean. Both the number of stars and the message displayed are personalized depending on their score. By default, it’s set up so that: If learners get 10-14 questions right, they’ll see one star and a message saying they got at least 10 questions right. If learners get 15-19 questions right, they’ll see two stars and a message saying they got at least 15 questions right. If learners get a perfect score, they’ll see three stars and a message saying they answered all 20 questions correctly. To make this happen, I’ve added states to both the stars and the feedback textbox. I also added triggers to show the state that corresponds to the learner’s score. Here’s what those triggers look like: If you change the number of questions in each level, you’ll need to update these triggers. But before you do that, you’ll need to calculate the scores that learners need to get to earn one, two, or three stars. For example, let’s say you want to reduce the number of questions per level from 20 to 10. You decide that to earn one star learners need to get five questions right, to earn two stars they need to get seven, and to earn three stars they need to get a perfect score. Assuming that each question is still worth 10 points, here’s what that calculation would look like: 1 star: 5 questions x 10 points each = 50 points 2 stars: 7 questions x 10 points each = 70 points 3 stars: 10 questions x 10 points each = 100 points Since technically learners will earn one star if they get five or six right answers, and two stars if they get seven, eight, or nine right answers, the triggers associated with those stars and the associated feedback messages will need to cover a range of points, unlike the ones associated with three stars. Here’s what those values look like if we use the example above: 1 star: between 50 and 69 points 2 stars: between 70 and 99 points 3 stars: equal to 100 points Thanks to the new trigger panel, it’s quick and easy to make those edits, as you can see in the GIF below: Finally, remember to update the text in the feedback message states to reflect the number of questions learners need to get right to earn one, two, or three stars, as shown in the GIF below: Update the Gameboard Slide The number of points earned—which, as we saw in the previous section, changes when you adjust the number of questions in each level—also impacts two things on the gameboard slide: The number of stars that learners earn The layer that appears when a learner unlocks a new level Updating these triggers looks very similar to what you just did on the result slides. Here’s a GIF that shows me updating those triggers for Level Two: You’ll need to repeat the above process for Levels Three to Five. The good news is that even though there are a bunch of triggers to update here, it’s super-fast since you can do it directly in the trigger panel. And those are all the updates you’ll need to make if you want to change the number of questions in each level. You did it! How do I change the amount of time in each level? By default, learners get one minute to complete each level. For every correct answer, they get an extra five seconds added to their time. If you want to change the amount of time learners start off with, you’ll need to do a few things. Let’s walk through the steps together. Update the Default Value of the Time Variable Start by adjusting the X variable, which counts the total amount of time remaining in seconds. In my template, I set the default value to 60—to give learners one minute to complete each level: If you want to give your learners more or less time, you’ll need to adjust the default value of this variable. Extend the Timer Past Two Minutes (Skip If Decreasing Time) If you’re decreasing the amount of time learners have to complete a level, you can skip this step. However, if you’re increasing it, you’ll want to pay close attention. In my template, a variable called M displays the number of minutes remaining. Even if learners get all the questions right, it’s not set up to work for anything above two minutes. If you decide to give learners extra time, you’ll need to make a couple of adjustments. The minuter-counter functionality is set up on the top-level slide master, on the Slide Loop layer: To figure out how many triggers you’ll need to add, start by calculating the maximum number of minutes that learners could end up with if they got all the questions right. For example, let’s say you decide to give learners two minutes (or 120 seconds) to start out with. To figure out how much total time they could end up with if they get all 20 questions right—and receive a five-second bonus for each—you’d end up with this calculation: 120 + (5 x 20) = 220 seconds. To find the number of minutes, simply divide that number by 60. In this case, the answer is three minutes. To make the timer work for this scenario, you’ll need to: Update the trigger that sets the number of minutes, in this case two, to include a range rather than anything above 120. In other words, you want to set M to 2 if X is between 120 and 179, instead of if it’s equal to or greater than 120. Add a new trigger to set M to 3 if X is greater than or equal to 180. Note that these triggers appear twice—once when the timeline starts and again when the timeline ends—so you’ll need to update them twice. Here’s a GIF that shows me updating them: Update the Reset Triggers Since the timer needs to start over whenever learners begin a new level, you’ll need to update the triggers that reset the starting value of the X variable—which controls the time remaining—in a few spots: On the gameboard slide: On the retry buttons located on the Success and Failure layers of the result slides for each level: Remember to do this on the Success and Failure layers for every single level, or the timer will automatically reset to 60, since that’s the amount of time I set the template up for initially. And you’re done! You’ve successfully updated the amount of time learners have to complete each level. How do I change the number of levels? If you want to split your quizzes up by topic, but you have more or fewer levels than are included in the template, no problem! In this section, I’ll walk you through how to customize the number of levels. If you want to decrease the number of levels, all you need to do is delete the associated scenes as well as the buttons and layers on the gameboard slide. Easy-peasy! However, if you want to add an extra level, there are a few additional steps. Let’s take a closer look. Create a New Level To create a new level, start by inserting a new scene. From there, duplicate one of the existing question banks and insert a new draw into your scene. If you’ve never used question banks before, check out this tutorial: Understanding Question Banks. Next, copy one of the existing result slides and paste it into the new scene, after the question bank draw. If you want, you can update the color of the buttons learners use to select their answers. In my template, I used a different color for each level—to match the color of the button leading to that level on the gameboard slide. Update the Gameboard Slide On the gameboard slide, decide where to insert the button for the new level. As you can see in the screenshot below, there’s a good amount of space between Levels Four and Five, so that may be a good place to put it. To create the Level Six button, duplicate the Level Five button and the associated stars. Then, update the button’s fill color so that it’s different from all the other levels. Next, move the Level Five button to the left, making sure to delete a few of the circles on the path to make space for the new button. Then, update the level number on the duplicated button to 06: Remember to update the fill color and level number in both the Normal and Disabled states, so that they appear correctly whether the level is locked or unlocked. For more tips on working with states, check out this tutorial: Adding and Editing States. Each level has its own layer on the gameboard slide. On each layer, you’ll notice that the path animates to lead up to the button for that level. An arrow and an instruction also appear so learners know which button to click. Finally, the button state changes, effectively unlocking the level. If you’re adding one new level, here are the updates you’ll need to make. On the Level Five layer, delete the part of the path that leads to Level Six and move the arrow and text so that they point to the Level Five button: Then, on the Level Six layer, get rid of the animations—without deleting the circles themselves—on the part of the path that leads to Level Five, and delete the circles that overlap with the Level Five button. Next, update the instruction text to say “Level Six” and update the button that the trigger points to. When you duplicated the level button earlier, the triggers associated with the level button were also duplicated. However, you still need to update a few things: The value of the variable that’s updated when the user clicks to indicate the level the user is currently working on The result slide the button resets The quiz slide the button jumps to Here’s a GIF that shows how to update those triggers: Update the Question Slide Master On the question slide master, duplicate the Level Five variable trigger. Then, change the value to 6 and update the slide it points to, as shown in the GIF below: Update the New Level’s Result Slide On the Level Six result slide, update the triggers on the Try Again buttons on both the Success and Failure layers: Update the Cumulative Result Slide Finally, on the cumulative result slide, check the box to include the result slide for the new level in the cumulative result calculation: Hopefully, this tutorial will help you customize this template to fit your needs! If you run into any issues or if you’d like to update this template in a way that’s not covered in this tutorial, please leave me a comment below. Looking for more gamified course templates? Here are few of my favorites: Randomized Board Game Dice Quiz Game E-Learning Battleship Game Crossword Puzzle Game Want to try something you learned here, but don’t have Articulate 360? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments.Here’s How You Can Create and Customize Freeform Drag-and-Drop Interactions
If you’re looking to add some interactivity to your next e-learning project, you might consider designing a drag-and-drop interaction. Drag-and-drops are a nice way to make your learner stop, think, and engage with the content: perhaps to order the steps in a process, match terms, or place items where they belong. Storyline newbies might be wondering how to build and customize a freeform drag-and-drop interaction. Let me walk you through the steps you can follow. Step 1: Design Your Slide Let’s say you want to build an interaction on the topic of Canadian geography. You want learners to place various Canadian cities in the appropriate place on a map. The first thing to do is design how the slide will look. You need to add all the items you want to have on your slide, including the objects you will use as drag items and drop targets (both key to creating a drag-and-drop interaction). Drag items are the objects that you actually click and drag on the slide, whereas drop targets are the areas on the slide where you drop the drag items. In the example below there is a black rectangle with a title across the top of the slide, an image of a map of Canada in the background, and rectangle shapes that are used to create drag items (the names of the cities) and drop targets (locations of the cities on the map). You’ll also notice the use of star shapes to indicate the exact placement of the city on the map. So far, the slide looks like this: Right now this is a static slide. It has a default Next and Prev button, and if you preview it, nothing happens. You can’t click on the cities and drag them to their spot on the map ... yet. Step 2: Convert to Freeform To take this from a static slide to an interactive drag-and-drop, click the “Convert to Freeform” button that’s available on the Insert tab of the Storyline ribbon. When you click the Convert to Freeform button, Storyline presents you with options for the type of freeform slide to create. For this example, select “Drag and Drop.” Select “Drag and Drop” to create a drag-and-drop interaction. Once you’ve converted a static slide into a freeform drag-and-drop slide, a few things happen. First, you’re presented with what’s called “Form View,” which looks like this: Form View is where drag items and their corresponding drop targets are assigned. A few other things happen when you convert a static slide to a freeform slide, which you can see when you switch over to “Slide View.” The slide no longer has a Prev and Next button, but instead now has a Submit button. Storyline also automatically creates Correct and Incorrect feedback layers for the slide. (You may choose to leave the default feedback layers as they are, or you can pop into the Feedback Master to customize the look and feel of those layers.) Once you hit Convert to Freeform, the slide has a Submit button, as well asCorrect and Incorrect feedback layers. Step 3: Assign Drag Items & Drop Targets Next, pop into Form View to assign which objects are drag items and drop targets. It’s super simple to do; just choose the drag item in the left column and select the corresponding drop target in in the right column. There’s even a handy slide preview in the right-hand panel that shows you which object you’re selecting, to minimize room for error. Once you’ve assigned your drag items and drop targets, Form View looks like this: Tip: Naming the drag items and drop targets makes it easy to ensure you have selected the correct corresponding objects. Step 4:Preview Your Interaction Now your drag-and-drop interaction should be working. You can hit the Preview button to see how it looks and check for any unwanted behavior: View this demo in action The interaction is working, but you might want to change a few things to improve the learner experience: The Incorrect layer doesn’t provide any tips or indications about which drag items (if any) were placed in the correct drop zones and which weren’t. You can drop the drag items anywhere on the map, even outside of the drop targets. You can drop more than one drag item in a drop target. Notice the learner gets no feedback about which answers are right or wrong. Also, learners can place drag items outside of drop targets, which looks messy. Let’s look at how you can customize this freeform drag-and-drop interaction to make it work the way you want it to. Step 5: Add Drag-and-Drop States to Your Drag Items First, you can address the issue of not providing feedback to learners about which questions are right or wrong by using Storyline’s custom drag-and-drop states. These states are a quick and easy way to give your learners feedback about their choices. To add these states, simply select your drag item objects and click the “Add State” button in the States panel. You’ll notice these three options are available under the dropdown when you create a new state: There are three drag-and-drop states available. The three states available are: Drag Over State: This state determines how an object looks when it’s being dragged over any drop target Drop Correct State: This state determines how an object looks when it’s on the correct drop target Drop Incorrect State: This state determines how an object looks when it’s on an incorrect drop target Once you’ve added your custom drag-and-drop states to one object, you can use the Format Painter to quickly apply those identical states to your other drag items. Now your learners will know which drag items are right and wrong when they click Submit. Step 6:Customize with Drag-and-DropOptions To further customize your drag-and-drop, head over to the Design tab of the Storyline ribbon: Tip: There’s more than one Design tab; select the one that is on the far right. On this Design tab of the ribbon you’ll notice a button called “Drag & Drop Options.” Click on this button to reveal this window: Here, you have lots of options and features to customize how your drag-and-drop will function. Let’s run through them here: Drag Item Options Return item to start point if dropped outside: Any drop target: Select this option to make the drag items return to their start point if the learner does not drop them on one of the targets you’ve assigned in Form View. A correct drop target: Select this option to make the drag items return to their start point if they are not dropped on the correct target. Reveal drag items one a time: In certain cases you may not have the space to put all of your drag items on the slide. This option allows you to reveal your drag items one at a time (here’s an example). You can even decide in what order to reveal them. Drop Target Options Snap dropped items to drop target: This option allows you to specify how the drag item reacts when you place it on the drop target. You have the following options: Tile Stack random Stack offset Snap to center Free Allow only one item in each drop target: Pretty straightforward, this option makes it so that only one drag item can be in each drop target at the same time. If you drop a second item in the drop target, the drag item that’s already on the drop target will be returned to its starting point. Feedback Delay item drop states until interaction is submitted: This option uses Storyline’s custom drag-and-drop states, which are mentioned in the previous step. By default, when you’re using these custom states, they will only be displayed once the learner clicks the Submit button. You can, however, change this by de-selecting the “Delay item drop states until interaction is submitted.” With this option de-selected, the drag-and-drop state (either Correct or Incorrect, depending on their choice) will appear as soon as the user drops the drag item on a target, not after they click the Submit button. With all these options available, you can make a few quick edits to change how this interaction works. Select “Return item to start point if dropped outside: any drop target” to prevent the learner from being able to leave a drag item anywhere on the slide besides a drop target Select “Allow only one item in each drop target” to prevent the learner from placing more than one drag item in a drop target Let’s look at how this example works with those changes in effect: View this demo in action This interaction is a lot smoother now, and you’re providing the learner with valuable feedback about which answers they answered correctly and incorrectly by using the drag-and-drop states. You could even take this a step further and give the learner unlimited attempts so they can keep trying until they’ve got all the cities in the correct spots. This is helpful from an instructional design standpoint because you don’t want to leave a learner hanging, unsure of the correct answers. Here’s how the interaction would work with unlimited attempts: View this demo in action Did you notice that the learner gets to keep trying until they get it right? This leaves them with no doubt about the correct answers. Hopefully this example helps you understand how to create freeform drag-and-drops, and how you can customize them with the drag-and-drop options available in Storyline. Do you have tips of your own for creating freeform drag-and-drop interactions? If so, let me know in the comments below! Want to try something you learned here, but don’t have Articulate 360? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments.A Behind-the-Scenes Look at How I Designed This Gamified Quiz
Have you ever wanted to create a gamified quiz, but didn’t know where to start? Or maybe you had a few ideas, but felt a little intimidated and decided to save it for a rainy day...that never came? I feel you. I’ve been there. But guess what? I went for it! Here’s how it turned out: Click here to view the interactive version and download the template. And if I can do it, you can too! In this article, I’m going to walk you through my design process so you can see how I got from an idea to a finished product. Let’s dive in! Coming Up with the Concept One of the hardest parts of gamifying your e-learning course is deciding which game elements to add. There are so many options it can be hard to decide which ones to focus on. There’s no right or wrong answer, but, as always, it’s important to keep your learning objectives and target audience in mind. Since I didn’t have an actual project to tackle, I tried to imagine a situation in which it may be beneficial to gamify a course. Then it came to me! What if I created a quiz for learners who need to memorize a bunch of information—vocabulary words, for example? When it comes to memorization, one thing that can be helpful is repetition. That’s why people use flashcards, so they can run through them over and over, remembering more and more each time. But repetition can also be boring, so why not make it fun? With that in mind, I decided to incorporate the following things: Question banks. I wanted to help commit the answers to long-term memory by randomizing and spacing out the questions and not simply using short-term memory to recall the order. A countdown timer. I wanted to create a sense of urgency and excitement, but also to encourage learners to trust their gut and go with their first instinct rather than overthinking it. Extra time. I added extra time to the clock to reward learners for correct answers and to give them more time to think about subsequent questions. An incentive to try again. Instead of forcing learners to get a perfect score to move forward, I wanted to entice learners to beat their previous score, so I set up a system of stars. Learners only need one star (or 10 correct answers) to pass, but if they want to earn two, they need to get 15 correct answers, and to earn all three stars, they have to get a perfect score. The hope is that learners who only get one star will want to try again until they get two or three stars. Levels. I broke the game up into levels that unlock as they go to give learners a sense of achievement. Sound effects. I embellished the game with sound effects to give it a more playful feel. Now that you have some insight into the ideation process, let’s take a look at how I decided on the design. Designing the Graphics Since my gamified quiz is intended to be a template, I wanted to stick to a simple design that could be used for a broad range of topics and could easily be adapted to fit any company’s brand guidelines. I decided to go with a bright, colorful palette to give it a fun vibe. Initially, I wasn’t sure if I wanted to use a background image or not, so I just left the background white. Here’s what my first draft looked like: But I wasn’t 100 percent satisfied with this first version. The font didn’t feel “fun” enough and all the gray made for visuals that were a little too “blah,” so I started brainstorming ways to improve upon my design. When I’m looking for inspiration, I often try searching Content Library 360 to see if anything jumps out at me. And sure enough, I stumbled upon an illustration of a sky with a big cloud and it just clicked—that’s it! What better way to give my game a lighthearted vibe? After I added the background, things started falling into place. I swapped out the gray for a darker shade of blue, to match the sky, and replaced the boring font with this fun, game-inspired one. Now I was getting somewhere! Here’s what my second version looked like: But something still didn’t feel right. I decided to see what it would look like if the pathway followed the outline of the clouds, to give it a more integrated, cohesive look. Once I was happy with the main menu slide, I created the question slides along the same lines, changing the colors for each level. At this point, I was feeling pretty good about my graphics, so I started thinking about sound effects. Choosing Sound Effects To really give my quiz a game-like feel, I decided to add some sound effects. I was careful not to go overboard, which would distract from the learning experience. Here’s what I landed on: A theme song. I wanted something to play at the beginning and end of the game as well as on the results slide to set the tone for the course. I wasn’t sure exactly what I wanted it to sound like, but I was imagining something a little retro to fit with the graphic style I chose. Correct/incorrect sounds. I thought it would be nice to find sound effects to signal to learners whether they’ve answered a question correctly or incorrectly. I wanted something that was short—so it didn’t get annoying—and unambiguous—so learners wouldn’t be left wondering what it meant. A “time’s up” sound. Finally, I wanted to find another short tone to signal when the time runs out on the clock—like an alarm or a buzzer. With that decided, I started my search. First, I headed over to this list of websites with free sound effects. After looking at a few options, I concentrated my efforts on freesound.org since it’s easy to navigate and the licensing terms for each download are clearly laid out. From there, I started trying out a few keywords—like game, theme song, right, wrong, alarm, buzzer—and gave each one a listen. To include my sound effects in my template, I made sure to choose sound effects that were licensed under Creative Commons 0—so I could use and redistribute them freely. That narrowed down my options, which actually made it easier to choose. If you’ve never used sound effects in your courses before, check out this article for advice on using them effectively: Tips for Using Sound Effects in E-Learning. More Resources Hopefully you found this sneak peek into my design process useful! If you downloaded the template and need some help customizing it, be sure to check out this how-to article, where I walk through how to do that:How To Customize This Storyline 360 Countdown Quiz Game Template. If you want to dig deeper into the concept of gamification and how to apply it to your e-learning courses, check out these helpful articles: Gamification Techniques: How to Apply Them to E-Learning Gamification: How and Why Does It Relate to E-Learning? 5 Visual Design Tips for Gamified E-Learning And here are a couple of gamified course templates in case you’re short on time: Randomized Board Game Dice Quiz Game E-Learning Battleship Game Crossword Puzzle Game Not finding what you’re looking for? There are tons more where these came from! Hop on over to the downloads hub to browse all the Storyline templates. Subscribe to our newsletter to get the latest e-learning inspiration and insights directly in your inbox. You can also find us on LinkedIn and X (Formerly Twitter).A Beginner’s Guide to Designing Effective Tabs Interactions
When you think about the types of interactions most often used in e-learning, the good old tabs interaction is probably on the top of your list. That’s no big surprise. Tabs interactions are versatile and a great way to intuitively lay out related content, save screen real estate, and invite your learners to dig in and absorb information at their own pace. On top of their versatility, tabs interactions are quick and easy to build. In Rise 360, creating a tabs interaction is super-simple. Just insert a tabs block (fromthe interactive blocks menu) into your lesson and then pop in your content. Voilà! Instant tab-ification! Over in Storyline 360, you can grab a Content Library 360 template that has a beautiful prebuilt tabs interaction (like this one) and then customize it to your heart’s content, or you can create a custom tabs interaction in under five minutes. When your project requires a custom tabs interaction built from scratch in Storyline 360 and you’re brand new to creating such things and/or feel (very!) intimidated at the prospect, how can you be sure you’re making a tabs interaction that looks professional AND will be intuitive for learners? Should you even use a tabs interaction at all? These are the questions we’ll tackle in this article. I’m breaking down a few easy design considerations for building effective tabs interactions by highlighting some simple functional and visual design guidelines almost anyone can follow. Consider your content Tabs are a great option for presenting related content, like a collection of tips, steps in a process, or ideas that might otherwise end up as a list of bullet points or text spread out over multiple slides. For example, this free tabs download from Montseusesa familiar notebook themeto group related content. Montse'sprojectlooks so vibrant and inviting that you might ask yourself, Should I just use a tabs interaction for everything? The short answer is no. But here are a few questions to consider to see if a tabs interaction is the best fit for your content: Is the information I’m sharing all logically related? If the information can’t be chunked together in a logical way, using a tabs interaction might end up being confusing to learners. Will my learners need to compare any information side by side? If the point of sharing this information with learners is to help them understand the differences and similarities between products, for instance, a tabs interaction isn’t the best choice since they’ll only be able to see the content on one tab at a time. To help learners draw comparisons, try a side-by-side or table layout instead. Can I make this information more concise? Sometimes streamlining lots of content—even if it is all related—just isn’t ideal. If streamlining content means you’ll sacrifice reading comprehension or gloss over an important message,cramming it into a tabs interaction isn’t the answer. In general, if you find yourself reducing the font size to make everything fit, consider that a sign that your content might not work for a tabs interaction. In some cases that content may work better as a sub-menu that branches to separate slides so you have more screen real estate to work with. Use straightforward tab labels The beauty of a tabs interaction is that it groups related information in a way that’s intuitive to navigate. One of the ways these types of interactions are made so intuitive is through the use of labels. Tab labels should be short and sweet and reflect the type of content you’re sharing. Tab labels can take many different forms, including numbers or letters (that may convey order or priority), words or short phrases, icons or images—and even a combination of these things. Belowarea few free downloadsfeaturingsome different ways of labeling tabs. Tabs Labeled with Numbers or Letters Tabs Labeled with Words or Phrases Tabs Labeled with Icons or Images Consider tab placement Crafting clear labels is just the first step in ensuring your tabs interaction is easy to navigate. It’s equally important to arrange your tabs on the screen in a way that makes sense. So how should you position your tabs for an effective interaction? Ideally, tabs should be aligned vertically or horizontally on the screen, spaced evenly and closely—but not so close that it’s hard for learners to click on individual tabs. Below is a quick comparison of two tabs designs. DO DON'T Notice how the tab design on the left is intuitive to use because the tabs are grouped together in a single vertical line? When you look at the design on the right it’s a bit harder to parse what’s going on because the tabs aren't spaced evenly and it’s not clear if they’re separate or related. Making sure the tab size, spacing, and alignment are consistent will go a long way in making your interaction easy to navigate. Make your tabs look clickable Once you’ve arranged your tabs you need a way for folks to know that they’re clickable. That’s where object states come into the picture. In Storyline 360, object states allow you to change the appearance of an object when a learner performs an action, like hovering or clicking on it. It’s a simple concept, but a powerful way to make any slide’s design more user-friendly. For instance, applying a simple hover state to your tabs signals to your learners that there’s more to see and explore. In Storyline 360, it’s easy to assign different states to the objects on your screen, like tabs, buttons, characters, text—pretty much anything. By applying a selected state to a tab, you can signal to your learners that they’re viewing the content associated with the tab they clicked on. You can also add a visited state to your tab so learners know that they’ve already reviewed the information in a given tab. Using all of these states is an even better idea. When used together these states highlight and emphasize how to navigate your tabs. There’s more to learn They say the devil is in the details, and that certainly holds true for designing interactive e-learning. It’s exciting to think about all the little considerations that go into making even something as unassuming as a tabs interaction more beautiful and intuitive. Hopefully the guidelines I’ve shared here have you feeling more confident about designing all sorts of interactions in your Storyline projects, including tabs. Want to learn more about building effective tabs interactions in Storyline 360? Check out the following articles for more ideas, tips, and inspiration. The Most Straightforward Way to Build a Tabs Interaction for Storyline Everything You Need to Know About States in Storyline 360 A Great Storyline Time Saver: Button Sets Create a Tabs Interaction with Storyline in 5 Short Minutes Follow us on Twitter and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments. Want to try building something similar in Storyline 360, but don’t have Articulate 360? Start a free 30-day trial.How I Designed This Immersive Scenario on Prioritizing Tasks
Recently my fellow instructional designers Sarah Hodge and Madison McCartney and I teamed up to prove that there’s always more than one way to present course content. Each of us created a mini-course on prioritizing tasks, using the Eisenhower Decision Matrix as our starting point. In this article, I’m going to walk you through how I got from this: … to this: View interactive version | Download template Without further ado, let’s get into it! Setting the Scene Since I created this project as an example, there’s no real target audience, much less learning objectives. But to make it feel realistic I set some basic parameters to guide my design thinking. Here’s what I came up with: Audience: Novice e-learning project managers Learning objective: Be able to identify tasks, classify them as important and/or urgent, and prioritize them accordingly Coming Up with the Concept Over the years, I’ve seen a lot of great e-learning examples in the E-Learning Heroes community, but a few really stand out to me. One in particular is this time management game by Phil Eagles. I love the way he took a series of simple multiple choice questions and made them into a scenario that feels real and meaningful. And since time management is so closely related to task prioritization, it’s the first thing I thought of when I started brainstorming ideas for my project. I wanted to create something similar—but put my own spin on it. Because I wanted to create a totally custom and immersive scenario, Storyline 360 was the perfect choice for this project. I decided to simulate a desk and let learners identify tasks and prioritize items for themselves. The idea behind this was to emulate real life—where learners have to identify tasks and decide which ones to do first—while also following one of the key principles of adult learning by giving them control over their learning experience. Refining the Scenario Once I had a general idea of what I wanted to do, it was time to iron out the scenario details. I wanted to give learners enough opportunities to practice prioritizing tasks without it feeling repetitive. I included a few different types of tasks—since that’s what it’s like in real life. In the end, I settled on a total of six tasks, including a few emails, a couple of text messages, and a Post-it. As I started to build out my scenario, I ran into some challenges. One of the main issues was that my slide was getting overcrowded. To overcome this challenge and help learners focus on one thing at a time, I divided the process of task prioritization into two parts: Step 1: identify and analyze the tasks to determine how urgent/important they are Step 2: prioritize the tasks based on their level of urgency/importance For step one, I used a series of toggles so the learner can decide if each task is urgent and/or important. Based on their answer, I provide custom feedback. This is how that turned out: For step two, I made a simple drag-and-drop interaction so the learner can decide where each task belongs on their to-do list based on its level of urgency and importance. Here’s what that ended up looking like: Because this project was intended for adults who may have previous experience with the Eisenhower Decision Matrix, I made the explanation walk-through optional, as shown in the screenshot below: Is this how I initially envisioned my project? Absolutely not. To be honest, I don’t think I really had a clear mental picture of what it would look like. Some people can map out their entire project before they even open up the authoring app, while others do better jumping straight into building and get inspired along the way. Both methods are totally fine as long as you always keep your learners’ needs at the center of your design. Designing the Graphics As someone with no formal graphic design training, I can be challenged to come up with ideas for the look and feel of my courses. To find inspiration, I usually start by checking out the examples and templates on E-Learning Heroes as well as the Content Library 360 templates. Even if I don’t find exactly what I need, I usually come across something I can use as a starting point. Personally, I find that starting with a template is less intimidating than starting from a blank slide. And even if the final result ends up looking completely different than the original template, having something to start with helps me channel my ideas and inch closer to a place I feel good about. So, once I knew that I wanted to create an immersive scenario, I headed straight to E-Learning Heroes to look for templates I could use as a springboard for my design. A quick search for “desk” led me to this template, which I thought was perfect: Download Template After opening the template, I made some adjustments and played around with different color options. Here’s what my first version looked like: There’s nothing wrong with the way this looks, but—as I mentioned earlier in this article—it was at this point I realized there wasn’t enough room on the slide to allow learners to both identify and prioritize tasks in one spot. Splitting the activity up into two parts gave me more screen real estate to work with. Around this time, I also decided I wasn’t sure about the mint green wall and wanted to give white a try . . . . . . but I wasn’t totally sold on that either. I also felt lukewarm about the way the desk looked and decided to incorporate some texture. This is what the next version looked like: Wondering how I created the wood texture? I did a Google search for “flat design wood,” inserted one of the images I found onto my slide master, and then used the curve tool and shapes in Storyline 360 to achieve a similar effect. This is what it looks like behind the scenes: I was pretty happy with the way this looked, but when I started adding other objects to the screen, I realized they didn’t stand out enough against the dark blue background. That’s when I settled on the design you see in the final version: I went through a similar process for the other slides in my project, so I thought I’d share the different versions with you as well. . . . and here’s the final version. You’ll notice that in the final version I pulled in the computer screen from the previous slide to tie it together a bit more. I also changed the size of the boxes to make it all fit on the screen. As I was working on my core content slides, I also started to pull together my title slide. Since my other two slides used a flat design style, I wanted to stick with something similar. I found this simple slide template in Content Library 360 and used it as a starting point: I didn’t want to include characters, so I deleted those and changed the color of the background to match the dark blue I was using at the time. After taking out the characters and changing the color, I felt like the slide was too minimal. It was missing something, so I sat and thought about how I could incorporate more visual interest. That’s when I had an idea: what if the title slide was a view of the desk from above? And since we’re talking about prioritizing tasks—and many people write their to-do lists in a notebook—I thought that might make sense and look nice. So I went back to E-Learning Heroes for some inspiration and ended up finding this spiral notebook template: Download I imported it into Storyline 360 and made a few adjustments to make it all come together. Here’s what it ended up looking like: As you can see, graphic design isn’t always a straightforward process. It doesn’t necessarily go from zero to perfect in one fell swoop. In many cases it’s an iterative process involving incremental changes until you’re happy with what you’ve got. So the next time you’re feeling stuck and unsure about your design, try doing what I did and search E-Learning Heroes or Content Library 360 for a template you can use as a starting point. Then, make small changes here and there. Eventually you’ll get to a place where you feel good about your design. More Resources Hopefully you’ve found this inside look at my design process interesting and insightful! Remember, it’s okay if your first draft isn’t perfect. Design (whether it’s instructional or graphic) is a process, and it often takes trial and error to get it to where it needs to be. And there’s absolutely nothing wrong with that! If you enjoyed this article and are looking for more insight into what goes on in the minds of instructional designers as they’re creating courses, be sure to check out these articles: How I Designed This Personalized Decision Matrix How I Designed This Interactive Dial Matrix A Behind-the-Scenes Look at How I Designed This Gamified Quiz Want to try building your own immersive scenario in Storyline 360, but don’t have Articulate 360? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments.3 Ways to Use Sliders to Elevate Your Next Storyline 360 Course
Sliders are a great way to give learners the opportunity to manipulate data and gain a better understanding of the relationships between topics. Take the interaction below, for example. Do you see how much more meaningful it is when you can actually interact with the percentages instead of simply displaying a static version on the slide? Explore this example But that’s not all sliders are good for! They have many other creative uses. In this article, I’ll walk you through three of my favorites. 1. Show Course Progression Using a slider is a great way to give learners a visual representation of where they’re at in the course. It helps learners plan their time by viewing what they’ve completed and what they have left. Here’s an example of what that might look like: Explore this example and download the template Thanks to the slide numbers feature in Storyline 360, this is super easy to set up. Just follow the steps outlined in this tutorial: How I Made This Progress Meter in Storyline 360. 2. Chunk Related Content Displaying content in chunks makes it easier to read and less overwhelming—especially when there’s lots of information. One common way to do this is by using tabs or click-and-reveal interactions, but another option is to use a slider. Here’s an example I created using a Content Library 360 template: Explore this example and download the template Want to build something like this for your course? It’s super easy! Just follow the step-by-step instructions in this article. 3. Help Learners Reflect Giving learners time to reflect is a great way to help them engage with the course content on a deeper level. Let’s say you’ve walked learners through a scenario and you want them to imagine how they’d feel if something similar happened to them. You could create a simple interaction like the one below: Explore this example and download the template Sound like something you could use in your project? Find out how to create it in this tutorial. Wrap-Up These are just three ways to incorporate sliders in your course, but there are plenty of others. Have you thought of any creative uses for sliders? If so, I’d love to hear about it in the comments below! If you’ve never worked with sliders before, here are some articles that will help you get started: Storyline 360: Working with Sliders 4 Pro Tips for Working with Sliders And if you’re looking for more ways to improve your courses with Storyline 360, be sure to check out the following articles: 7 Tips for Creating Immersive Learning Experiences with Interactive 360° Images 5 Tips for Creating Effective Software Simulations with Storyline 360 4 Ways to Improve the Learning Experience by Customizing the Storyline 360 Course Player Want to try building sliders in Storyline 360, but don’t have Articulate 360? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning.How to Build a Simple Slide-to-Reveal Interaction
Displaying content in chunks makes it easier to read and less overwhelming—especially when there’s lots of information. Many instructional designers do this using a tabs or click-and-reveal interaction, but have you ever thought about using a slider instead? In this tutorial, I’ll walk you through how to do just that—step by step. Here we go! 1. Insert Slide Content Start by creating your slide and adding your content. To save time, I opened up Content Library 360 and chose one of the slide templates, but you can also create your own from scratch if you prefer. From there, add a semitransparent rectangle over each content section. When you’re done, this rectangle will help the learner see which of the sections is selected. 2. Set Initial State Now, set the initial state of the first rectangle to hidden. That way, when the slide starts the first image will appear “lit up” as compared to the others—since they’re covered by the rectangles—indicating to the learner that it’s selected. 3. Insert Slider Then, open the Insert tab, select the slider you want to add to your project, and format it however you’d like. 4. Set Slider Properties From there, select the slider to open the Design tab and adjust the properties. Change the end value depending on the number of stopping points you need. In this case, since there are four total sections, I selected 3 as the end value. Then, before moving onto the next step, choose While Slider Is Dragged from the Update drop-down menu so the slider updates as the learner moves it. 5. Add Triggers To make the rectangles we added earlier appear and disappear based on what’s currently selected, head over to the trigger panel and add two triggers to each shape. Trigger 1 Action: Change State of Object: Rectangle To State: Hidden When: Slider Moves Conditions: If the slider’s value is equal to (step number minus one since the start value is 0) Trigger 2 Action: Change State of Object: Rectangle To State: Normal When: Slider Moves Conditions: If the slider’s value is not equal to (step number minus one since the start value is 0) Wrap-Up And that’s all there is to it! In just a few minutes, you have an engaging way to split up your content for learners. Explore the finished project and download the template here. Interested in learning more about working with sliders? Check out these helpful articles: Storyline 360: Working with Sliders 4 Pro Tips for Working with Sliders And if you want to see some other creative ways to use sliders in your courses, hop on over to this article: 3 Ways to Use Sliders to Elevate Your Next Storyline 360 Course. Want to try building your own slide-to-reveal, but don’t have Storyline 360? Start a free 30-day trial of Articulate 360, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. If you have any questions, please share them in the comments.
