Designing Office Exploration Interactions for E-Learning #528
This week’s challenge is to build an interactive office exploration that lets learners click different parts of an office photo or illustration to reveal information. Think of it like a virtual office tour where learners can choose the areas of interest to explore and dig into the details to learn more.Simulating Real-World Activities with Drag-and-Drop Interactions #380
Drag-and-Drop Practice Activities #380: Challenge | Recap Drag-and-drop interactions are a great way to allow learners to practice new tasks or processes—in a realistic way. While drag-and-drop interactions are often used as quizzes with common “Correct/Incorrect” feedback. But there’s so much more you can do with freeform drag-and-drops to encourage learners to practice new skills and interact with your content. Let’s take a look at a couple of examples. Tea Time This example from Kimberly Bourque Valliere is a good example that uses drag-and-drop to demonstrate how to make the perfect cup of tea. View the example | Kimberly Bourque Valliere 6 Ways to Customize Storyline360 Drag-and-Drop Interactions View on YouTube Challenge of the Week This week, your challenge is to create a drag-drop example that lets learners practice a real world activity. You can share a previous example or create a new one for this week’s drag-and-drop challenge. Share Your E-Learning Work Comments: Use the comments section below to share a link to your published example and blog post. Forums: Start your own thread and share a link to your published example.. Personal blog: If you have a blog, please consider writing about your challenges. We’ll link back to your posts so the great work you’re sharing gets even more exposure. Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness. Last Week’s Challenge: Before you drop into this week’s challenge, check out the virtual tour examples your fellow community members shared over the past week: Virtual Tours in E-Learning RECAP #379: Challenge | Recap New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. Show Off Your Articulate 360 Projects at DevLearn DemoFest If you’re planning to attend DevLearn, I hope you’ll consider sharing one of your E-Learning Challenge projects at DemoFest. DemoFest is an excellent way to showcase your project with the e-learning community. You’ll also get to see a wide variety of projects and talk to the designers and developers about how they built them. It’s like a year’s worth of E-Learning Challenge demos in one event. DemoFest project submission deadline is July 29 There’s $200 discount if you register by July 22 You can learn more about the conference and DemoFest on the DevLearn website. I hope to see you there.Using Tabs Interactions in E-Learning #448
Using Tabs Interactions in E-Learning #448: Challenge | Recap Tabs interactions are one of the most popular features in e-learning. They are very flexible and can be designed in many different ways. Tabs are popular because they let learners explore groups of content without leaving the current slide. There is no need to jump around between different slides or scenes. 2022 tabs examples | 2023 tabs examples If you are new to e-learning or just starting with Articulate Storyline 360, tabs interactions are a great way to learn the basics. You will get to know slides, states, layers, and triggers while building something fun. We use tabs-style activities all the time in our workshops, webinars, and tutorials. They are simple, flexible, and very effective. This week’s challenge is all about creating your own tabs interaction. 🏆 Challenge of the Week This week, your challenge is to share an example that shows how tabs interactions can help organize and group related content in e-learning. Share Your Project Files! It’s no secret community members love freebies! It’s also no secret that the challenges are one of the most visible ways course designers get their work in front of the community. If you’re up for it, please consider including a download along with your example this week. E-Learning Challenges Creating Tabs Interactions in E-Learning #401: Challenge | Recap Webinars How to Build Tabs Interactions in Storyline 360 ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a new thread and share a link to your published example. Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure. Social media: If you share your demos on x or LinkedIn, try using #ElearningChallenge so your peeps can follow your e-learning coolness. 🙌 Last Week’s Challenge: Before you get started on this week’s tabs interaction, check out the creative examples from last week’s spotlight masking challenge: Draggable Spotlights in E-Learning RECAP #447: Challenge | Recap 👋 New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. 📅 Next Week’s Challenge Challenge #449 (02.09): Emphasis animations. You've been asking for this, and now it's here! Show us how you're pulsing, shaking, teetering your slide objects to life. Challenge #450 (02.16): Using Themes, Templates, & Slide Masters. Another basics challenge, only this week we're looking at under-the-hood features to help us work faster in Storyline 360 and PowerPoint. Rise 360 users can show their before-after examples using themes and block templates. Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback: https://bit.ly/ElearningChallengeForm.How are You Using Drag-and-Drop Interactions in E-Learning? #468
Using Drag-and-Drop in E-Learning #468: Challenge | Recap If there’s one e-learning interaction that belongs in every instructional designer’s toolkit, it’s drag-and-drops. Drag-and-drop interactions are a fun way to engage learners and encourage them to interact with the screen. They’re also one of the most flexible interactions you can create. So, whether you’re designing straightforward question slides or custom freeform slides, drag-and-drop interactions are one of the best ways to get learners to stop, think, and interact with the content. And that’s what this week’s challenge is all about. 🏆 Challenge of the Week This week, your challenge is to share a drag-and-drop interaction to show how they can be used in e-learning. You can use any authoring tool you like and make it as simple or custom as you have time for. Note: Since Storyline’s drag-and-drop interactions aren’t currently keyboard accessible, they can create serious barriers for learners who rely on keyboard navigation or use screen readers. Check out the following on-demand training for some ideas on creating accessible drag-and-drops: How to Create an Accessible Drag-and-Drop Interaction in Storyline 360 🧰 Resources User Guide Storyline 360: Drag-and-Drop Questions Related Challenges: Drag-and-Drop Practice Activities #380: Challenge | Recap Drag-and-Drop Sorting Activities #439: Challenge | Recap Webinars: How to Build Drag-and-Drop Interactions in Storyline 360 5 Ways to Customize Drag-and-Drop Interactions 6 Ways to Customize Drag-and-Drop in Storyline 360 Discover six creative techniques every course designer needs to know to customize their drag-and-drop interactions in Articulate Storyline 360 View on YouTube ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a new thread and share a link to your published example. Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure. Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness. 🙌 Last Week’s Challenge: While you're dragging through the ideas for this week's challenge, check out the 360° image interactions your fellow challengers shared over the past week: Using 360° Images in E-Learning RECAP #467: Challenge | Recap 👋 New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article.Using Interactive Calculators in E-Learning #430
Financial Calculators in E-Learning #430: Challenge | Recap Using variables to capture and display a learner’s name is one of the most common ways to practice working with text variables. When you’re learning number variables, there’s no better way to work with basic operations than to build a simple calculator. With Storyline variables, you can easily build simple or complex equations right into your project. And that’s what this week’s challenge is all about! Calculator Example Check out David Charney’s calculator, which lets learners perform math and calculations right in your project. View the example | Download Square Root Calculator Check out three ways to calculate square roots in Storyline in this dynamic example by Alphonso Hendricks. View the example | Download Simple Calculator Go old school with a classic example by Dave Mozealous. It’s the first fully-functional calculator created in Storyline, and shows you that the sky’s the limit with variables! View the example | Download Resources Storyline 360: Working with Variables Storyline 360: Adding Variable References Storyline: What "Object Loses Focus" Means E-Learning Challenges Use Learner's Name in E-Learning Course #222: Challenge | Recap Using True/False Variables in E-Learning #271: Challenge | Recap Using Variables to Compare Learner's Answers #292: Challenge | Recap Random Number Variables in E-Learning #278: Challenge | Recap On-Demand Training Getting Started with Variables in Storyline 360 Using Number Variables in Storyline 360 Challenge of the Week This week, your challenge is to build a simple calculator that can be used in e-learning. New to variables? Try starting with one of the free calculator templates below. Depending on your comfort level, you can redesign one of the calculator templates or use it as a guide for creating your example. Comfortable working with variables? Try adding multiple variables, sliders, and interactive elements to create a more advanced calculator. Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a new thread and share a link to your published example. Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure. Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness. Last Week’s Challenge: Before you budget time for this week’s challenge, check out the alt text examples your fellow community members shared over the past week: Using Alt Text in E-Learning RECAP #429: Challenge | Recap New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. Next Week’s Challenge Next week's challenge (9/8/23): Bullet Point Makeovers or Making Bullet Points More Engaging. Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback: https://bit.ly/ElearningChallengeForm.How Can You Use This Motion Path Tip in Your E-Learning Projects? #445
Using the 0px Motion Path Trick #445: Challenge | Recap Happy New Year, E-Learning Heroes This week's challenge is a bit off the beaten path compared to what we usually do. Instead of diving into a popular feature (sliders, dials, variables) or a common interaction (tabs, timeline, accordion), we're zooming in on a more unique, lesser-known use of a feature. Think of this as a sandbox challenge. Check out this example and see what I mean. Sugary Drinks by Annabelle Grew Why is this interesting? Aside from the creative concept and visual design, what really grabbed my attention here is the approach Annabelle took to put this whole project together. Typically, drag-and-drops are set up with just a fixed number of draggable objects, right? That's perfectly fine if you're dealing with, say, under ten items. But here's where it gets juicy: imagine you've got dozens of objects, and you want them all to be draggable. Now, the standard move would be to create individual objects for each drag item. But let's face it, this method works, but it can make editing and managing the slide a real challenge. That's why knowing your tools can really help save you time and work quicker. How does it work? There's only one drag object in the project. The drag cube has a motion path with a length of 0 px and a duration of .10 seconds. Each time the sugar cube is dropped on the target, the trigger tells the sugar cube to move its motion path. Because the motion path is set to 0 px, it resets the sugar cube to its default starting position of the sugar cube. Brilliant, right? It's not just about what you create but how you create it that can make all the difference. And that's what this week's e-learning challenge is all about! 🏆 Challenge of the Week This week, your challenge is to share an example that uses the 0px length motion path trick. You can recreate an existing example or play with ideas that show potential uses for this technique. Two More Examples Reset an Object's Position In this example, Ron used the 0 px motion path in a way that's not just about duplicating objects. Instead, it's used to play multiple audio clips from multiple objects. The 0 px motion path resets the object's position after the learner drops the object on a single target. Ron's got a detailed forum post where he breaks down how he built his project. Casualty Incident Response by Ron Katz Drag-and-Drop RAID Storage Calculator I put together this example nearly five years back, right around the time we kicked off our online webinars. I've always been a fan of Drobo and especially liked their interactive capacity calculator. The project file is available for download and if you want to see how it works. Drag-and-Drop RAID Storage Calculator Video Tutorial of the 0 px Motion Path Technique ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a new thread and share a link to your published example. Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure. Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness. 🙌 Last Year's Challenge: Before you tackle this week’s challenge, check out the colorful examples your fellow challengers shared in last year’s Pantone Color challenge: Pantone Color of the Year 2024 RECAP #444: Challenge | Recap 👋 New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback: https://bit.ly/ElearningChallengeForm.Keep It or Trash It: Drag-and-Drop Sorting Activities #439
Drag-and-Drop Sorting Activities #439: Challenge | Recap Drag-and-drop sorting activities are a great way to evaluate learners' ability to identify items by dragging them to different drop targets. One of the most common versions of this activity is designed around whether items should be kept or discarded. Some popular versions of this popular interaction include: file it or trash it keep it or discard it healthy choice or unhealthy choice required or optional report it or ignore it A variation might include three options, where the third choice is for "optional information." Another variation could be a single drop target choice where users identify only the "keep it" or the "toss it" items. In either case, this common interaction should be in every course designer's toolkit. And that's what this week's challenge is all about. Let's look at a few examples. Comstar New Hire Orientation Here’s a drag-and-drop version that asks learners to identify permissible items for the workplace. Click here to view the example Creating Effective Meetings This is another version of the keep-it-or-toss-it interaction. In this example, learners are asked to identify required and optional items. Click here to view the example Giving Effective Reviews It’s not always necessary to include two drop targets. In this example, learners choose the necessary items by placing them into a folder graphic. The unnecessary items are left on the slide. Click here to view the example Animate Drag-and-Drop Items Storyline360 Learn how to apply exit animation effects to drag items after they're dropped on correct or incorrect targets. View on YouTube 🏆 Challenge of the Week This week, your challenge is to share an example of a keep-it-or-toss-it interaction. The examples above all focus on office and workplace topics. Feel free to apply this model to any industry or topic for your example. If you have extra time this week, consider sharing a few versions of your original interaction. For example, if your original demo uses drag-and-drop, try reworking your file to show how it could function as a text entry or click-and-reveal interaction. ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a new thread and share a link to your published example. Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts so your great work gets even more exposure. Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness. 📆 Last Week’s Challenge: Before you file (or trash) this week’s challenge, check out the creative ways course designers showcase their e-learning portfolios: E-Learning Portfolio Examples RECAP #438: Challenge | Recap 👋 New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article. 📅 Next Week’s Challenge Next week's challenge #440 (11/10): Retail fashion and clothing industry. I still need to find a proper title, but the general focus is choosing, pairing, and dressing for different occasions. Feel free to offer some title ideas. Got an idea for a challenge? Are you interested in doing a webinar showcasing how you made one or more challenge demos? Or do you have some comments for your humble challenge host? Use this anonymous form to share your feedback: https://bit.ly/ElearningChallengeForm.Using Tabs Interactions in E-Learning (2023) #401
Creating Tabs Interactions in E-Learning #401: Challenge | Recap Challenge of the Week This week, your challenge is to create a tabs interaction that includes at least three tabs and uses hover, selected, and visited states. Why do you post a tabs challenge every year? Are you running out of ideas? No. I'm not running out of challenge ideas. I post a tabs challenge every year because they're the most common e-learning interaction. And they're also a fantastic way for course designers of all levels to practice and grow their e-learning skills. Why are tabs interactions so common in e-learning? Learners: Tabs offer several benefits, such as: Organization: Tabs help structure large blocks of content into smaller sections, so learners remain on the current slide without having to jump away to new slides or scenes. Interactivity: Tabs are a simple way to make static content more interactive by giving more control to learners. Reduced cognitive load: By chunking content into smaller, more manageable sections, tabs interactions can help users focus on one piece of information at a time rather than taking in a large amount of information all at once. Course designers: Tabs offer ways to practice visual, interactive, and UX design skills, such as: Sketching, wireframing, or planning design ideas Graphic design (fonts, colors, layout, composition, hierarchy) Organizing and structuring content Usability and testing Interactive elements Storyline designers: Tabs are a fantastic way to develop a working knowledge of essential features such as: Creating and saving projects Choosing a slide size Working in slide view Working with layers, triggers, states, and slide properties Previewing and publishing projects How can beginners and experienced users benefit from this week's challenge? Beginners: If you're getting started with Storyline, try focusing on the alignment and positioning of slide objects before adding the triggers and layers. Then, work with the shape tools, formatting options, and alignment tools. Don't worry about making your tabs look good. Instead, focus on Storyline's workflow of adding states, layers, and triggers. Experienced: For experienced Storyline designers, consider adding conditions to create more advanced tabs interactions such as: Making something happen after the learner clicks all tabs. Revealing a hidden or disabled button after all tabs are visited. Make something happen when a slide layer's timeline reaches a cue point or the end. Animating the tabs or content layers to create. Share Your E-Learning Work Comments: Use the comments section below to share a link to your published example and blog post. Forums: Start your own thread and share a link to your published example.. Personal blog: If you have a blog, please consider writing about your challenges. We’ll link back to your posts so the great work you’re sharing gets even more exposure. Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness. Last Week’s Challenge: Before you get started on this week’s challenge, check out the creative ways course designers use TikTok-style videos in e-learning: TikTok-Style Videos in E-Learning RECAP #400: Challenge | Recap New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article.Custom Bookmarking and Conditional Navigation in E-Learning #390
Conditional Navigation in E-Learning #390: Challenge | Recap “How do I restrict navigation until one or more modules are viewed?” How do you lock navigation until the learner views all content in Storyline 360? This is a question that crops up time and again in the community. And for good reason. When you’re getting started in Storyline, you learn to use visited states to evaluate when all items on a slide have been clicked. This is easy and doesn’t require advanced triggers or variables because everything is happening on the same slide. But when you’re working across multiple slides and need to restrict navigation, you’re going to need variables. There are many ways to tackle this challenge. You can use text, number, or true/false variables. Whichever approach you take, this is a common task every Storyline designer should know how to do. And that’s what this week’s challenge is all about. Challenge of the Week This week, your challenge is to share a conditional navigation or bookmarking example to show how variables can be used to track learner progress. If you’re new to Storyline or haven’t worked with variables, you can still participate. Post your question in the community and let us know where you’re stuck, and we’ll help you out. Resources Article with tutorials: The Answer to the Community’s Number 1 E-Learning Question Webinar: Using True/False Variables in Storyline 360 Download: Custom Bookmark Menu Using Progress-Tracking Variables User Guide Storyline 360: Adding Variable References Storyline 360: Working with Variables Storyline 360: Adding Conditions to Triggers Share Your E-Learning Work Comments: Use the comments section below to share a link to your published example and blog post. Forums: Start your own thread and share a link to your published example.. Personal blog: If you have a blog, please consider writing about your challenges. We’ll link back to your posts so the great work you’re sharing gets even more exposure. Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness. Last Week’s Challenge: Before you navigate this week’s challenge, check out the new hire orientation and onboarding examples your fellow challengers shared over the past week: New Hire Training Examples RECAP #389: Challenge | Recap New to the E-Learning Challenges? The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in this Q&A post and why and how to participate in this helpful article.
