Creating Interactions with Button Sets in Storyline 360 #423
Using Button Sets in Storyline 360 #423: Challenge | Recap Challenge of the Week This week, your challenge is to share an interactive demo to show how button sets can be used in e-learning. New to Storyline or using Rise 360 or another authoring tool? No problem! You can mock up some ideas using PowerPoint or your preferred graphics program. Resources Storyline 360: Working with Button Sets 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 dive into this week’s challenge, check out the creative ways course designers use isometric shapes in e-learning: Isometric Shapes in E-Learning RECAP #422: 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.Using 3D Models in E-Learning #347
Using 3D Models in E-Learning #347: Challenge | Recap Challenge of the Week This week, your challenge is to share an example that uses 3D models. Your demo can be interactive or static. You can use 3D assets already created so don’t feel like you have to learn to build in 3D this week. If you’re new to 3D, that’s okay. We have a few users in the community who regularly work with programs like Blender and SketchUp. Post your questions and we’ll try to get you the help you need. For those of you who intend to learn to build your own models this week, try to keep things simple. You don’t want to lose your time trying to build a teapot (inside joke for 3D Max users). Interactive Video Using 3D Models in PowerPoint Tom recently posted some fantastic tutorials on how he used the PowerPoint's 3D model library (requires Office 365) to create interactive videos. This is super easy to create in PowerPoint and make interactive using Storyline’s triggers and slide layers. Learn more about this effect and how to create it Using 3D Images to Create Interactions Here’s a good example of how a series of static images can be used from a 3D model. View the project | David Tait Guess what? You don't have to work with 3D models to use 3D graphics. Sites like PixelSquid offer asset libraries that feature rendered models that can be downloaded as individual images. To create the rotating effect like David created, you would need to download a series of images for each step in the rotation. View PixelSquid Free 3D Modeling Applications The easiest way to get started working with 3D would be to use PowerPoint’s 3D models if you have an Office 365 subscription. Since the models are already built, you can easily insert, rotate, and export the models from within PowerPoint. Here are a few sites that offer free and popular modeling programs: Tinkercad Blender SketchUp Unity Know of some other free 3D modeling programs? Let me know know in the comments and I’ll update the list. Resources How to Create a Video with 3D Models in PowerPoint How to Create Interactive Videos with 3D Models in Storyline Last Week’s Challenge: Before you dive into this week’s challenge, check out the creative ways course designers are using anthropomorphic characters in e-learning: Anthropomorphic Characters in E-Learning RECAP #346: 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.Using Emphasis Animations to Grab Learners' Attention #449
Using Emphasis Animation in E-Learning #449: Challenge | Recap What moves, gets noticed. And if you've worked in Storyline 360 recently, you likely noticed some movement in the Animations tab on the ribbon. Just like in PowerPoint, Storyline's new emphasis animation effects offer fresh ways to guide attention and highlight on-slide elements. You can apply them to pretty much anything – shapes, images, buttons, characters, markers, text boxes, even videos. So whether you’re trying to grab your learner’s attention or prompt them to touch the screen, emphasis animations can help learners focus on what’s important. And that’s what this week’s challenge is all about. 🏆 Challenge of the Week This week, your challenge is to show how Storyline 360's new emphasis animations can be used in e-learning. Your example can be a simple button starter kit showcasing the new animation effects, or you can create a more complete or polished. NOTE: Even without an active Articulate 360 subscription, you can participate in this week's challenge. For example, PowerPoint's emphasis animations give you similar functionality. 🧰 Resources Storyline 360: Emphasis Animations Storyline 360: Adding Animations Triggering Motion Paths Based on Learners' Actions Emphasis Animations Beta Feedback: Share your feedback, report a bug, or tell us how you’re using the new animations. ✨ 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: To help you build momentum for this week’s challenge, check out the growing list of tabs interactions your fellow challengers shared over the past week: Tabs Interactions in E-Learning RECAP #448: 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 #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. 🚨 Contact Information Just a quick heads up – if you want your blog, website, or LinkedIn included in our recap posts, could you do me a favor and add or update those links onto your ELH profile sometime this week? I found some broken links last week when I pulled the recap together. You spend a lot of time building creative examples, and your work deserves all the attention it can get.Converting Classroom Activities to Interactive E-Learning #465
This week, your challenge is to either rework an everyday classroom activity into an e-learning interaction, convert static content into an engaging e-learning experience, or share a tip or technique to help teachers transition from traditional classrooms to e-learning.Before-After: Accessibility Makeovers in E-Learning #466
E-Learning Accessibility Makeovers #466: Challenge | Recap Pop quiz: What do you think is the most asked question by course designers in our weekly trainings? Okay, other than "Is this session being recorded?" If you guessed anything about accessibility, you're correct. Anytime we show a feature, demo, or example, one of the first questions is usually about how it meets accessibility guidelines. Ideally, accessibility should be considered right from the start of the course design process. However, many courses, examples, and demos were initially built with more focus on design and interaction than accessibility. That's okay because you can always return and ensure those older projects meet accessibility guidelines. And that's what this week's challenge is all about. 🏆 Challenge of the Week This week, your challenge is to share a before-after example that reworks a short project to make it more accessible. If you’re just getting started with accessibility, start with something simple like making text accessible with alt text or ensuring a color contrast ratio of 4.5:1. You can work on a single slide or multiple slides. If you don't have your own projects, you can use slides from the Content Library or our downloads hub. The goal is to practice making courses more accessible. Inspiration Check out last year's accessibility makeover challenge for examples: Accessibility Makeovers #417: Challenge | Recap 🧰 Resources Accessible Elearning in Articulate 360 Looking for more information on designing accessible e-learning? The following resources are chock full of practical tips for getting started with the accessible features in Storyline 360 and Rise 360. Webinars What is Accessible E-Learning? 5 Things You Need to Know About Accessibility How to Create Accessible Courses with Articulate 360 Articles For even more on accessibility in e-learning, you can find all our best content in this series: All About Accessibility User Guides Articulate 360 FAQs: Accessibility How to Test Storyline 360 Content with a Screenreader Storyline 360: How to Design an Accessible Course 🙌 Last Week’s Challenge: Before you get started on your accessibility makeovers, check out the creative ways your fellow course designers reworked classroom activities for e-learning: Converting Classroom Activities to E-Learning #465: 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 Graphic Dividers to Add Visual Interest to E-Learning Courses #436
Graphic Dividers in E-Learning #436: Challenge | Recap Looking for a quick and dirty way to add visual interest to your Rise 360 courses? Try adding a full-width image block as a custom graphics border between blocks. Check out the following example to see how it works. View the example How does the effect work? This is an elegant effect using simple graphic elements, and the solution is quite simple once you break it down. The key is creating image dividers and inserting them as full-width image blocks between content blocks. How to Create Custom Dividers in Rise 360 Ginger has a great overview of how to create dividers in PowerPoint for Rise 360. There’s also a PowerPoint template you can use to help you get started. View on YouTube | Learn more 🏆 Challenge of the Week This week, your challenge is to show ways to add visual interest to e-learning courses w/ custom graphic dividers. ⚠️ NOTE: If you have an Articulate 360 subscription, we’d like to see what you can do with custom dividers in Rise 360. But as always, you’re welcome to use any authoring tool you like for this week’s challenge. Resources Tutorial w/ source file: Creating Dividers for Rise 360 Example: Interesting Things to Know About Tomato Example: How to Become a Great At-Home Mixologist Example: Joqo’s Skincare Secret Example: What to Avoid Saying to Sound Confident ✨ 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 divide and customize this week’s challenge, check out the ways course designers collaborate to build e-learning courses: Collaboration in E-Learning RECAP #435: 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. 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.Showing Meaningful Comparisons in E-Learning #1
E-Learning Challenge #1: Challenge | Recap This week I worked with an Articulate Storyline user who needed to build some interactive feature comparisons for their products. The interactions needed to simplify product data (specs, costs) and show meaningful comparisons between their products and their competitors’ products (size, weight, proportion). It made me aware that you can also apply comparisons beyond technical training. For example, you can feature comparisons between behavior (legal vs. illegal), decision-making (ethical vs. unethical), choices (good vs. poor), and more. You could build comparisons on almost anything. The key is to show them, so they’re meaningful to learners. And that's what this week's challenge is all about. Challenge of the Week This week, your challenge is to use the provided source files to create an interactive demo to compare the different sizes of aircraft. Objective: Design an interactive graphic to show relative sizes for a series of airplanes. Check out this Wikipedia entry on giant aircraft for inspiration. Assets: Download the airplane graphics. They’re available in .png (transparent) and .pptx (PowerPoint) formats. Tools: You can use Storyline, Articulate Studio, or PowerPoint to create your interaction or infographic. Share Your E-Learning Challenge Demos This is a great way to practice your visual communication skills while building your e-learning portfolio. To share your files, do one of the following: Comments: Use the comments section below to share a link to your published project. The comments section allows links but not attachments. You should use the forums if you have a question or want to share your source files. Forums: Create a new thread in the forums and share a link to your published source file. You can also attach your project files if you want help or feedback. Personal blog: Post your published example on your blog or website. Examples Here are a few examples to get you started: Scale of the Universe Powers of Ten Planet size comparison What You Can Do in 25 Square Meters Cell Size and Scale The Size of Our World Kingdom of the Blue Whale Great whales Tapuiassauro, the new dinosaur from Brazil What are 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.Creating Immersive Learning Experiences with 360° Images #467
Labeled graphics interactions are one of the most popular interactions because they’re easy to create and only need a single image to turn static visuals into interactive, explore-type activities. Similarly, 360° images offer the same ease of creation but on a whole new level. They bring static images to life, allowing learners to explore real-world environments as if they were actually there. And that’s what this week’s challenge is all about! 🏆 Challenge of the Week This week, your challenge is to show how 360° images can be used in e-learning. If you're a Rise 360, the 360° images feature is a fantastic way to enhance your courses by using Rise 360's Storyline blocks. 🏞️ Looking for 360° Panoramic Stock Photos? Storyline 360 supports equirectangular panoramas in all standard image formats for creating 360° image interactions. Here are some places you can find images: Pixabay 360Cities Flickr Pixexid *Each image provider has its own licensing terms. Be sure to review them to ensure proper use. 📸 360°Degree Cameras Here are four of the most popular 360° cameras: Insta360 ONE X2 and Insta360 X3 Ricoh Theta Z1 GoPro MAX Ricoh Theta SC2 🧰 Resources 360° Images User Guide Adding and Editing 360° Images Tutorials: How to Create a Progressive Scavenger Hunt with 360° Images in Storyline 360 How to Create Badges for a Gamified Scavenger Hunt Using 360° Images ✨ 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 take this week’s challenge for a spin, check out the accessibility makeovers your fellow challengers shared over the past week: E-Learning Accessibility Makeovers RECAP #466: 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. 📆 Upcoming Challenges Challenge #468 (07.05): Drag-and-drop interactions. This will be a general drag-drop challenge, so you can share anything you like.Creating Interactive 360° Images in E-Learning #337
Using 360° Images in E-Learning #337: Challenge | Recap With Storyline 360, you can now create immersive learning experiences using the new 360° image feature. Using any 360° image, you can make interactive panoramas, virtual tours, explore-type activities, and so much more. Examples of 360° images Where to find 360° images Recommended 360° cameras Getting started with 360° images 7 Ways to view all markers before moving forward Challenge of the week Share your e-learning examples 360° Image Examples Here are some creative examples from our Senior QA Engineer, Annie Kim. Annie shared these examples early on, and they helped many of us begin to see what’s possible with this fantastic new feature. If you have questions about anything Annie shared in her example, jump into this forum thread, and we’ll help you out. View the examples Getting Started with 360° Images This overview video shows you how to insert 360° images and add basic interactivity with markers, hotspots, and triggers. Of course, you can do a lot more with this feature, but this should help you get started. View on YouTube 7 Ways to View All 360° Image Markers Before Clicking Next Button Currently, 360° image interactions don't have triggers to evaluate visited states. But that's okay because Storyline 360 has plenty of options to help you ensure learners click all markers before moving forward. Here are seven ways to ensure learners click and view all items in 360° images before continuing. View on YouTube Resources Here are a few resources to help you get started. We’re working on more articles, how-tos, and downloads over the next week. As always, jump into the forums if you get stuck or need help with your project. 360° Stock Photos Here are some sites we’re recommend exploring for 360° photos. Flickr. Great collection of panoramic images you can use to build your examples this week. Pixexid. Free stock photo site with a large collection of 360 photos. Unsplash. The standard for stock photos has a solid collection of 360° images. *Each image provider has its own licensing terms. Be sure to review them to ensure proper use. 360 Degree Cameras Here are four of the most popular 360° cameras: Insta360 ONE X2 and Insta360 X3 Ricoh Theta Z1 GoPro MAX Ricoh Theta SC2 Announcement and Discussion Storyline 360: Interactive 360° images. Read more about this exciting new feature and how to submit feature requests to make it even better. 360° Images User Guide Adding and Editing 360° Images Adding Markers to 360° Images Adding Hotspots to 360° Images Controlling Navigation in 360° Images Adding Interactivity to 360° Images Challenge of the Week This week, your challenge is to share an example using Storyline’s 360° image feature. Since this is a new feature, anything you share will benefit the community. Here are some ideas you can consider using for your examples: Escape room or office. Check out the office example Annie shared for inspiration. Product tours and demos. Start with a static photo of a product and add buttons that jump to different slide layers with their own 360° image. Don’t worry if you don’t have all the right photos for your example. We’re looking for general concepts and ideas this week. Guided and virtual tours. Tours are an excellent topic to use with the locked navigation and progress options. New to Storyline 360? If you're brand new or just getting started with Storyline 360, we've got you covered. I know we have many Rise 360 users who follow the challenges. So if you'd like to participate this week, check out the overview video to get a big picture view of how 360° images work. Next, try creating a new project and importing a 360° photo. Guess what? You just built an immersive example! Finally, try adding a hotspot or marker to begin adding interactivity. If you have questions, start a new thread and mention "360° image challenge" in the subject line, and we'll help you out. Share Your E-Learning Work Comments: Use the comments section below to share a link to your published example and blog post. Forums: Start a 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. 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. Last Week’s Challenge: Before you take this week’s challenge for a spin, check out the digital magazine examples your fellow challengers shared over the past week: Digital Magazine Examples RECAP #336: Challenge | RecapCreating Interactive Documents with Sliders in E-Learning #300
Interactive Documents with Sliders #300: Challenge | Recap Using Sliders to Create Interactive Documents In a recent post, John Berendes from Yukon Learning, shared a fun tutorial on using sliders to page through a document or policy manual. While this may not be an everyday use case for sliders, it’s a great way to begin seeing new ways to navigate information-heavy content in e-learning. Check out his post and download the source file to see how he put it together. View the tutorial Using Sliders to Create Interactive Instruction Manuals One way to approach your slider document is to align the visual elements to your content. Below is a simple example that uses a custom background and slider thumb to align with the LEGO instruction manual. View the example Challenge of the Week This week, your challenge is to show how sliders can be used to create interactive documents or instruction manuals. I’ve included some slider resources below. If this is your first time working with sliders, let us know in the forums if you get stuck or have questions. Resources Articles and tutorials Storyline 360: Working with Sliders 4 Pro Tips for Working with Sliders How to Build a Simple Process Interaction Using Sliders in Storyline Webinars Storyline 360 Essentials: Using and Customizing Sliders Storyline 360: Create Parallax Effects with Sliders in Storyline 360 Storyline 360: NSA: Interactive Characters and Slider Interaction Challenges Using Sliders in E-Learning #205: Challenge | Recap Parallax Scrolling Effects in E-Learning #253: Challenge | Recap Combining Sliders for Interactive Infographics #260: Challenge | Recap 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 slide into this week’s document challenge, check out the creative ways static content can be transformed into interactive e-learning: Static to Interactive E-Learning Examples RECAP #299: 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.
