Using Interactive Dials as Draggable Menus in E-Learning #355
Using Interactive Dials for Navigation#355:Challenge|Recap Interactive knobs and dials are a great way to simulate real-world objects and tasks in your e-learning courses. To see how course designers use interactive dials, check out the examples in this challenge recap. But what happens when the dial uses a custom graphic or image and is scaled well beyond the slide size? Let’s take a look at a couple of examples. Dials as Draggable Menus In this example, the dial is filled with a custom image and scaled well beyond the slide size. This creates an excitingapproach to menu navigation. View the project | Joanna Kurpiewska Dials as Draggable Timeline Interactions Here’s another example using similar techniques. In this case, the custom dial is a circular timeline interaction that lets learners drag through a series of dates. View the example | Eric Chamberlin Challenge of the Week This week, your challenge is to share an example that shows how custom dials can be used fordraggablenavigation. Resources You can learn more about working with Storyline’s dials in the following articles and webinars. Storyline 360: Working with Dials How I Designed This Interactive Dial Matrix Using Dials to Design Interactive Infographics #261 Webinar: Using Dials in Storyline 360 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 dial into this week’s challenge, check out the colorful ways designers are using Pantone’s 2022 color of the year in e-learning: Pantone's 2022Color of the Year RECAP #354: 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.E-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 SubmissionUsing Accordion Interactions to Group Related Content in E-Learning #227
Accordion Interactions in E-Learning#227:Challenge|Recap Accordion interactions are a great way to group a large amount of related content into single slide. Similar to tabs interactions, accordions let users explore content using vertical or horizontal layouts. Accordions can be used to progressively reveal bullet points, quiz questions, module introductions, and summary slides. They're super flexible and they're what this week's challenge is all about! 6-Tab Animated Accordion Here's a free template to get you started this week. Using motion paths and a variable, this template animates the opening and closing of the tab buttons. View the project|Download the template Conditional Next Button Accordion interactions are similar to tabs, but they introduce a level of complexity with the duplicated buttons. If you need to lock or restrict navigation until the learner visits all tabs, you'll have to approach things a little differently. Here's one way to add conditional navigation to your interaction. View on YouTube Challenge of the Week This week, your challenge is to share an example that demonstrates how accordion interactions can be used in e-learning. NOTE: Your entry can be anything from a rough concept to a polished example. The challenges are open to everyone, regardless of experience or skill level. If you need technical or creative help with your project, please ask in our forums and reference the challenge number you’re working on. New Entries Only! We hosted the first accordion challenge two years ago. To keep things fresh, we’re asking that you share only new examples this week. You’re more than welcome to re-work a previous example. Last Week’s Challenge: Before toggling over to this week’s challenge, take some time to check out the interactive timelines your fellow community members shared over the past week: Zooming and Magnifying Techniques #226: Challenge | Recap Wishing you a great week, E-Learning Heroes! 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.Creating Roulette & Spinning Wheel Games in E-Learning #458
Roulette & Spinning Wheel Games#458: Challenge | Recap This week’s challenge was inspired by a recent community discussion by Troy Westphal. Troy created a roulette game using true/false variables to determine if the roulette’s spinning wheel selected red or black. Walt and Tom jumped in with ideas and tutorials to help troubleshoot Troy's source file. While Roulette games aren't a common interaction in e-learning, they present fantastic ways to flex our variables muscles. And that's what this week's challenge is all about. 🏆 Challenge of the Week This week, your challenge is to create a roulette-type game that involves spinning and randomization. You can create a literal roulette game or anything that captures the essence of the game. Ideas and Possible Projects Here are a few ideas to help you get started. Remember, you’re not limited to only roulette games. The objective this week is to combine spinning effects with randomization. Lottery Number Generator: Create an interaction to generate a set of random lottery numbers based on learner inputs or random numbers. Slot Machine Games: Create a slot-machine game where learners can spin the reels using sliders, dials, or simple buttons. Wheel of Fortune Games: Create a game based on the popular TV show. Examples of Spinning Interactions Here are a few examples of different approaches to this week’s challenge. ELC444: Example by Nichole Codrington ELC405: Example by Natalie Friedman ELC334: Example by Emmy Buxengard ELC311: Example by Owen Holt ELC278: Example & download by Samuel Apata ELC275: Example & download by Samuel Apata 🧰 Resources User Guides Storyline 360: Working with Variables Storyline 360: Adding Variable References Storyline 360: What "Object Loses Focus" Means Webinars Overview of Variables in Storyline 360 Using Text Variables in Storyline 360 Using Number Variables in Storyline 360 5 Ways to Personalize E-Learning Courses Using True/False Variables 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 Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness. 🙌 Last Week’s Challenge: Before spinning random ideas on this week’s challenge, check out the creative ways your fellow challengers combined three or more challenges: Mix-and-Match Challenge Examples RECAP #457: 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. 🚨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.New Employee Orientation and Onboarding in E-Learning #389
Onboarding and New Hire Training#389: Challenge | Recap Employee orientation training is one of the most popular types of e-learning. Onboarding is typically the first training employees encounter at their new company, so it’s essential to get it right. What should you include in onboarding training? What does onboarding training look like? Well, that’s what this week’s challenge is all about. Challenge of the Week This week, your challenge is to create an onboarding example for new employees. You don't need to build a comprehensive onboarding course. Instead, we want to see different approaches for onboarding new employees. For example, using placeholder content, you can create your demo for a fictional or real company. Or, develop your onboarding demo for your own e-learning company. Who knows? You may need to onboard some new course designers one day. Designing Onboarding Using Common E-Learning Interactions I always enjoyed building onboarding training because of the mix of instructional and interaction design. The course design begins with the content topics and lessons. But when you're ready to dive into development, common e-learning interactions can help you with the presentation design. Employee Orientation vs. Onboarding (See challenge #385 for ideas) Onboarding Checklist (See challenge #291 for ideas) Onboarding Journey Map (See challenge #255 for ideas) Meet the Team & Interactive Org Charts (See challenge #244 for ideas) Onboarding Scenarios (See challenge #365 for ideas) Orientation Tour of the Corporate Campus (See challenge #379, challenge #371, and challenge #337 for ideas) Safety Orientation & Procedures (See challenge #309 for ideas) Resources Here are some articles, examples, and webinars to help you with this week’s onboarding challenge. Webinar: How to Build Onboarding Training in Rise 360 Article: 5 Creative Ideas for Revamping New Hire Onboarding Examples: 5 Fresh Onboarding Examples & Templates 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 launch this week's onboarding challenge, check out the personality games and quizzes your fellow challengers shared over the past week: Personality Games and Quizzes in E-Learning#388: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.Audio Interviews with E-Learning Challenge Heroes #461
Interviews with E-Learning Challengers#461: Challenge | Recap 🏆 Challenge of the Week This week, your challenge is to create an audio podcast or interview on the value of working out loud and showing your work in the E-Learning Challenges. You can share your examples using any app or platform. In the past, designers have used Rise 360, Storyline 360, SoundCloud, and Vimeo to host their examples. OPTIONAL: After sharing your example, summarize your answers on your blog, LinkedIn, orcommunity forums. Podcast Interview Questions The following list of questions should be enough to help you get started. You can choose any number of questions to use in your demo. If you only have time for one question, great! If you want to do more, great! Advice for Others Community Aspect What advice would you give to someone just starting the challenges? How can new designers make the most of the experience? What are some best practices for giving constructive feedback? How can designers balance challenges and client work? Why would you recommend participating to other designers? What has the community support and interaction meant to you? Have you collaborated with other designers or made connections? How has being part of the community impacted your design work? What types of examples or topics would you like to see in the future? How could the challenge experience be improved or evolved? Favorite Challenge Example Design Process Which challenge example are you most proud of and why? What example did you find the most creative or innovative? Which example required the most effort or was the biggest challenge? Is there an example you wish you could redo or improve? What feedback on your favorite example helped you grow as a designer? How do you come up with ideas for the weekly challenges? What is your typical process for creating a challenge example? How do you decide which authoring tools or interactions to use? How much time do you usually spend on creating an example? Do you have a dedicated workspace or tools for e-learning design? Inspiration Learning Experience Which other designers' examples inspire you the most? Are there any examples that made you think, "I wish I had done that!"? How have the challenges exposed you to new techniques or authoring tools? Have you incorporated ideas from the challenges into real client projects? What tips would you give for overcoming creative blocks when working on challenges? What have been the biggest lessons or takeaways from participating? How have the challenges helped you improve as a designer? What skills have you developed further through the challenge process? How has feedback from the community benefited you? What keeps you motivated to participate week after week? Benefits of Showing Your Work Time Spent on Examples Why is it important for designers to share examples publicly? How has sharing your work benefited you professionally? What lessons have you learned from getting feedback on your examples? How do you decide what examples to share publicly or keep private? Have you ever collaborated after connecting over shared work? Which platforms or channels have been most effective for showcasing your work examples? How do you balance sharing enough work to benefit your career while protecting intellectual property? What is the breakdown of time (ideation, building, testing, etc.)? How do you estimate time required for different example types? What strategies do you use to work efficiently with limited time? How have regular challenges helped you get faster at development? Do you set aside dedicated time or fit it in around client work? What has been your most time-consuming example and why? How do you balance depth/quality vs. time invested for portfolio pieces? 🧰 Resources Check out the previous audio challenges to get an idea of ways to present your audio interview: Audio Interviews with E-Learning Designers #364: Challenge | Recap Podcast Interviews with E-Learning Designers #266: Challenge | Recap Instructional Design Podcasts #67: 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 click record on this week’s challenge, check out the creative toggle button examples your fellow challengers shared over the past week: Toggle Buttons in E-Learning RECAP #460: 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 weekly e-learning challenges in this Q&A post. 📆 Upcoming Challenges 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.E-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.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.Moving 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.Zooming and Magnifying Parts of an Image in E-Learning #374
Zooming and Magnifying Images in E-Learning#374: Challenge | Recap A typical design challenge for course designers involves working with high-resolution images in a smaller, mobile-friendly screen size. You can run with Storyline 360'szoom region,markers, and zoom picture tools for quick-hit solutions. All three will quickly give learners a close-up view of detailed images. But when you're looking for more custom solutions, you have to get creative. And that's what this week's challenge is all about! But first, let's take a look at a few examples. Using Sliders to Magnify Parts of a Photo Sliders are most often used to let learners explore cause-and-effect relationships or manipulate data and numeric values. In this example, the slider is used to reveal parts of the photo. View the example | Download the source Motion Blur Zoom Effects Here's a neat example that simulates a motion blur effect to zoom into parts of a painting. The zoom blur effect is created by layering multiple images with varying blur values and progressively revealing each image as the timeline plays. View the example Challenge of the Week This week, your challenge is to share a solution to allow learners to zoom in or magnify parts of an image, graphic, document, or video. Inprevious challenges, we covered some features and concepts that could work for zooming and magnifying parts of an image: Labeled graphics interactions Interactive screenshots Before and after comparisons Tooltips, callouts, and explorable explanations Using web objects Ideas and Examples Check out the following challenges for some features and design concepts that could be used for zooming and magnifying high resolutions images: Labeled graphics interactions Interactive screenshots Before and after comparisons Tooltips, callouts, and explorable explanations Using web objects 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 ownthreadand 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#ELHChallengeso your tweeps can track your e-learning coolness. Last Week’s Challenge: Before you zoom into this week’s challenge, check out the restaurant menu inspired examples your fellow challengers shared over the past week: Restaurant Menu Inspired Course Starters#373: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.
