Custom timeline slider

Nov 06, 2017

Hi everyone!

I am currently developing a course that contains a custom player/skin. That means we are not using default storyline player nor controls. 

We have been able to design most of the classic controls such as play, stop, next/previous slide, volume, etc. but our client has asked us to design a custom slider that moves the slide timeline. We have been trying to look for a possible solutions, but as long as we know, this is going to be rather impossible on storyline 3/360. 

Do you have any advice? 

Thanks very much for your help guys. 

Miguel. 

7 Replies
Miguel Herraiz

Hi Daniel,

Thanks very much for your help! I've downloaded it and it is not exactly what I was looking for, maybe I didn't explain it properly.

What I meant was how to insert, into a custom player skin, a seekbar that allows the user to drag it back and forth. It is basically the same function as the default one that is included in the Storyline player.

This is our seekbar:

This one only shows remaining time on each slide, but the user cannot drag it back and forth. We are looking for something similar to default storyline seekbar but customised.

Thanks again :)

Miguel.

Godwin Vinny Carole

Hello Miguel,

I had just the same requirement from one of our clients as well. They wanted a custom seekbar that behaves like the default one but with different styling that matches with the custom player we have been using for their courses.

To fulfill their requirement I have created a seekbar widget which can be inserted in any storyline 360 project as a web object.

I have created a Music player sample in storyline 360 and added our Custom seekbar widget:

 Custom-HTML5-timeline-for-Articulate-Storyline-3-or-360

If this is what you are looking for, I wrote a blog on how to use my Custom Seekbar Widget. Feel free to check it out and you can also download my music player sample as well as the seekbar widget from my blog.

Hope this helps you out.

Cheers!