One of the many new features in Storyline 2 are Slider controls. Here are just a few examples for how they could be used. And here is a brief blog post about sliders.
Can I just ask what software did you use to record the rotating of the device?
A CAD model of the device was imported into a 3D animation software (in this case, it was Blender). The model was then lit and rotated and then the animation was exported as a sequence of bitmaps. The bitmaps were imported into Storyline and added to custom states of an object.
First I would like to say that sliders are very useful to improve our courses !
But have a question concerning the "Standard Slider with transparent track and blue 'progress indicator' object behinf it", found in the last slide of the exemple (present in the first post).
I haven't found an exemple to explain how is it possible to realize this. Somebody could help me ?
that's a brillant example, congratulations for it!!! I have one question, on your last slide, on slider on bottom of the page, it becomes blue when you move the slider. I can not find how to make it....I succeed to change the comple track, but do not succeed to make it progressive and link to the slider...
Hi Michael, These are really well put together. Nice one. Keen to see how the system screen scrolling bar was put together. I imagine this involved quite a few state changes and slider increments to achieve this. Was it a series of images or one large image controlled through custom path animation? Cheers, Ray
@Ray, the window scroll was done with a slider and image object with quite a few custom states. The report image was very tall (4000+px), so it needed to be tiled. Motion path animations to move the image up/down would have worked as well.
that's a brillant example, congratulations for it!!! I have one question, on your last slide, on slider on bottom of the page, it becomes blue when you move the slider. I can not find how to make it....I succeed to change the comple track, but do not succeed to make it progressive and link to the slider...
How do you perform it?
Olivier
Sorry for the late response, I wasn't subscribed to this thread. That's a built-in slider with a hover state, that slightly changes color. I'm not sure what you mean by 'but do not succeed to make it progressive and link to the slider...'. The track on this slider was actually made transparent,I just created a scale out of Storyline objects, e.g. lines and pout them behind the slider.
Can you tell me, how to return slider to initial states, when i go to the next slide and then return to previous. Now my slider stay at that position from wich i leave the slide (
Can you tell me, how to return slider to initial states, when i go to the next slide and then return to previous. Now my slider stay at that position from wich i leave the slide (
Hi Kira, there is a variable attached to any slider. As you move the slider, the variable changes. This also, works the other way around; if you use a trigger to assign a new value to the variable, the slider will move to the position that reflects that value. You can use this to 'reset' your sliders. Add slide triggers that set your slider variables (and with that the sliders themselves) to their initial values when the slide's timeline starts. Hope that makes sense.
My question is: How was it able to click and drag the picture and the slider. Does that mean they created the triggers for each step? Mimicking that smooth left to right scroll? What did they use on the triggers? less than to greater than?
30 Replies
MIchael, I loved every one, I also love the ecg, saw the original post this morning and thought that would be so easy in Storyline 2
Great job!
Very nice. We are excited about Storyline 2. Hope to see a Demo soon and then paws crossed--lobby for an upgrade!
Thanks a lot. Great examples!!!
Thanks everyone, Storyline 2 made it sooo easy to build these!
StoryLion has been having quite a lot of fun with Sliders.
He asked me to personally thanks Arlyn and the team for them, as it makes his job so much easier.
Make sure you slide the first one backwards and forwards all the way
http://www.pperf.co.uk/StoryLion/Version2Sliders/story.html
Michael, beautiful work as usual. Bruce, love what you did...as I said in another post...such creativity!
Good stuff indeed.
Being able to scroll through a website simulation is going to a very nice to have.
Good stuff Michael. Nice collection and inspiring. Thanks for sharing!
Is there any possibility to get some tutorials on how the examples were created?
http://community.articulate.com/tutorials/products/working-with-sliders.aspx
Really nice post about the uses of sliders!
Can I just ask what software did you use to record the rotating of the device?
Hello everybody,
First I would like to say that sliders are very useful to improve our courses !
But have a question concerning the "Standard Slider with transparent track and blue 'progress indicator' object behinf it", found in the last slide of the exemple (present in the first post).
I haven't found an exemple to explain how is it possible to realize this. Somebody could help me ?
Thank you,
Alexandre.
Hi Michael,
that's a brillant example, congratulations for it!!!
I have one question, on your last slide, on slider on bottom of the page, it becomes blue when you move the slider. I can not find how to make it....I succeed to change the comple track, but do not succeed to make it progressive and link to the slider...
How do you perform it?
Olivier
Hi Michael, These are really well put together. Nice one. Keen to see how the system screen scrolling bar was put together. I imagine this involved quite a few state changes and slider increments to achieve this. Was it a series of images or one large image controlled through custom path animation? Cheers, Ray
@Ray, the window scroll was done with a slider and image object with quite a few custom states. The report image was very tall (4000+px), so it needed to be tiled. Motion path animations to move the image up/down would have worked as well.
Sorry for the late response, I wasn't subscribed to this thread. That's a built-in slider with a hover state, that slightly changes color. I'm not sure what you mean by 'but do not succeed to make it progressive and link to the slider...'. The track on this slider was actually made transparent,I just created a scale out of Storyline objects, e.g. lines and pout them behind the slider.
Hi Michael, your examples are the best!
Can you tell me, how to return slider to initial states, when i go to the next slide and then return to previous. Now my slider stay at that position from wich i leave the slide (
Hi Michael, Really excellent slider interactions and i like all designs.
Good Job!
Hi Kira, there is a variable attached to any slider. As you move the slider, the variable changes. This also, works the other way around; if you use a trigger to assign a new value to the variable, the slider will move to the position that reflects that value. You can use this to 'reset' your sliders. Add slide triggers that set your slider variables (and with that the sliders themselves) to their initial values when the slide's timeline starts. Hope that makes sense.
Would these be triggered? I am wondering what triggers you used to have the image scroll back and forth?
Hi Yan! This thread is a bit dated. Did you take a look at the information above in regards to using sliders?
My question is: How was it able to click and drag the picture and the slider. Does that mean they created the triggers for each step? Mimicking that smooth left to right scroll? What did they use on the triggers? less than to greater than?
For now States seems to work.
Hi Yan! Did you check out the solution that Michael shared here? I think seeing a file may help you understand how this works, and it is states.
I think Yan's question was about Bruce Graham's example.
This discussion is closed. You can start a new discussion or contact Articulate Support.