\n

Using Sliders with E-Learning Characters #311: Challenge | Recap

\n

Using characters in e-learning courses is one of the easiest ways designers can personalize the learning experience. 

\n

In a previous challenge, we looked at different ways learners can choose their avatars. Character selection techniques shared include text entry, drag-and-drop, click-to-select, surveys, dials, and sliders.

\n

Regardless of the technique, you’ll need to work with variables to track the learner’s choice and display the correct character throughout the course. 

\n

Selecting Characters Using Sliders in Storyline 360

\n

If you haven't worked with variables, dials and sliders make the process a little easier to get started.

\n

When you insert a dial or slider, Storyline automatically creates a number variable for you. Thanks, Storyline!  As you drag the slider, the variable's value is adjusted based on the range you define.

\n

Based on the number variable's value, you can perform any number of actions such as jumping to slides, personalizing feedback, and identifying which character to use throughout the course. 

\n

I put together a simple demo and source file to help you get started.

\n

\n

View example | Download

\n

Challenge of the Week

\n

This week, your challenge is to share an example that lets learners choose their avatar using either a dial or slider.

\n

 You don't have to create two examples. Choose either a dial or slider to use in your demo. If you have time, you're welcome to create two versions of your example using one of each.

\n

Please consider sharing your source file this week.

\n

Resources

\n

Webinars:

\n

\n
• Getting Started with Variables in Storyline 360
\n
• Using Number Variables in Storyline 360
\n
• Using Text Variables in Storyline 360
\n
• Using True/False Variables in Storyline 360
\n
• 5 Ways to Personalize E-Learning Courses
\n

\n

User Guide:

\n

\n
• Storyline 360: Working with Variables
\n
• Storyline 360: Adding Variable References
\n

\n

E-Learning Challenges:

\n

\n
• Use Learner's Name in E-Learning Course #222: Challenge | Recap
\n
• Using True/False Variables in E-Learning #271: Challenge | Recap
\n
• Using Variables to Compare Learner's Answers #292: Challenge | Recap
\n
• Random Number Variables in E-Learning #278: Challenge | Recap
\n

\n

Share Your E-Learning Work

\n

\n
• Comments: Use the comments section below to share a link to your published example and blog post.
\n
• Forums: Start  your own thread and share a link to your published example..
\n
• 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.
\n
• Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness.
\n

\n

Last Week’s Challenge:

\n

Before you dial into this week’s challenge, check out the creative ways the glassmorphism design style can be used in e-learning:

\n

\n

Glassmorphism Design in E-Learning #310: Challenge | Recap

\n

Wishing you a great week, E-Learning Heroes!

\n

New to the E-Learning Challenges?

\n

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.

\n

Using Sliders with E-Learning Characters #311: Challenge | Recap

\n

Using characters in e-learning courses is one of the easiest ways designers can personalize the learning experience. 

\n

In a previous challenge, we looked at different ways learners can choose their avatars. Character selection techniques shared include text entry, drag-and-drop, click-to-select, surveys, dials, and sliders.

\n

Regardless of the technique, you’ll need to work with variables to track the learner’s choice and display the correct character throughout the course. 

\n

Selecting Characters Using Sliders in Storyline 360

\n

If you haven't worked with variables, dials and sliders make the process a little easier to get started.

\n

When you insert a dial or slider, Storyline automatically creates a number variable for you. Thanks, Storyline!  As you drag the slider, the variable's value is adjusted based on the range you define.

\n

Based on the number variable's value, you can perform any number of actions such as jumping to slides, personalizing feedback, and identifying which character to use throughout the course. 

\n

I put together a simple demo and source file to help you get started.

\n

\n

View example | Download

\n

Challenge of the Week

\n

This week, your challenge is to share an example that lets learners choose their avatar using either a dial or slider.

\n

 You don't have to create two examples. Choose either a dial or slider to use in your demo. If you have time, you're welcome to create two versions of your example using one of each.

\n

Please consider sharing your source file this week.

\n

Resources

\n

Webinars:

\n

\n
• Getting Started with Variables in Storyline 360
\n
• Using Number Variables in Storyline 360
\n
• Using Text Variables in Storyline 360
\n
• Using True/False Variables in Storyline 360
\n
• 5 Ways to Personalize E-Learning Courses
\n

\n

User Guide:

\n

\n
• Storyline 360: Working with Variables
\n
• Storyline 360: Adding Variable References
\n

\n

E-Learning Challenges:

\n

\n
• Use Learner's Name in E-Learning Course #222: Challenge | Recap
\n
• Using True/False Variables in E-Learning #271: Challenge | Recap
\n
• Using Variables to Compare Learner's Answers #292: Challenge | Recap
\n
• Random Number Variables in E-Learning #278: Challenge | Recap
\n

\n

Share Your E-Learning Work

\n

\n
• Comments: Use the comments section below to share a link to your published example and blog post.
\n
• Forums: Start  your own thread and share a link to your published example..
\n
• 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.
\n
• Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness.
\n

\n

Last Week’s Challenge:

\n

Before you dial into this week’s challenge, check out the creative ways the glassmorphism design style can be used in e-learning:

\n

\n

Glassmorphism Design in E-Learning #310: Challenge | Recap

\n

Wishing you a great week, E-Learning Heroes!

\n

New to the E-Learning Challenges?

\n

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.

