Do you want to know how to create a countdown timer in Storyline 3 or 360? In this video I’ll show you step by step how to set up a countdown timer in Storyline with triggers only and no javascript.
cta under video
Video Transcription
I have an new Storyline project So let’s build the countdown timer.
The first step is to create two variables in Storyline.
To do this I click on the right hand side on my screen on the variables icon.
Now the variables window opens. Now I click on the green plus sign to create the first variable.
My first variable is called minutes and is a numberd type variable
When I’m done I click on OK. And click the green plus sign again.
The second variable that I’m gonna create you’ve guessed it probably is called seconds. This is also a number type variable.
Now I have my variables for my countdown timer. The next step is to create the timer itself. I’ll do this on the master slide. So I’ll open the View tab and click ‘Slide Master’
I select the Master slide view and I will create a new layer. I’m going to use this layer as a timer.
I click the button ‘new layer’. Storyline adds a new layer. I call this new layer timer. Amd I’ll change the duration of this layer to 1 second by dragging the grey end bar to 1 second.
This layer will be my timer object in Articulate Storyline. I create an trigger that each time the layer end Storyline substracts one of my variable seconds. I also create a trigger that when the layer end Storyline will hide this layer and shows the same layer again. This is my seconds timer. I need one last action on the base layer of my master slide view that shows my timer layer the first time.
I click the new trigger icon and select show layer when timeline starts
Now let’s see if this works. I set the default value of the variable second to s60 and i add an textbox with a reference to the variable seconds to the slide layer and preview this module. To do this I go yo the insert tab select textbox I draw a textbox on my screen I click the insert tab again and I choose reference and select my seconds variable and click on ‘OK’.
Now let’s close the slide master view, I’ll add an extra slide to my project and preview my Articulate project.
You see my seconds counter works. It counts down from 60 till zero and it also works if I jump from one page to another.
Now let’s add triggers for our minutes timer. I add these trigger also on my master slide.
I’ll add an trigger that substracts one from the variable minutes on the condition that my seconds variable less then zero. Then I must reset the seconds variable to 59 again to start a new minute.
To see if this works I’ll select the master slide baser layer. Select my second textbox and type : and before this I’ll add the reference to the minute variable. I don’t want to wait a whole minute to see if this works so I’ll change the initial value of the second variable to 10. I close the slide mater view and preview my project.
To get my timer completely right the right time notation under ten 09 09 and so on.
