What do E-Learning Designers Need to Know About Working with SMEs? #474
Working with E-Learning SMEs#474: Challenge | Recap When it comes to building courses, your Subject Matter Experts (SMEs) hold the keys to your success—you can’t do much without them. They’re the folks who not only bring their expertise to the table but also help you fine-tune those storyboards and quizzes and break down the intricate processes that make your training actually work. But here’s the catch: if they’re not fully on board or are dragging their feet, they can quickly become a major headache. The trick is figuring out how to turn those challenging SMEs into your biggest allies. And that's this week’s challenge is all about! 🏆 Challenge of the Week This week’s challenge is to share a short demo or interaction that helps e-learning designers collaborate more effectively with their SMEs. You can take it in any direction you like—whether it’s creating a slide with your favorite quote about working with SMEs, building a microlearning course, or even a whack-a-mole game (SME Edition). ✨ 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 sharing your favorite tips for working with SMEs, take a look at the final examples from the e-learning game show series: E-Learning Quiz GamesRECAP#473:Challenge|Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article.3.3KViews0likes86CommentsE-Learning Games Inspired by Popular TV Quiz Shows #473
Share Your E-Learning Quiz Games#473: Challenge | Recap Welcome to the final round of our four-week e-learning game challenge! You’ve done the heavy lifting—mapped out your design concepts, built your working prototypes, and taken in all that feedback. Now, it’s time to come on down and show off your final game example. 🏆 Challenge of the Week This week, your challenge is to share an e-learning game inspired by popular TV quiz shows. 🙏 If you’ve been following along with this four-part challenge series, please include links to your previous examples for each week. This will help me pull together a great recap of the series. Week 1:Concept & Storyboarding Week 2:Design & Prototyping Week 3: Development & Review Week 4: Final Testing & Project Submission Goal: Complete and share your final project Deliverables: Add the final touches, animations, and advanced interactions Incorporate any feedback you received Test your game for bugs, usability, and accessibility Share a link to your final project 🎁 BONUS: Share a quick write-up about your projects in the community. Talk about what you learned, how you used feedback, or how your project evolved over the four weeks. Anything you think would be helpful or interesting is welcome! 🚨 NOTE: And don’t worry if you didn’t join the earlier challenges—you’re still welcome to participate this week. Ideally, you’d complete all four weeks, but any contribution is appreciated! 📋 FEEDBACK: I really want to hear what you thought about this challenge.You’re welcome to answer as many or as few questions as you’d like, and you can share as much or as little as you feel comfortable with. If you prefer, you can submit your responses anonymously. Share your feedback 🙌 Last Week’s Challenge: Before you submit your final design, take a look at the functional examples your fellow game-show challengers shared over the past week: Game Design: Development & ReviewRECAP#472:Challenge|Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article.798Views0likes45CommentsE-Learning Game Design: Development & Review #472
Game Design: Development & Review#472: Challenge | Recap Welcome to the third week of our e-learning game design challenge. Last week, you built a working prototype from your storyboard or design concept. This week, you’ll focus on bringing the core elements of the e-learning game together to create a detailed and functional model. Your game should be far enough along to submit for final QA and testing. 🏆 Challenge of the Week This week, your challenge is to share a fully developed version of the game that incorporates all designed elements, interactive features, animations, and multimedia components. Optional: Since this is our last week of development before submitting the final project, let a few friends or fellow challengers play your game and gather feedback in Review 360. It’s the best way to spot any problems and see what people like or don’t like. I know many of you have been gathering feedback all along, but I’d like to highlight the testing and review process this week. Week 1: Concept & Storyboarding Week 2: Design & Prototyping Week 3: Development & Review Goal: Develop a detailed and functional version of your game Deliverables: Apply and refine the visual design elements Integrate the interactive elements, animations, and multimedia components Refine the visual design and user interface to enhance the overall user experience Submit to Review 360 for user testing and feedback (optional but encouraged) Share a link to your project Week 4: Final Testing & Project Submission 🚨 NOTE: Even if you didn’t participate last week, you’re still welcome to join this week’s challenge. Ideally, you’ll complete all four weeks, but any participation is appreciated. Share what you can. 🙌 Last Week’s Challenge: Before you complete your game design, check out the interactive prototypes your fellow challengers shared over the past week: Interactive Prototypes in E-Learning RECAP #471: Challenge | Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article. 📆 Upcoming Challenges Challenge #473(08.09): Week 4: Final Testing & Project Submission399Views0likes38CommentsBuilding E-Learning Games: Concept & Storyboard #470
Game Show Design: Storyboards#470: Challenge | Recap How in the world did you build that? A common challenge for new course designers is seeing polished e-learning projects and having no clue how they came together. I hear from folks all the time that they want to do the weekly challenges, but it feels too advanced for beginners. So, for this challenge, we're going to pump the brakes and spread the build over four weeks. We’ll follow a linear development model so we can really dig into and focus on common development steps. I realize experienced designers will prefer a more iterative approach for real-world projects. And that's fair. But using a progressive, step-by-step approach should help new users follow the evolution of an e-learning challenge project from concept to deliverable. Plus, it gives us something tangible to show each week. Week 1: The Concept & Visual Storyboard This first week, we’ll focus on the initial game show theme or concept. Your task will be to create a wireframe, flowchart, or visual storyboard that captures the flow of your game. For new users, this helps you work intentionally through your ideas before jumping into development. And for you pros, this might seem like extra work, but slowing it down will help others visualize how polished interactions come together. Here’s a breakdown of the four-week schedule: Week 1: Concept & Storyboarding Week 2: Prototype Development Week 3: Development & Review Week 4: Final Testing & Project Submission 🏆 Challenge of the Week This week, your challenge is to develop an e-learning game show concept and present a visual, non-interactive storyboard or flowchart of your game’s mechanics and visual elements. You can either create something new or take an old project and break it down with us over the four weeks. This way, everyone can see how it all comes together. Week 1: Concept & Storyboarding Goal: Choose a game show concept and design theme Deliverables: Choose a game show concept, theme and design style Create a visual storyboard, flowchart, or static mock-up of the game Share a link to your static design concept Week 2: Design & Prototyping Week 3: Production & Development Week 4: Final Testing & Project Submission ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a newthreadand 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#ELHChallengeso your tweeps can follow your e-learning coolness. 🙌 Last Week’s Challenge: Before you get started on this week’s design concept, check out last week’s examples to see what e-learning designers do and how they got started in the industry. What Instructional Designers DoRECAP#469:Challenge|Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article. 📆 Upcoming Challenges Challenge #471 (07.26): Week 2: Prototype Development Challenge #472 (08.02): Week 3: Production & Development Challenge #473 (08.09): Week 4: Final Testing & Project Submission399Views0likes51CommentsHow 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 newthreadand 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#ELHChallengeso 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? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article.200Views0likes136CommentsBuilding a Working Prototype for Your E-Learning Game Concept #471
Interactive Prototypes in E-Learning#471: Challenge | Recap Welcome back to part two of our e-learning game design challenge. Last week, you laid the groundwork with your design concepts and visual storyboards. Now, it’s time to bring those ideas to life with functional prototypes. This week, you’ll build a working model to test your game’s functionalities and interactive components. Your example should give us a clear preview of your game's key features and gameplay interactions. 🏆 Challenge of the Week This week, your challenge is to build an interactiveprototype to test specific functionalities or components. The goal is to create a functional version of your game that you can test and refine over the next two weeks. Think of this as the halfway point between the design concepts you created last week and the final version of your project. Don’t worry about making this version of your game perfect. You’re only creating a working model of your project. Keep it simple, focus on the essentials, and let us know if you need help or have any issues. Week 1: Concept & Storyboarding Week 2: Prototype Development Goal: Build a working prototype of your game Deliverables: Create a rough prototype of the game with basic interactions and navigation Build the basic game functionality with questions, scoring, and feedback Focus on core interactions and basic navigation Submit to Review 360 to gather initial feedback (optional) Week 3: Development & Review Week 4:Final Testing & Project Submission ✨ Share Your E-Learning Work Comments: Use the comments section below to link your published example and blog post. Forums: Start a newthreadand 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#ELHChallengeso your tweeps can follow your e-learning coolness. 🙌 Last Week’s Challenge: Before you move from concept to prototype, check out the storyboard ideas your fellow challengers shared over the past week: Game Show Design: Storyboards RECAP #470: Challenge | Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article. 📆 Upcoming Challenges Challenge #472(08.02): Week 3: Production & Development Challenge #473(08.09): Week 4: Final Testing & Project Submission199Views0likes49CommentsUsing Glassmorphism Designs in E-Learning Course Development #310
Glassmorphism Design in E-Learning#310:Challenge|Recap It's a new year, and that means new design trends. In a recent challenge, we looked usingthe2021 Pantone Color of the Year in e-learning design. If you haven't checked out the examples, stop what you're doing and check them out. The color of the yearis abig deal because it will influence design, fashion, home interior, and consumer product trends in the upcoming year. 2021 E-Learning Design Trends This week, we're looking at how course creatorscan use the frosted glass effect, known as glassmorphism, in their e-learning designs. Glassmorphism is a design conceptthat’s been around for a while. Variations of the effect have been used in iOS 7 and Mac OS Big Sur. The effect is created by layering gradient or blurred backgrounds and semi-transparent shapes and panels. Here's an example: Courses Dashboard by Rudi Hartono Applying Glassmorphism Effects to E-LearningTemplates If you’re looking for a place to start, try working with an existing course or template you’ve already built. This way, your content is already in place, and you’re free to focus on the design elements. Here’s a quick before and after for the Serenity template. To create the blurred background effect, I started in PowerPoint and went to Format Picture > Artistic Effects > Blur. Depending on the image you use, you might need to apply another round of blur to the image. To apply a second blur effect, save your image as a picture. Saving the image flattens the blur effect. Insert the blurred image back into PowerPoint and repeat the process. I think the effect turned out pretty well, but I would still like to play with different layouts and panels before considering this a final design concept. Challenge of the Week This week, your challenge is to share an example demonstrating how glassmorphism can be used in e-learning. Your example can be interactive or a screenshot. We want to see how this design trend can be used in course design. Resources Here are some good examples of glassmorphism to give you an idea how the design effect is being used in UI design. Glassmorphism designs and examples on Dribbble Frosted glass examples on Dribbble Glassmorphism in user interfaces 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 dive into this week’s challenge, check out the interactive aircraft safety cards your fellow community members shared over the past week: Interactive Passenger Safety Cards #309: 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.198Views0likes147CommentsMoving Beyond E-Learning's Next Button #462
Beyond the E-Learning Next Button#462: Challenge | Recap The “Next” button often gets a bad rap in e-learning. It’s commonly associated with linear, information-heavy courses that promote passive learning, leading learners to click through screens without truly engaging with the content. To be fair, the blame doesn’t lie with the Next button itself. Blaming the Next button for boring e-learning is like blaming the Play button for a boring video. For course designers, a good design exercise is to reimagine course navigation without relying on the ubiquitous next button. How would your learners navigate forward and backward? Can you integrate the course content into the navigation? Can interactive objects like sliders, dials, or text-entry fields be used in place of next and back buttons? 🏆 Challenge of the Week This week, your challenge is to show alternatives to using the next button. You can create something new or rework an existing project. Please include the original with your entry if you modify an existing project. Seeing both examples will help users connect the dots between where you started and where you finished. And if you have time, create multiple variations to show how clicks, slides, hovers, drags, and typing can advance learners through the course. 🧰 Resources Check out e-learning challenge #144’s examples to get an idea of what designers came up with in a related challenge. Slide, Drag, and Hover Past the Next Button #144: Challenge | Recap Using Circle Menus in E-Learning #406: Challenge | Recap Interactive Documents with Sliders #300: Challenge | Recap ✨ 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 slide into this week’s challenge, check out the audio interviews your fellow challengers recorded in last week’s challenge: Interviews with E-Learning ChallengersRECAP#461:Challenge|Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the weekly e-learning challenges in thisQ&A post. 📆 Upcoming Challenges Challenge #463 (05.24): Using progressive disclosure in e-learning. Challenge #464 (05.31): Labeled graphics and interactive markers 🚨 2024 Articulate User Conference Call for Proposals We’re now accepting proposals for this year’s in-person user day conference co-hosted at DevLearn in Las Vegas.Learn more about the proposal process.109Views0likes111CommentsHow Are Designers Using Toggle Buttons in E-Learning? #460
Toggle Buttons in E-Learning#460: Challenge | Recap 🏆 Challenge of the Week This week, your challenge is to share an example that shows how toggle buttons and switches can be used in e-learning. You can create a simple example using normal and selected states with button sets or build something more advanced using variables. Let us know if you get stuck or need help with your project. 🧰 Resources E-Learning Challenge #97: 35+ Wicked Toggle Button Effects for E-Learning Designers Video tutorial: Here's how you can create a toggle button effect using Storyline's ✨ 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 switch to this week’s challenge, check out the creative ways your fellow course designers use photo collages to create interactions: Interactive Photo Collage ExamplesRECAP#459:Challenge|Recap 👋 New to the E-Learning Challenges? Theweekly e-learning challengesare ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of theprevious challengesanytime you want. I’ll update the recap posts to include your demos. Learn more about the challenges in thisQ&A postand why and how to participate in thishelpful article. 📆 Upcoming Challenges Challenge #461(05.10): Interactive Podcasts. SeeELC364for a related challenge. This time, the questions will focus on the value of working out loud, weekly challenges, and growing your skills. Challenge #462(05.17): Click. Hover. Drag. SeeELC144for a general idea of what we're doing. 🚨2024 Articulate User Conference Call for Proposals We’re now accepting proposals for this year’s in-person user day conference co-hosted at DevLearn in Las Vegas.Learn more about the proposal process.99Views0likes80CommentsUsing JavaScript and Articulate Storyline #132
Using JavaScript with Articulate Storyline #132:Challenge|Recap Extend Your E-Learning Development Skills with JavaScript In a recent screencast challenge, we looked at using variables in e-learning. Since most course designers don’t work with variables, it was a good opportunity to learn how variables can be used to create more dynamic and personalized learning experiences. Another way to create dynamic courses is by using JavaScript, which is a scripting language that allows users to interact with web pages. Events like hovering, clicking, and typing can execute JavaScript to trigger an action. In Articulate Storyline, this is all handled for you with built-in triggers. You don’t need to know a thing about JavaScript to build advanced courses. But Storyline is designed to grow with you. If you look down the list of triggers, you’ll find one dedicated to executing JavaScript. Keep in mind that you do not need to learn JavaScript to create highly interactive projects in Storyline. Storyline’s states, triggers, and layers are all you need to create Guru-worthy projects. Challenge of the Week This week, your challenge is to share a Storyline example that features JavaScript. You don’t need to build anything complicated or overly technical. Instead, focus on learning how to insert JavaScript and make something happen. JavaScript isn’t the easiest thing to learn. If your project doesn’t work as intended, don’t sweat it. I’ll still feature your work in the recap. Finally, keep in mind that Articulate doesn’t provide support for using JavaScript. If you run into any sticking points this week, please post your questions in the Building Better Courses forums. If the community can help, they will. JavaScript Examples from the Articulate Community The Articulate community has shared some amazing examples, source files, and tutorials that can help you get started. Feel free to use any of the Storyline-JavaScript downloads as the starting point for your project. Zsolt Olah Zsolt Olah comes up with some highly creative ways to include JavaScript with Storyline. He also does a fantastic job of writing about his projects. Here are some articles, demos, and tutorials that will help you get started working with JavaScript in Storyline: JavaScript & Storyline Keep Your Head in the Game: Advanced Storyline Voice Recognition Experiment Storyline Communication with a Web Server How did I make the gamified video interview challenge? QR Code Generator Full Control Over YouTube Videos in Storyline Storyline Variables for Non Coders Storyline Variables and JavaScript JavaScript And Storyline: Time Saver Hook them! JavaScript and Storyline to engage learners! Melissa Milloway Every time I open Twitter, it seems Melissa Milloway has posted another advanced idea for blending programming languages with Storyline. Here are a few of my favorites: 5 ideas on using JavaScript to change background color in Storyline E-Learning and Retro Games Sample Gamify your next e-learning project's background with this trick Aman Vohra If you follow the weekly challenges, you know Aman Vohra is someone who likes to share advanced ways to push Storyline’s limits. Here are a few of Aman’s examples that feature JavaScript: Adding a Live Chat Box to Your Course Weather App in Storyline 2 Leaderboard example in Articulate Storyline Kristin Anthony Kristin Anthony shared some super-cool projects that feature JavaScript and Storyline. Check out her posts below because she does a great job of writing about her development process. A Medical Demo and a bit of Coding, too! GDS Challenge No. 2: Zombie Acme U Storyline+JavaScript Source Files Storyline 2: L&D Title Generator By Trina Rimmer Storyline 2: Word Count JavaScript By Phil Mayor Storyline 2: Controlling Variables from JavaScript By Zsolt Olah Resources Product support articles JavaScript Best Practices and Examples Articulate Support resources for Storyline and JavaScript Last Week’s Challenge: Before you geek out on this week’s e-learning challenge, take a look at the blurred background designs your fellow community members shared over the past week: Blurred Backgrounds in E-Learning RECAP #131: Challenge | Recap Wishing you a JavaScriptastic week, E-Learning Heroes! New to the E-Learning Challenges? The weekly 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.99Views0likes313Comments