States let you change the appearance of an object based on learner interaction. For example, you might enlarge a button when learners hover over it or add a glow effect when they click it. You can even change character expressions and poses with states. Most objects in Articulate Storyline support states, including pictures, shapes, captions, characters, markers, and buttons.

In this tutorial, we'll discuss the following topics. Click any topic to jump directly to that section.

Opening the States Panel

The Timeline, States, and Notes panel is only accessible in Slide View. If it isn't visible at the bottom of the screen, click the arrow in the lower right corner of the slide stage to open it.

Then select the States tab.

Adding States

By default, most objects in Storyline have one state (buttons have five), but you can add as many as you want. Select the object you want to modify and do the following:

  1. In the States panel, click Edit States.
  2. Click New State (the icon that looks like a blank piece of paper) to create an entirely new state, or click Duplicate State (the icon that looks like two pieces of paper) to create a copy of the selected state.
  3. Give your new state a name. You can either choose a built-in state from the drop-down list or enter a different name to create your own custom state.
  4. Click Add to create the new state.
  5. If you want to adjust the appearance of the state you just added, follow the steps in the next section.
  6. When you're finished, click Done Editing States.

Editing the Appearance of States

You can change the appearance of any state, including text, shape, color, effects, placement, size, and more. You can even add animations. If you're editing states for a character, you can also change the expression, pose, and perspective. Select the object you want to modify and do the following:

  1. In the States panel, click Edit States.
  2. Select the state you want to edit (or add a new state as described in the section above), then use the Storyline ribbon to make your changes. You can add and edit text, add and remove objects, change position, adjust formatting, edit characters, and apply animations.
  3. When you're finished, click Done Editing States.

If you need to reset a state to its original appearance while you are editing, click Reset State (the circular arrow).

While you're editing states for a particular object, the other slide elements will dim. If you don't want the slide to dim, uncheck the box to Dim background objects. This can be useful when you need to use the color picker to match the color of another object.

To save time when you need to edit states for multiple objects, use the Editing states on drop-down on the far right side of the States panel to switch between objects on the same slide. As you scroll through the items in the list, Storyline outlines them in red, so you can see which object you're selecting. Your changes to all objects will be saved when you click Done Editing States.

Deleting States

To delete a state, select the object you want to edit, then do the following:

  1. In the States panel, click the Edit States.
  2. Select the state you want to delete and click Delete State (or press the Delete key on your keyboard).
  3. Click Yes to confirm deletion.
  4. When you're finished editing, click Done Editing States.

Setting the Initial State of an Object

When an object has multiple states, it'll default to an initial state of Normal, but you can change that. (This is especially handy if you want an object to start out hidden.) Just select the object, then choose a state from the Initial state drop-down.

Triggering States

You don't need to add triggers for most built-in object states. For example, hover states will automatically work without adding any triggers. On the other hand, character states (expressions), must be triggered. (See this article for detailed descriptions of each built-in state.) Custom states must also be triggered. To learn about triggers, see this tutorial.