Forum Discussion

KelleyDurdella-'s avatar
KelleyDurdella-
Community Member
2 months ago

Spinning Wheel

Picking the brain of all the brilliant designers out there. I am looking for a way to spin a wheel like the wheel in the Price is Right, or it just be a 2D wheel that spins. Any ideas?

  • Hi Kelley,

    As with all things in Storyline, there's more than one way to do this. Without extra coding, the two main methods are the 'spin' animation or a 0x0px circular motion path.

    You might find last years 'roulette' challenge a useful place to start.

    Creating Roulette & Spinning Wheel Games in E-Learning #458 | Articulate - Community

    For that challenge I used the 'spin' animation method, but I used a state change to add a blur effect to the wheel when it's spinning, too. This reduces the risk your object will flicker in way that is distracting or dangerous for users with epilepsy.

    In my demo, the spinning wheel acts as a menu. To determine it's end position, I converted the wheel into a custom dial, so its position can be tracked and controlled by a variable.

    https://bit.ly/elhc458 

    You can also download my source file here: https://bit.ly/elhc458dl

    I encourage you to check out the other entries for the 'roulette' challenge as well, as there's some crazy inventive stuff in there.

     

  • Thank you so much for the link to that challenge. There are some amazing examples in there!

    I guess what I am hoping to find is a way to make the wheel more like a Ferris Wheel and not like a roulette. I don't want the items on it to turn upside down if that makes sense. The color piece would turn, but the icons would stay right side up. Would I just make states for each turn of the wheel?

     

    • AmandaEckenroed's avatar
      AmandaEckenroed
      Community Member

      You can apply a circular motion path animation to each of your six items. Under Path Options, set Easing to None and avoid selecting Orient Shape to Path to maintain their original orientation. While this may not be the perfect solution, it will effectively achieve the desired outcome.