In this tutorial, you’ll learn how to use text, number, and true/false variables in Storyline to display dynamic content and create conditional interactions.

Variables empower you to build any interaction you can imagine. And the good news is you don't have to know anything about coding!

Watch this video introduction, then follow the activities below to practice.

Practice Activities:

  1. Create an Interaction with a Text Variable
  2. Create an Interaction with a Number Variable
  3. Create an Interaction with a True/False Variable

Practice Activity: Create an Interaction with a Text Variable

In this activity, you’ll use a text variable to collect information from the learner, then dynamically display it later in the course. Watch this video, then follow the practice steps below.

  1. Open the Storyline folder in your practice files, then open the 03G_Variables_360.story file and go to slide 2.4.
  1. First, we need to add a data-entry field to capture input from the learner. Go to the Insert tab on the ribbon, click Input, and select Text-Entry Field. Then, click the slide above the Submit button. A text-entry field will be added to the slide. Adjust its size, placement, and formatting as you’d like.
  2. Storyline automatically creates a text variable for you when you add a text-entry field to your project. The default name for the variable is TextEntry, but you can give it a more descriptive name. Just click the Variables button (looks like an “x” in parentheses) in the Triggers panel, then double-click the TextEntry variable and rename it YourName. Click OK to close the variables window.
  3. Now that you have a text-entry field to capture the learner’s name and a variable to store it, you can use variable references to display it anywhere in the course.

    Go to the next slide in your project file—slide 2.5. Click the text box and place your cursor just before the period. Then go to the Insert tab on the ribbon, click Reference, and double-click YourName.

    Notice that Storyline adds %YourName% to the text box. Storyline will replace the variable name with the actual value in your published output.

That’s all there is to it. Click the Preview drop-down arrow on the ribbon and choose This Scene to test your interaction.

Bonus: Watch this video to see another text-variable demo.

Practice Activity: Create an Interaction with a Number Variable

Number variables can hold static values, or you can make them random by entering starting and ending values for a range of numbers. We'll use static numbers in this activity, and you can learn more about random number variables in this article.

In this activity, you’ll use a number variable to count how many times the learner clicks an incorrect answer, then display feedback after three unsuccessful attempts.

First, we need to create a number variable for our interaction.

  1. Open the Storyline folder in your practice files, then open the 03G_Variables_360.story file and go to slide 1.2.
  2. Click the Variables button (looks like an “x” in parentheses) in the Triggers panel, then click the plus sign in the lower left corner of the window that appears to create a new variable.
  3. Call your variable Count3Clicks, select the Number type, and give it a starting value of 0.
  4. Click OK twice to save your new variable and close the variables window.

Next, create a trigger for each incorrect response that increases the value of your number variable by 1.

  1. Select the flashlight object on the slide, then click the Create a new trigger button (looks like a blank piece of paper) in the Triggers panel.
  2. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Adjust variable
    • Variable: Count3Clicks
    • Operator: + Add
    • Value: Value of 1
    • When: User clicks
    • Object: flashlight
  3. Now that you’ve created one trigger, you can copy and paste it onto the other objects. Select the trigger you just created and click the Copy button in the triggers panel.
  4. Select the hotdogs, water, and radio objects on the slide, then click the Paste button in the triggers panel.

Now let’s add a conditional trigger that displays the Try Again layer when the number variable equals 3.

  1. Click the Create a new trigger button in the Triggers panel.
  2. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Show layer
    • Layer: Try Again
    • When: Variable changes
    • Object: Count3Clicks
  3. We need to add a condition to this trigger so it only fires if the number variable has a value of 3. Click the Show Conditions button, then click the plus sign in the lower right corner of the window to add a condition.
  4. Assign these parameters to the condition, then click OK to save the condition.
    • List: Variables
    • If: Count3Clicks
    • Operator: == Equal to
    • Type: Value
    • Value: 3
  5. Click OK to save the new trigger.

