Forum Discussion
Suggestions for another way to solve expanding this bundle of documents with a Slider
I thought I would try to use a slider object to take a bundle of 3 pages and expand them out with the aim to explain something about them.
However, I wanted the slider to be invisible, laid over the pages so you are spreading the pages with your mouse, not clicking a slider underneath the pages.
This works perfectly well, as long as you don't let go of the mouse button. It concertinas out and back in again. But, as soon as you let go of the mouse, the slider is as good as inaccessible to the learner, so I added a reset button, which is fine but clunky.
The reason this is a problem, of course, is that the slider is on the base slide and as you drag the slider, the ensuing pages end up covering the slider as they are on layers.
Is there a better way of designing this interaction whereby the (invisible) slider can always be on top with the pages being underneath? Clearly layers are designed to be above the base layer! :D
I've attached a test version of the slide here, for your input.
Thanks, everyone. Sometimes you can't see outside of the problem.
In addition, Sliders can be used with the arrow keys on the keyboard, which might be the alternative solution, but as it makes more sense to spread the pages from Right to Left, for logical reading sense, the Slider is upside down, which means the arrow keys are backwards for navigation.
IMHO, it's good to consider whether the value of the interaction is truly worth the development time.
Dragging isn't accessible. Even for those who regularly use a mouse, it's all too easy to let go at the wrong moment. Or just run out of dragging space on their mousepad...
In other words: I suggest you rethink this interaction.
For example, you could animate the "pages" into position. This could be done either when the timeline starts, or when the user clicks a button. That button could even be a transparent shape over the "bundle," so they click the pages to start.
BTW, you didn't have to turn the slider upside down. To drag from right to left, you could have just started it at the last position:
Thanks Judy. Yeah, that is true. It's why I added the bit about the arrow keys (I was wondering whether there was some way of programming them so that left is right and right is left with variables but may be getting a bit complicated, I'm not sure.
I certainly programmed what happened using keys in another interaction on here, previously.
This is partly an exercise to see how to simulate spreading out the pages but I wanted interaction by the user, with the ultimate plan being to have information at some of those stops of the slider.
Clicking a button to then have animations or even shorter animations to split into separate segments to get the information in between, felt less satisfying.You could still use a slider to spread the pages. Just make it smaller, so it would fit underneath the pages and, thus, be available from all layers. You could even change the slider's thumb to an image of a hand. That wouldn't exactly mirror the action of placing one's hand over the pages to spread them, but it might be close enough to what you want.
Here's something I try to keep in mind. It's something I heard Dr. Michael Allen say years ago: "Alternate navigation is not interaction."
- In other words, true interaction happens when the learner has a choice to make, and different choices have different consequences.
- Nowadays, any click other than the standard navigation buttons is called an interaction. But that's not as engaging as a CCC (context, choice, consequence) interaction.
Thanks for your edit, Judy. I have only used a slider and animations once before (with horizontal sliding animations in some of the steps!).
I didn't realise you could start at step 10 and work your way back. Excellent. I will change this in the interim and see what other options people have, if any.
You're also right about the development time. Thanks again.
Thanks, that's a great idea Judy. I appreciate your further thoughts and yes, interaction was the wrong word choice here. Navigation indeed.
