Blog Post

E-Learning Challenges
2 MIN READ

Using Interactive Dials as Draggable Menus in E-Learning #355

DavidAnderson's avatar
4 years ago

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 exciting approach 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 for draggable navigation.

Resources

You can learn more about working with Storyline’s dials in the following articles and webinars.

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 2022 Color 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.

Published 4 years ago
Version 1.0

81 Comments

  • JodiSansone's avatar
    JodiSansone
    Community Member
    2022 Horoscope Dial
    Demo: https://jodisdemos.s3.amazonaws.com/355+Very+Peri+Horoscope+Dial/story.html

    Download: https://jodisdemos.s3.amazonaws.com/355+Very+Peri+Horoscope+Dial.story

    The stars must be aligned for me in 2022--last week when I did this demo for the new Pantone Color of the Year I started off trying to use a dial, but I got frustrated when I couldn't get the dial to align correctly and rotate back and forth the way I wanted it to. Seeing this challenge today sent me back to the drawing board to brush up my dial skills. Enjoy exploring your horoscope for 2022.
    • PreethiR-45f9fe's avatar
      PreethiR-45f9fe
      Community Member
      Excellent graphics Jodi! Thanks for sharing the storyline file.
    • FredericBrewer's avatar
      FredericBrewer
      Community Member
      Hi Jodi this was really impressive! And my horoscope was pretty accurate too, haha. Would you mind sharing how long it took you to make this?
      • JodiSansone's avatar
        JodiSansone
        Community Member
        Hi Frederic, thank you for the question. I worked on this over the course of 2 weeks and since I was doing it for fun I didn't really pay much attention to how long it was taking. My best guess would be about 12 hours. It took time to format the art and convert it into the Very Peri Pantone Color of the Year (I posted a version of this in Challenge #354). I also spent quite a bit of time finding short horoscope predictions for 2022. And in this version I had some challenges in getting my dial alignment to work--the dial had to be perfectly aligned with the 12 signs and I was having trouble getting my head around the dials settings--I used the tutorials in the Articulate Community because I was rusty on using a custom dial. I hope that helps answer your question!
    • AprilAntoniou-0's avatar
      AprilAntoniou-0
      Community Member
      Beautiful artwork! I love astrology, I liked the experience of turning the dial (once I figured out how to turn it!) Wishing everyone a happy and prosperous 2022!
    • FredericBrewer's avatar
      FredericBrewer
      Community Member
      Thanks for sharing! I enjoyed and learned a lot from this interaction.
    • AprilAntoniou-0's avatar
      AprilAntoniou-0
      Community Member
      I didn't know there were so many people to blow up in Moscow! Learning by destruction - the new learning meta :P
    • Samuel's avatar
      Samuel
      Community Member
      HNY Jonathan! Nice idea. The reflection is such a nifty detail.