We need to add two triggers to the Try Again layer so the learner can try again—one trigger that closes the Try Again layer and another that resets the number variable to a value of 0.

  1. Select the Try Again layer in the slide layers panel in the lower right corner.
  2. Click the Create a new trigger button in the Triggers panel to create a trigger that closes the Try Again layer.
  3. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Hide layer
    • Layer: This Layer
    • When: User clicks
    • Object: Multiply shape
  4. Click the Create a new trigger button in the Triggers panel again to create a trigger that resets your number variable.
  5. When the trigger wizard appears, assign the following values to your trigger and click OK.
    • Action: Adjust variable
    • Variable: Count3Clicks
    • Operator: = Assignment
    • Value: Value of 0
    • When: User clicks
    • Object: Multiply shape

Lastly, we need a trigger to show the Great Job layer when the learner responds correctly.

  1. Select the hotdogs object, then click the Create a new trigger button in the Triggers panel.
  2. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Show layer
    • Layer: Great Job
    • When: User clicks
    • Object: hotdogs

Now you’re ready to test your interaction. Click the Preview drop-down arrow on the ribbon and choose This Slide. It’s amazing what you can do with variables and triggers, right?

Practice Activity: Create an Interaction with a True/False Variable

In this activity, you’ll use a true/false variable to dynamically display a visited state for a section of a course when a learner has completed it.

First, we need to add triggers that jump back and forth between our practice slides.

  1. Open the Storyline folder in your practice files, then open the 03G_Variables_360.story file and go to slide 3.3.
  2. Select the Go button beside Module One, then click the Create a new trigger button in the Triggers panel.
  3. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Jump to slide
    • Slide: next slide
    • When: User clicks
    • Object: Mod 1
  4. Go to slide 3.4, select the Back button, then click the Create a new trigger button in the Triggers panel.
  5. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Jump to slide
    • Slide: 3.3
    • When: User clicks
    • Object: Back BTN

Next, let’s add a true/false variable and a trigger to track the learner’s progress.

  1. Click the Variables button (looks like an “x” in parentheses) in the Triggers panel, then click the plus sign in the lower left corner of the window that appears to create a new variable.
  2. Call your variable Mod1Complete, select the True/False type, and give it a starting value of False.
  3. Click OK twice to save your new variable and close the variables window.
  4. Select the Back button, then click the Create a new trigger button in the Triggers panel.
  5. When the trigger wizard appears, assign these values to your trigger and click OK.
    • Action: Adjust variable
    • Variable: Mod1Complete
    • Operator: = Assignment
    • Value: Value of True
    • When: User clicks
    • Object: Back BTN
  6. Trigger order matters. Storyline executes triggers in the order they appear in the Triggers panel. In this case, we need the adjust-variable trigger we just created to fire before the jump-to-slide trigger we created earlier. So, select the adjust-variable trigger you just created, then use the Up Arrow to move it up above the jump-to-slide trigger.

Now that we have a variable to track the learner’s progress, we can change the state of the Go button when the learner completes the module.

  1. Select the Go button beside Module One, then click the Create a new trigger button in the Triggers panel.
  2. When the trigger wizard appears, assign these values to your trigger (but don’t click OK yet).
    • Action: Change state of
    • On Object: Mod 1
    • To State: Complete
    • When: Timeline starts
    • Object: 3.3
  3. We need to add a condition to this trigger so it only fires if the true/false variable is true. Click the Show Conditions button, then click the plus sign in the lower right corner of the window to add a condition.
  4. Assign these parameters to the condition, then click OK to save the condition.
    • List: Variables
    • If: Mod1Complete
    • Operator: == Equal to
    • Type: Value
    • Value: True
  5. Click OK to save the new trigger.

Now you’re ready to test your interaction. Click the Preview drop-down arrow on the ribbon and choose This Scene.

Summary

In this tutorial, you learned how to use text, number, and true/false variables. To learn more about interacting with variables, see these user guides:

In the next tutorial, we’ll create a slider interaction.