Template
18 Topics10 Most Popular Rise 360 Real-Content Templates of 2023
Developing high-quality, engaging content can be time-consuming. But don’t worry—with the real-content templates in Content Library 360, you can quickly deploy fully developed training full of prewritten content, instructional videos, and interactive exercises. Editing real-content template is easy too, making it a breeze to personalize your courses to fit your needs. From time management to mental health to effective meetings and more, here are the templates our customers found most valuable in 2023. 1. Time Management Essentials For the second year in a row, Time Management Essentials is the number one most popular real-content course. This crowd-pleasing course gives learners valuable tips for making the most of their time. 2. Developing a Growth Mindset Is your team feeling stuck? Want to help employees unlock their potential? Try sharing this course to help learners identify roadblocks and reignite growth. 3. Leading with Emotional Intelligence Explore empathy, social skills, and other essential soft skills for leadership in this course. 4. The Basics of Managing Stress Give your learners valuable information about the connection between the body and stress and actionable tips for how to manage it. 5. 5-Day Challenge to Improve Your Mental Health Challenge your learners to improve their mental health in just five days with interactive exercises, reflection questions, and more. 6. Workplace Communication Basics Help your team communicate more effectively with the verbal and written strategies in this course. 7. Resolving Conflict with Coworkers Conflict is inevitable, but it doesn’t have to slow your team down. Use this course to teach your team how to work through common issues. 8. Communication Fundamentals Help your team understand why communication matters and learn actionable tips and tricks to improve their skills. 9. A Guide to Effective Meetings Use this course to establish a culture of productive, energetic meetings within your team. 10. Soliciting and Responding to Customer Feedback Help your employees gather and respond expertly to customer feedback with this story-driven course. Wrap-Up Ready to try one of these real-content templates? Or curious to see what other templates are available? Log in to your Rise 360 dashboard, click +Create New, and click Course. This will open a dashboard where you can browse all templates currently available for subscribers. Have an idea for a real-content template? Let us know in the comments! Want to try one of these real-content templates, 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 sent directly to your inbox. If you have questions, please share them in the comments.285Views0likes4CommentsHow 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.124Views0likes6CommentsLevel Up Your E-Learning With These Popular Game Templates
Since we’re on the topic of games, let’s start off with a “Would you rather . . .” question. Here we go: Would you rather take a one-hour online test or play a one-hour online game? My bet is that you chose the one-hour game. And that’s no surprise—games are usually fun, whereas tests can be boring or difficult. But they don’t have to be! If you use gamification elements in your content—or even turn the entire learning experience into a game—you can boost learner engagement and drive performance. To help you get your game on, check out these popular game templates that you can download and customize to fit your learners’ needs. Storyline: Vocabulary Guessing Game With multiple choice questions, learners can sometimes simply guess the correct option. If you want a fun way to increase the challenge, try this vocabulary guessing game by Karlis Sprogis instead. By giving learners the number of letters in the word and limiting the number of attempts, you’re appealing to their competitive nature—will they find the correct answer in time? Or will they see the dreaded game-over screen? Storyline: Jeopardy-Inspired Game Show Template Do you need to test learners on multiple topics? This popular game show template by Sarah Hodge is just the thing to turn a boring assessment into a familiar and fun quizzing experience. Storyline: Countdown Quiz Game Want to see how adding game-like elements to your assessments can motivate learners? Then check out this countdown quiz game by Allison LaMotte. The more questions you get right, the more stars you earn, incentivizing learners to retry sections until they get a perfect score. Storyline 360: Angry Words Side-Scrolling Game If your employees communicate often with customers, the last thing you want is for them to wing it. Try teaching learners which phrases are helpful with this word side-scrolling game by Jonathan Hill. Who knew customer service content could be so much fun? Storyline: Codenames-Inspired Learning Game Need to get new employees up to speed on workplace acronyms and terminology? This learning game by Allison LaMotte will help them catch up in no time! By solving clues and looking for similarities, this game makes it fun to define individual terms and see how they all connect. Storyline: Gamified Quiz Template With Timer Need to check if employees can think and act fast? This timed quiz by Sarah Hodge challenges learners to quickly answer questions to prove they have what it takes. Wrap-Up So what are you waiting for? Go ahead and download any or all of these games and gamification examples and customize them to fit your needs. Or, create your own game-inspired project and share it in the comments below! We love seeing new and innovative ways to engage learners. If you need more inspiration, head on over to the weekly challenges, downloads, and examples to see other creative ideas. Want to try building something similar in Storyline 360, but don’t have Articulate 360? Start a free 30-day trial.1.3KViews0likes2Comments4 Rise 360 Content Templates That Can Get Your Cybersecurity Training Ready in a Jiffy
When companies need new digital security training, they often need it fast. Maybe a security breach revealed knowledge gaps that need to be addressed to prevent future issues. Or perhaps legal requirements changed, making new cybersecurity training an immediate priority. Whatever the reason, the faster the training gets out, the more secure your company will be. But that doesn’t mean you need to go into crunch mode to get this cybersecurity e-learning out in time. Just use one of the real content templates included in Rise 360! Whether you publish these fully built courses as is, or customize them by adding new content or lessons, you’ll be able to turn around training requests in no time. So, what digital security challenges can these content templates help solve? Let’s check them out. Ensuring Confidential Data Is Kept Safe If learners need to brush up on privacy and information security, share the How to Protect Your Data course. It covers digital security strategies they can use right now, including password creation tips, how multifactor authentication can add another layer of safety, and what they can do to keep devices and facilities secure. And to be sure learners realize how vulnerable their data is, this course also includes stories that highlight the common ways people accidentally expose private information. Recognizing Phishing Scams Many online scams and cyberattacks are preventable—if you know what signs to look for. The course How to Protect Yourself Against Phishing Attacks coaches learners on how to spot phishing red flags fast. It also includes advice on protecting against malware. And real-world scenarios sprinkled throughout the course give learners a clearer picture of the specific scams they may encounter. Keeping Information Safe When Online Help learners ensure their private information stays that way with the Online Security Fundamentals course. They’ll explore advice on securely browsing the internet, using public wi-fi safely, and protecting sensitive information on social media. And if a security incident happens, this course also shares advice on what learners can do to mitigate the fallout. Protecting Yourself from Social Engineering Challenge your learners’ assumptions about hackers with the What Is Social Engineering? course. It covers the surprisingly low-tech method many criminals use to get access to sensitive data, systems, and locations. Learners investigate how different social engineering techniques work with the help of scenarios and examples. Then they examine simple security tips for identifying and avoiding potential attacks. Check Out These Courses Yourself If you already have an Articulate 360 subscription, getting these courses ready to share with learners is easy. Just go to the Rise 360 dashboard, click the New Course button, and then type the course title in the search bar at the top of the screen. Wondering how else you can get great courses out fast with Rise 360’s real and placeholder content? Give these related articles a read. How to Mix and Match Real Content Lesson Templates to Create a Rise 360 Course in Minutes How I Created an Information Security Course in No Time Flat with Rise 360 Templates 3 New Ways to Create Courses Fast in Rise 360 Curious about the possibilities but don’t have Articulate 360 just yet? Start a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning. And if you have any questions, be sure to share them in the comments.72Views0likes0CommentsBlow Your Learners Out of the Water with This Battleship E-Learning Game
Quizzing is a huge part of e-learning course development, because you want to know if learners have understood the material. That makes sense! But that doesn’t mean your quizzes have to be boring. Take this e-learning battleship game, for example. When you strip away the game elements, it’s just a simple quiz. But to your learners, the game elements can mean the difference between a snoozefest and a fun and meaningful learning experience! In this article, I’ll show you how I built this from A to Z. Don’t be put off by the number of steps—it’s a lot easier than it looks. If you’ve been wanting to give e-learning games a go, but have been too intimidated by triggers and variables, this step-by-step tutorial is the perfect jumping-off point. The detailed explanations and screenshots will ensure you get it right the first time. Here we go! 1. Create Player Grids and Ships First, you’ll create your gameboard. To do this, just insert the number of squares needed using the “insert shapes” feature, and arrange them in a grid. The squares on the left (in the learner’s grid) should have no fill color. The squares on the right (in the enemy’s grid) should have the same fill color as the slide background. I’ll explain why later on in this article. Before moving on, you should create a naming convention for your squares. This will make the rest of the process much easier. In this example, I’ve given each row a letter and each column a number, as pictured below. The left grid squares are named as follows (from left to right and top to bottom): W1, W2, W3, W4, X1, X2, and so on. Next, design your ships using a combination of shapes, or insert them as images. The number and size of your ships depends on how many quiz questions you’d like to include. Each player should have the same number of ships and squares overlapped. (In my example, each player has three ships that span eight squares, so I have eight total questions.) Then place your ships on the grids as desired. When the learner clicks on these squares, they will be brought to the corresponding question slide. Once your ships are in place, make a list of all the squares the learner’s ships and the enemy’s ships are on. My list looks like this: We’ll use this list later, so keep it handy! 2. Add Visual Feedback to Squares Now that your player grids are set up, it’s time to add states to your squares. These serve as visual cues to the learners about how they’re doing. The real Battleship game offers only two possibilities: players either hit or miss their enemy’s ships. For the e-learning version, I created this third option: If learners find the ship but get the corresponding question wrong, they don’t get the points. For each square I created custom states named hit (correct answer), miss (no ship is present), and misfire (incorrect answer). If you’re not sure how to add states to an object, check out this tutorial before moving on. For the hit and miss states, I inserted a colored explosion shape—red for hit, blue for miss—andchangedthe fillcolor of the rectangle to None, so the square is transparent. Note that all of the learner squares are already transparent, so only the enemy square hit and miss states needed to be adjusted at this level. You’ll see why later on. For the misfire state, I combined a circle and four lines to create a crosshair icon. Here’s a quick look at my square states: Since the squares in the learner’s grid are transparent and the squares in the enemy’s grid have a fill color, the states look slightly different. 3. Add Interactivity to Empty Enemy Squares Now let’s add the interactivity, starting with the enemy squares without ships on them. For each of these squares, we’ll add a trigger so that when the learner clicks, the miss state will appear. (If you’re new to triggers, read this tutorial to see how they work.) Here’s what it should look like: To add this trigger to all of the other empty squares on the enemy’s grid, simply select the trigger, click Copy Trigger, select all of the other empty squares, and choose Paste Trigger. It’s that easy! 4. Create Variables for Enemy Squares with Ships Remember that list of squares with ships on it we made earlier? It’s time to get that out! We’re going to create a number variable for each of the squares in the enemy’s ships column with a default value of 1. (To learn more about adding variables, see this tutorial.) Once I created all of my variables, the variable manager window looked like this: These variables will allow us to change the state of the squares on the player grids to hit or misfire, depending on the learner’s answers. We’ll see how in Step 5. 5. Insert Your First Quiz Slide The next step is to create your first quiz slide. I chose to create a freeform pick-one question, but you can use any kind of question you’d like. Use the same name for your quiz slide as for the corresponding square. The first step in making player grids function correctly is to adjust the variables created earlier by adding a trigger on each feedback layer. On the correct layer, insert a trigger that adjusts the variable with the same name to add 1 when the timeline starts (in this example I’m on slide A2, so I’ll adjust variable A2). It should look like this: You’ll also want to change the “jump to” trigger on the continue button so when your learner clicks on it, they go back to the gameboard instead of to the next slide. On the incorrect layer, we’re going to add a similar trigger, except this time we’ll subtract 1 instead of adding 1. It should look like this: Don’t forget to change the “jump to” trigger on the incorrect layer as well, so learners go back to the gameboard when they click Continue. 6. Duplicate Quiz Slides Now that you’ve created one quiz slide, you can duplicate it for all of your other questions, assuming you’re using the same question type. Once you’ve duplicated the question slides, change the titles so they match the names of the different squares, then change the variable referenced in the trigger on both the correct and incorrect slides using the drop-down menu. Once you’ve done that for all of your question slides, you’re ready for Step 7! 7. Bring Your Gameboard to Life It’s time to go back to the gameboard and make the magic happen. First you’ll need to link your squares to your question slides. To do this, set up a trigger with a condition for each enemy square with a ship on it (column 2 on your list). The trigger should jump to the corresponding slide when the user clicks, if the state of the square is equal to normal. (Click here to find out more about trigger conditions.) It should look like this: Remember, you can use the trigger copy/paste buttons to get this done faster. Just make sure to change the slide reference so the button leads to the correct question. Next we’re going to add triggers to make the squares with ships on them change states (hit or misfire) depending on the learner’s answer. For each of these squares (see column 2 of your list once again), you’ll create two slide triggers with conditions, with an optional third trigger. Slide triggers rely on the slide’s timeline to make something happen. (To learn more about slide triggers, click here.) The first slide trigger will adjust the state of the square to misfire when the timeline starts if the value of the associated variable is equal to 0, as pictured below. This trigger will ensure that when a learner responds incorrectly, they will see the crosshair icon we created earlier. This next slide trigger will do the opposite: show the explosion icon when the learner responds correctly. It’s set up in almost exactly the same way, but this time you’ll have it adjust the state of the square to hit when the timeline starts if the value of the associated variable is equal to 2, as you can see below. The third slide trigger is optional. If you do set it up, then when the learner responds incorrectly, not only will they not hit their enemy’s ship but their enemy will hit their ship. In order to make this happen, you’ll have to link each enemy square with a ship on it to one of the learner’s squares with a ship on it. To do this, take out your list once again. You could just link the ships in the order they are written on your list, or you could randomize, like I did. It’s completely up to you. This is how I did it: Once I decided which squares to link, I duplicated the first slide trigger and changed the state to misfire, changed the object reference from A2 to X3, and changed the state to hit, as you can see in the screenshot below. Now when the learner answers incorrectly, they’ll see a crosshair on one of their enemy’s ships and an explosion on one of their ships. Phew! Your gameboard is set up. Time to select all of the ships, then right-click and select Send to Back to ensure that the states on the squares appear on top of the ships instead of underneath them. Since the squares on the learner’s grid are transparent, they can still see their ships, while the enemy squares have a fill, so their ships are hidden until the learner uncovers them. Last but not least,change the slide properties to "resume saved state" so that when the learner comes back to the gameboard after answering a question, the state changes remain intact. 8. Set Up Results Slide Next, insert a graded results slide. Make sure all of the questions in your project are selected and adjust the passing score. For my quiz, I chose 62% because I wanted the learner to have to get five out of eight questions correct to pass. For my results slide, I unchecked the “show passing score” and “review quiz” options and selected the “retry quiz” option. I only wanted the points to show, not the percentage, so I deleted the score percent variable reference, leaving only the score points variable reference. Then I deleted all of the text labels on the base layer and the success layers, inserted my own, and adjusted the layout. Then I created a true/false variable with a default value of false; this allows me to reset my gameboard if the learner wants to try again. I then added a trigger to the retry button to change the value of this variable to true when the user clicks. I also added a trigger to reset the value of each of the other custom variables to 1, so that the states on my gameboard squares will work as they did the first time around. Remember, you can use the copy/paste trigger icon to do this more quickly. If you use that method, then all you have to do is select the appropriate variable from the drop-down menu. Once you’ve added all of the triggers, you’ll want to adjust the “jump to” trigger so that it takes the learner back to the gameboard. You’ll also want to make sure that this trigger is the last trigger in the list. If it isn’t the last one in the list, the learner will be brought to the gameboard prematurely, before all of the variables are adjusted, as the triggers are executed in order from top to bottom. If that happens, the gameboard won’t be reset when they arrive. 9. Add “Game Over” Message Now it’s time to add a layer on your gameboard to let learners know when they have found all of the enemy’s ships. On my layer, I’ve added a rectangle to cover the text on the base layer, some explanations and instructions for the learner, a button to take them to the results page, and an arrow to draw attention to the button. On my button, I’ve added a trigger to hide the layer and jump to the results slide when they click. That way, if they decide to try again, this layer will not appear when they return to the gameboard. Back on the base layer, add a slide trigger to show the layer when the states of all of the enemy squares with ships underneath are not equal to normal. That way, once the learner has clicked on all of them (meaning the states are now either hit or misfire), the “game over” layer will appear. 10. Finalize Gameboard Reset Almost there! To force the enemy squares to reset, add a slide trigger changing the state of all of the enemy squares (with and without ships on them) and all of the learner squares with ships on them to normal if the value of the retry variable is equal to true. That way, if the learner decides to give it another try, the gameboard will be blank. The last step is to add a slide trigger to change the retry variable back to false, so the gameboard doesn’t continue to reset itself each time the learner answers a question and comes back to the gameboard. Make sure that this trigger is the last in the list of triggers, just before the list of object triggers. Otherwise, the value of the retry variable will be changed to false too early, and the board will not reset correctly. And there you have it: your very own e-learning battleship game! I hope you had as much fun creating it as I did. Pat yourself on the back; your learners are going to love it. If you liked this example but don’t have time to build it yourself, no problem! We’ve made it available for free: download here. Did this article light your fire for gamification? Check out this series of articles, examples, and downloads for all the gamification tips and inspiration you’ll ever need. Want to try something you learned here, but don’t have Articulate software? Download a free 30-day trial, and come back to E-Learning Heroes regularly for more helpful advice on everything related to e-learning.129Views0likes79CommentsHow I Made This Custom Locked Menu in Storyline 360
One of the things I love about Storyline 360 is that it’s so easy to create a completely custom learning experience for your learners. While I’m a proponent of allowing learners to move through their courses freely, I get that some projects warrant locked navigation—like compliance training. Since compliance courses make up such a significant portion of e-learning projects, I field a lot of questions about how to make a custom locked menu—like the one in this example: Click to view the interactive version. There are several different ways to do this in Storyline 360, but I thought I’d show you my go-to method in this tutorial. Let’s get started! 1. Build Out Course Structure Start by inserting your menu slide and at least the first slide of each section. This will allow you to set up your branching on your menu slide. Here’s a tutorial that walks you through this process: Adding New Slides. 2. Add Buttons to Menu Slide On your menu slide, insert the objects that will serve as your buttons. You can use the prebuilt buttons if you’d like, or you can use shapes or even images. It’s up to you! In this example, I’ve simply inserted some rectangles. 3. Add States to Buttons One advantage of using the prebuilt buttons is that they’ve already got some prebuilt states, as shown in the screenshot below. If you choose to use shapes or images, like I have here, you’ll need to add your own states. That being said, if you plan on customizing the formatting anyway, it really doesn’t take much more time to create your own states. If you’ve never worked with states in Storyline 360, check out this tutorial: Adding and Editing States. For this example, you’ll want to create these three states in addition to the default Normal state: Hover, Disabled, and Visited. You can format them however you’d like. Here’s what my states look like: If you’re curious, this is how I formatted my states and why: Hover: I made the fill color lighter and brighter so it’d stand out when the mouse hovers over the button. Disabled: I added some transparency to the button for my Disabled state based on the advice in this article: Why You Shouldn’t Gray Out Disabled Buttons. To make it extra clear that those buttons aren’t clickable yet, I added a lock icon. Visited: I chose a darker fill color here so that the Normal state would stand out, making it obvious which button the learner should click next. I also added a checkbox icon to make it clear that the learner has already visited this chapter. 4. Disable Buttons 2 and Up by Default To lock your buttons, the first thing you’ll want to do is set the default state for all the buttons except the first one to Disabled. To do that, simply select the button, open the States tab, and choose Disabled from the Initial State drop-down list, as shown below: Once you’ve done that for all your buttons, you should see the initial states appear on your slide, like in the screenshot below: 5. Add “Jump To” Triggers to Buttons Next, go ahead and add triggers to your buttons so that they jump to the appropriate slides when the user clicks. If you’re new to triggers, check out this tutorial: Working with Triggers. When you’re done, your trigger panel should look something like this: 5. Add “State Change” Triggers to Buttons Now you’ll need to create another trigger for each button, except the first one, to change the state from Disabled to Normal after the learner has viewed the previous section. Take a look at what my trigger for Section 02 looks like below: I’ve set it up so that the state of my Section 02 button changes to Normal when the timeline starts on my menu slide if the state of my Section 01 button is Visited AND the state of my Section 02 button is NOT Visited. This second condition is important, because otherwise when you get back to the menu slide after viewing Section 02, the Normal state will appear instead of the Visited state. And that’s not what we want! For each subsequent button, you’ll need to add an additional condition, to make sure that all the preceding buttons are Visited before the state changes to Normal. Take a look at the trigger for my Section 03 button to see what I mean: This time I’ve added three conditions: If the state of Section 01 is Visited If the state of Section 02 is Visited, and If the state of Section 03 is NOT Visited You’ll want to do the same for the rest of your buttons. So for the Section 04 button, you’d have four conditions, for the Section 05 button you’d have five conditions, and so on. 6. Adjust Prev/Next Button Settings To make sure your learner doesn’t get lost or confused, you’ll want to adjust the settings of your Previous and Next buttons. You’ll find those options in the Slide Properties. Find out how to access those here: Accessing Slide Properties. On the menu slide, I’ve gone ahead and hidden those buttons, since I want learners to use the buttons I’ve built on the screen to jump to the appropriate sections. I also decided to hide the Previous button on the first slide in each section since I don’t want learners to be able to go back to the menu without viewing the entire section. Finally, I changed the “Jump To” trigger on the next button on the last slide in each section so that it leads back to the menu slide. If you’d like, you can stop here. You’ve got a fully-functional locking menu; hooray! However, in my example I took it one step further. 7. Add Exit Layer to Menu Slide (Optional) To give my example a clear ending, I added a layer to the menu slide and set it to appear when the learner has viewed all the sections in my course. If you’ve never used layers, check out this tutorial: Working with Layers. This is what the trigger on my Exit layer looks like: On my exit layer, I decided to add a couple of buttons to allow learners to exit the course, go back and review the sections in any order, or restart the course, which will lock the navigation like it was when they took the course the first time. It’s entirely up to you which (if any) of these options you include! In Sum So there you have it! That’s my go-to technique for creating a custom, locked menu in Storyline 360. Do you have another technique for creating a personalized locked menu in Storyline 360? Feel free to share your tips below! And if you’re short on time, pop on over here to download my file. If you get stuck while following along with this tutorial, let me know by leaving a comment below. And be sure to 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.135Views0likes30CommentsHow 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.219Views0likes20CommentsHow to Build This Feelings Slider Interaction
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 slider interaction to give them time to pause and think about it. In this article, I’ll show you how to do that step by step. 1. Insert Icons Start by inserting a blank slide and adding icons that represent your learner’s emotions. I used these emoji icons, but you could insert other icons from Content Library 360, grab some from the Downloads hub here on E-Learning Heroes, or even create your own directly in Storyline 360 using shapes. 2. Add States For each icon, add a custom state—which you can call Highlight, for example—and change the formatting so it looks visually different. In this example, I added a rectangle underneath the selected emoji. 3. Set Initial State Set the initial state for the icon you want to appear when the slide starts to Highlight. In this example, I chose to show the middle icon first, but it’s up to you to decide what makes the most sense. 4. Insert Slider Open the Insert tab, select the slider you want to insert, and format it as needed to match the design of your course. If you like the style of the slider I used here, grab this button set from the Downloads hub to skip the formatting step. 5. Set Slider Properties Select the slider to open the Design tab and adjust the properties depending on the number of stops you need. Since there are five emojis here and I wanted the middle one to appear selected first, I set the initial step to 2 and the end value to 4. Before moving on to the next step, head over to the Update dropdown and choose While Slider Is Dragged so the slider value updates as the learner moves it. 6. Add Triggers Finally, add two triggers to each icon to change the state of the objects when they’re selected. Trigger 1 Action: Change State of Object: Icon State: Highlight (choose the name of your custom state) When: Slider Moves Conditions: If the slider value is equal to (step number) Trigger 2 Action: Change State of Object: Icon State: Highlight (choose the name of your custom state) When: Slider Moves Conditions: If the slider value is not equal to (step number) Wrap-Up And you’re all set! In just a few minutes, you’ve created an interaction that’ll help your learners take a step back and reflect on how they’re feeling. Explore the finished project and download the template here. Want to learn 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’re interested in seeing 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 feelings slider, 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.91Views0likes0CommentsHow 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.121Views0likes0Comments3 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.106Views0likes0Comments