Tutorial: Building a 'Slider' Mechanic in Storyline
Some time ago I developed a technique in Storyline that I've used to make interactive 'sliders' - and now seemed like a good time to share this with anyone who might be interested. There two videos (with attached Storyline files) are here:
Due to the Screenr 5 minute rule I had to be very brief about the actual mechanic used to make this interaction, but for anyone that's interested, here's an explanation:
The effect relies on the illusion that the user is dragging the oval up and down the slide, but actually what is happening is the user is dragging an invisible shape that sits on top of the oval. This invisible shape gets dragged over a series of invisible background objects.
The slider effect works by having a number of possible points on the slide where the oval button can stop, and for each one of these, there is an oval set to state:hidden. When the invisible dragging object is dragged over each of the stop points, the slide triggers two events:
1) The state of that position's oval is set to 'normal'
2) The state of all the other ovals is set to 'hidden'.
This works because there is an invisible drag object over the top of each oval, and each is set to snap back once the user lets go of it after dragging. Because the slider mechanic is so familiar to people, the brain fills in the gaps a bit and gives the user the impression that the shape has been dragged along the slider. In reality, all that's happening is a number of ovals are being hidden or un-hidden depending on a series of 'dragged over' triggers.
Anyway, I hope that the community can use this mechanic. It's a tool with a broad scope of applications, and it's not something I've seen in a lot of other courses so please feel free to innovate and use it however you can.
Questions are welcome and I'll do my best to reply.
Download the full storyline file here: http://goo.gl/ugeVX
All the best, Rich