Created by Smart Sparrow


The Timer widget can be used to provide a timed activity for learners.

Unique ways to use this widget

There are multiple ways you can set up and use this widget. For example:

  • You can time learners on a single screen or across the entire lesson to imitate a “timed exam”.
  • You can make the Timer invisible and use it to push students through a lesson at regular intervals as a way of presenting content like a continuous slideshow — or to ensure they don’t spend too long on one screen/activity.
  • You can use the “Change an object on the screen” Action in your Trap State to make the Timer trigger different a change to the current screen.
  • You can build trap state conditions that point to the time spent or remaining. You can make the Timer automatically trigger a Trap State when the Timer reaches 0 or a predefined maximum time.


Have a play


Basic setup instructions

  1. Copy the widget link by clicking on the Get Component button at the top of this page.
  2. In the Author Tool, add a blank component from the Components tab and resize it to your liking.
  3. Paste the url that you’ve just copied into the Component’s source.
  4. With the component selected, Click on Configure and select Options to set it up. The Timer widget is set entirely via the options menu:
    • Sim ID gives each instance of the Timer a unique identifier - this is required since the timer can run when students are not in a lesson.
    • Counting Behavior has three modes, which describe what happens when the student leaves the screen the timer is on
      • Continuous timers will count even when the student leaves the screen or lesson, until they reach 0:00. This mode can be used to give students a specific amount of time on an entire lesson or section of a lesson.
      • Suspends will halt the timer count until the student returns to the screen.
      • Resets will reset the timer count every time the student accesses the screen. This is the most common use of the timer, employed when the goal is to give students a specific amount of time to respond to the prompt on a single screen.
    • Counting Behavior has three modes, which describe what happens when the student leaves the screen the timer is on
    • Time Limit is the time, in seconds, that must elapse before the timer triggers a check event.
    • Display Mode toggles between a count down and count up display for the timer. Regardless of display mode, a check event will be triggered when the time limit is reached.
    • Invisible toggles whether the timer is visible to the student.
    • Always Show Minutes toggles whether the minute place is always shown. On screens with timers less than 1 minute, toggling Always Show Minutes to off will result in a cleaner appearance.
    • CSS classes can be inserted in the CSS field in Options.
    • Time Remaining will display the time remaining on the timer.
  5. Once you’re done, open the Options menu and change the Mode to Student.
  6. Have a look at the CAPI table desciption at the bottom of the article for more information on what you can do.



  • Q: Why is the Timer at 0 when I preview the screen? A: This is most likely because you have the timer set to “Continuous” mode, which means that the timer will continuously count up or down from the first time you visit this screen. So, if you’ve visited the screen before, it’s likely that the Timer has already counted down to 0. To preview properly, set the Timer to “Resets” while previewing, and then change it back to “Continuous” when you deploy to students (if this is the functionality you want to use). See the table above for summary of what these properties do.
  • Q: Why do I need to give each Timer a unique “ID”? A: The Timer widget is special because it can keep running even while students aren’t currently in the lesson. Giving the Timer an ID keeps its data synchronized with the Platform, which is especially necessary if you’re using multiple Timers in one lesson. See the table above for more details.


Component Properties

Properties available for creating trap states or configuring your questions.

Property Purpose Type
Config.Sim ID
Sim ID
Config.Counting Behaviour
Counting Behaviour
Config.Time Limit
Time Limit
Visual.Display Mode
Display Mode
Count Down
Count Up
Whether timer is visible
Visual.Always Show Minutes
Whether minutes should be always shown
Custom Css
Data.Time Remaining
Time Remaining


Advanced Setup

Contact our team for help setting up the widget and trap states in your lessons.

Want to work with us to create your own component?
Request services