Blog Post

E-Learning Challenges
2 MIN READ

Using Dials and Sliders to Select E-Learning Characters #311

DavidAnderson's avatar
5 years ago

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

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

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.

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. 

Selecting Characters Using Sliders in Storyline 360

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

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.

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. 

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

View example | Download

Challenge of the Week

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

 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.

Please consider sharing your source file this week.

Resources

Webinars:

User Guide:

E-Learning Challenges:

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 creative ways the glassmorphism design style can be used in e-learning:

Glassmorphism Design in E-Learning #310: 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.

Published 5 years ago
Version 1.0

196 Comments

    • KariVaz's avatar
      KariVaz
      Community Member
      I really like the theme of your submission. The highlighting effect when an avatar is selected by the slider is neat!
  • alexjinca's avatar
    alexjinca
    Community Member
    Hi Everyone! This week I am celebrating my 50th entry and I wanted to do something special using the slider theme to honor the hero characters that helped me deliver my past examples, some of you might already be familiar with them, but Sam the Snazzy Snail is a new one to the edition! bringing you this week's demo to live: Giving Tilly a hug!

    Thanks to everyone that gave me feedback, supported my work and thanks to all of you sharing your great ideas! Also, special thanks to @David Anderson! for bringing us together and encouraging us to push boundaries with each challenge!

    Have a great week everyone!
    Link to demo here: http://bit.ly/39YkUcV
    • MrinalD's avatar
      MrinalD
      Community Member
      Nice interaction, Congratulations for completing 50 challenges
    • KOsunero's avatar
      KOsunero
      Community Member
      I love the custom slider and the callback to your past work. Congrats on 50 entries! Here's to 50 more. :)
      • alexjinca's avatar
        alexjinca
        Community Member
        Thanks Kimberly and thanks for your feedback!
      • alexjinca's avatar
        alexjinca
        Community Member
        Glad you enjoyed it, Samuel!
  • Hello and a belated Happy New Year! Some of you might have heard that I caught Covid-19 at Christmas and have only recently returned to work. While I was recuperating, I watched a LOT of classic movies, which inspired this week's demo:

    THE USABLE SUSPECTS
    http://bit.ly/elhc311

    No download this week, as I intend to develop this concept further. I've always wanted to build a course where your choice of character influences the flow/difficulty of the course. If you have any questions about how I put this together though, drop me a line.

    EDIT

    Blog post now live!
    https://engagebraintrain.com/the-usable-suspects/
    • KOsunero's avatar
      KOsunero
      Community Member
      Welcome back! Love seeing Storyline and Vyond together, and looking forward to seeing you develop this concept further. It has great RPG potential.
    • SamuelApata-95b's avatar
      SamuelApata-95b
      Community Member
      Very glad to hear you conquered that challenge as well. Cool interaction. I'm wondering how you got the characters to step in front of each other.
      • Jonathan_Hill's avatar
        Jonathan_Hill
        Legend
        Thanks Sam. I simply altered each character's position in Vyond, bringing the selected character to the front in each of the five clips that are shown when the slider moves.

        I was in the process of writing a blog about it, but my website has caught Covid too, it seems, and I'm currently trying to restore it.
    • JodiSansone's avatar
      JodiSansone
      Community Member
      Terrific...what a great movie and adaptation for the challenge. Fenster was always my favorite.
      • Jonathan_Hill's avatar
        Jonathan_Hill
        Legend
        It's a great film! I like Gabriel Byrne's character, Keaton. Spacey's character, Verbal, feels a lot creepier now somehow too.
    • RachnaGhiya's avatar
      RachnaGhiya
      Community Member
      Glen, Loved this. Is this in-built animation? Slide up with a white layer changing states? Not sure how you made their claws appear first. Would love to know.
    • KariVaz's avatar
      KariVaz
      Community Member
      This was adorable. Glen. Great design!
    • JodiSansone's avatar
      JodiSansone
      Community Member
      Nice animation! I wish I had thought of that.
  • Which Employee would you prefer?

    Part of an onboarding training for schools. I adjusted this interaction to add the selection of a male or female employee. I added in a bit of glassmorphism on the intro page for extra...credit?

    http://bit.ly/chooseyouremployee

    Have a great day!
  • JodiSansone's avatar
    JodiSansone
    Community Member
    Avatar Slider/Dial Demo
    Demo: https://bit.ly/367sLDQ
    Download: https://bit.ly/2KIklLE

    It took me all afternoon to make these avatars...but it's raining here so I have the time. This is an homage to the Dolly Parton challenge from a couple years ago. Use the slider to choose your avatar and the dial to choose a style (LinkedIn, Facebook, or Tinder. I provided a download to show how all the variables work--if someone has a more efficient solution I'd love to see it. Have a good week!
    • RachnaGhiya's avatar
      RachnaGhiya
      Community Member
      Clean design as always, Jodi. Curious to know from where you got these characters...Glad if you can share :)
    • Kristy_Moede's avatar
      Kristy_Moede
      Community Member
      This is awesome!! Love the three options within the avatar :) too fun
    • KariVaz's avatar
      KariVaz
      Community Member
      Amazing design, Jodi! Love the clean colour scheme.
    • DanielaSlater's avatar
      DanielaSlater
      Community Member
      Nicely done Ron. Impressive. Can I do that with my husband?
    • ChrisFoster-30d's avatar
      ChrisFoster-30d
      Community Member
      Imaginative and well put together Ron, love creativity like this!
    • JodiSansone's avatar
      JodiSansone
      Community Member
      Great concept and an inventive way to use the built in characters.