Forum Discussion

MeganKDowney's avatar
MeganKDowney
Community Member
16 hours ago

Dial interaction with 360 degree rotation

Hi Everyone,

This is my first time using a dial interaction in a course. I am trying to have the dial rotate 360 degrees, but clockwise only. the red section should be the first step, then light blue, then gray. I tried following instructions in several of the E-Learning Heroes articles I found, but for some reason I can't get the dial to turn clockwise. I've attached the file here. Can anyone help?

3 Replies

  • Hi Megan. I've attached a partial solution. Confusingly, dials have two rotation properties. The first, shown in the Tools, is the number of degrees you want the dial to be able to rotate:

    It was above 9000 or so, so maybe your thinking was that affected the second property, which is the rotation of the object on the slide canvas. If so, that latter one is actually found under the More Rotation Options.

    That second one is the property that lets us choose which way the dial actually points when the slide is loaded, distinct from how many degrees we want the dial's range to span. For the attached, I dropped the range to 359 so that the learner can't rotate the dial past the origin (360), otherwise they could spin it around and around.

    I did fiddle with the triggers a bit to see if the dial itself could be prevented from going back counterclockwise and wasn't able to suss out a simple way. I have no doubt a more complex solution exists by relying on JavaScript to continually check the dial itself, but it's risky to include something like that if you or anyone who comes after you would struggle to maintain it.

    Personally I don't like preventing the learner from going back to the red and blue options because it would keep them re-reading it. If they accidentally turn the dial too far or if they don't understand it as well as they initially think they do and want to revisit it, your desired implementation would lock them out from the information they need. I'm curious to know the particular use for not allowing the dial to move counterclockwise.

    To wit, dials are intended to increase the ability of learners to select from a variety of options. If the dial is simply a graphical representation of a clock, I wonder if an image of a clock that's advanced with simple buttons might not be both faster to develop as well as more effective instructionally.

    Just for personal fun as well as to provide an alternative, I added a second slide that incorporates a linear clock and text states that allow the learner to see all of the necessary information. Disregard of course if it doesn't suit your purposes, but I thought it came out all right. Let me know if there's more context to the dial.

  • MeganKDowney's avatar
    MeganKDowney
    Community Member

    AndrewBlemings-​ thank you so much. this is super helpful. I had intended to have it rotate for the maximum amount of possible times (27), but only clockwise. That's why I initially put the 9720 value in for rotation, per the instructions in this article. I do like the second idea you provided as well. Appreciate your help!

  • Nedim's avatar
    Nedim
    Community Member

    An Initial Value of 81 matches the End Value, meaning the rotation starts counter-clockwise. The dial will rotate counter-clockwise 27 times, stopping 3 times per rotation (9720° / 360° = 27 rotations). This total movement of 9720° simulates an infinite spin. To reverse the direction to clockwise, change the Initial Value to 1. If you want to limit this to a single clockwise rotation, set the total Rotation to 360°, the Initial Value to 1, and the End Value to 4.