Hey folks! This is just a quick note to let you know I had to remove some examples because of broken links. So if you shared a demo but didn't see it in the recap, please repost your example in the comments so I can add it: https://community.articulate.com/articles/interactive-dials-and-sliders-elearning-characters/

Hi all here's my entry for this week - https://360.articulate.com/review/content/336dd7e9-1fee-46bc-89d8-cd6560646195/review

Works well. Looks good.

Thanks Ron

My latest storyline on an Insulin Pump Training Program features a slider to navigate through different \"characters\" and analyze what they should do with their sugar/insulin/pump in different situations!

https://360.articulate.com/review/content/972bac74-2a76-4de4-9449-487a1f1e4b14/review

Hi all,

Here's my very first ELHC contribution:

https://laasertimm.000webhostapp.com/ELHC53

Sort of combines challenges #53 (pictogram characters) and #311 (sliders to select characters).

Welcome to the challenges, Timm. I enjoyed your slider example for character assembly. I updated both #53 and this week's challenge to feature your work. Thanks!

Hello good people of EHL Community. Here is my submission for this week's challenge.

Demo: https://tinyurl.com/4pyenfqu

Thanks David for the inspiration of this Demo. The idea originally is to proceed this demo with a virtual assistant sort of a companion for the rest of the course. The user can choose the assitant. The slider has been designed to desable the next unless it is on a specific position.

Please take a look. As always your feedback is more than welcome! Thanks!

Hey Gunjan! Thanks for your example this week. Sorry it took me so long to update your entry.

I liked your slider example. The only feedback I have is regarding the character buttons. The characters are active and clicking each character overrides the slider selection. You could put a hotspot over the characters to prevent learners from interacting with the characters so they focus on the slider. But cool example and exactly what we're looking for this week.

Recap updated: https://community.articulate.com/articles/dials-and-sliders-to-select-elearning-characters/

Hi folks! Thanks for the amazing examples this week. I updated the recap post to include your latest entries: https://community.articulate.com/articles/dials-and-sliders-to-select-elearning-characters/

This is my very first challenge! I have reemed the benefits of your ideas and I have been inspired by the members' creativity. I keep it simple and used the dial. Since it was my first time using a dial, I thought I would not get too ambitious. I welcome your comments and critics.
Project : https://360.articulate.com/review/content/b909c630-f106-4a8d-b5df-2dc2f7d6a9f8/review

Welcome to the challenges, Doris! I'm sorry I missed your example in the last update. I must have been moving too quickly:-/

I updated the recap post to feature your creative dial example. Here's the link: https://community.articulate.com/articles/dials-and-sliders-to-select-elearning-characters#DorisChwist

Thanks again for sharing this week. Hope to see you around future challenges.

Good day,
I attended yesterday's webinar on graphic design but there were multiple interruptions on my side. I have tried to review it this morning but the vidéo file seems empty. Please tell me where I can access the recording.
Very much appreciative,
Doris Chwist\nTechnicienne en formation à distance\nFormation continue | Services d'encadrement
Université de Moncton , campus d’Edmundston\nPièce 211-D, Pavillon Simon Larouche (EPSL)\n165, boulevard Hébert\nEdmundston (N.-B.) Canada E3V 2S8\nCourriel: doris.chwist@umoncton.ca
L'information contenue dans ce courriel (y compris les pièces jointes) est confidentielle et vise uniquement son destinataire ou ses destinataires. Toute autre distribution, copie ou divulgation est interdite. Si vous avez reçu ce courriel par erreur, veuillez nous en aviser et éliminer ce courriel, ainsi que les pièces jointes, de votre système informatique et de vos dossiers.

This was my first time using the slider.
https://360.articulate.com/review/content/52ebe6a6-e75e-4c54-a733-2d5ff56d95e8/review

Welcome to the challenges, Travae! Thanks for sharing this week.

Here's a link to your example in last week's recap post: https://community.articulate.com/articles/dials-and-sliders-to-select-elearning-characters#TravaeBrown

Nicely done, Travae! You executed the assignment perfectly and your avatar looks wonderful.

My first time entry into the world of ELHchallenge and after looking at all the other entries, I realize that mine is quite basic but nevertheless.... Its a start and I hope to keep participating in the upcoming challenges.
Sorry for the delay! I know the next challenge is up and running already!

https://360.articulate.com/review/content/7c4ce6b0-c2ae-44a8-b346-d8745758b110/review

Deepa, welcome to the ELC Challenge! The simple interactions with the slider and the dial are super. The age progression of the character is a great touch. What formula did you use to determine if the level of sleep was enough? Did it hinge on the age range?

@Ron, Thanks so much for your encouraging words!
Yes! Simply comparing the sleep variable to a fixed number and showing GREEN layer if dialVar>= 'X value' or RED layer if dialVar< 'X value'. The X value changes for each age range. I wanted to make it more appropriate with more conditions but was falling short of time and the next challenge was already online! :)

Hi everyone!

This is my very first challenge and I hope everyone will like it. It is also the very first time I am using sliders and dials. It was a lot of fun.

Please pick Amber's avatar to see the next slide which contains the dial as well.

The infographics were taken from the CDC site.

https://360.articulate.com/review/content/304b4e5e-7ff8-4092-897d-a75e848a1bcd/review

Nice use of the sliders and dials and great job incorporating fact based info from the CDC. Welcome to the ELC challenge.

Thanks, Ron! I appreciate your positive feedback. I am going to be doing a lot more of these challenges. They will help me stay on top of my game. I also appreciate the feedback and viewing other wonderful samples. :)