Work with multi-state objects in Adobe Captivate

Objects can have multiple states within Captivate. This feature allows you to develop interactive content easily without using multiple objects, or "hide and show" techniques in a single project.

Using  a single object with multiple states, you can unclutter your project timeline and reduce timeline complexity. For example, to change image color based on user's actions, you can use different colored states for a single image.

To work with multi-state objects, keep these features of multi-state objects in mind:

• Each object now can have multiple states. 
• Interactive objects have in-built states. 
• Users can customize the states of static and interactive objects. 
• Button and smart shapes have in-built states with associated styles. 
• Objects with multiple states can be added to regular slides only.

All smart shapes, text captions, objects, and media can have multiple states.

Question slide buttons, and drag-and-drop buttons do not support states.

Add states to an object

Move objects and their states

When you move an object that has multiple states, by default the respective states and additional state items move in relation to the object.

Delete/reset state

While creating the states, to go back to normal state, right-click on any state in the left pane, and choose reset state.

You can delete any states apart from default and normal state of an object. Delete and reset states options are available in the right-click pop-up window of state. 

To exit State view and return to your slide, click exit state button in the toolbar. 

Objects and their in-built states

Captivate provides the following in-built states that you can customize according to your requirement. You can choose the type by using the State drop-down and clicking each state.

The default state for every object is Normal.

You can add new states using Property inspector and also make your states as default state for an object. To make your state the default state, simply choose the state, click the drop-down icon next it, and make it the default state.

You can pre-define project properties for normal, down and rollover states in Object Style Manager as well. 

Effects behavior when objects have multiple states

When an effect is added to an object, the effect is applicable for all the states of an object. 

In addition, an effect plays across all states of an object. For example, if an object changes state mid-effect, the behavior of the effect does not change in any way.

Sample usage

Some samples depicting the usage of object states during interactive content development are shown below:

Scenario 1  - To change the colors of the dress (object) based on user's click action on respective color codes (shown below the object). 

Scenario 2 - To use characters to demonstrate the response for users choice in question slide, use object states and change the character's actions.

Property flow for multi-state objects in responsive projects

Property flow in a responsive project is across all states and views.

Captivate maintains a parent-child relationship among the breakpoints from Desktop-to-Tablet views and Tablet-to-Mobile views respectively. The object states created in a particular breakpoint flow to the lower breakpoint views unless you modify the state for a particular view and break the link.

Example to demonstrate this relationship

For example, if you create a button, and add/edit states in a responsive project, the object and its states get added in all the other breakpoints.

If you make any edits to these object states in Desktop view, these edits are present in all the other breakpoints. 

If you make any edits to these object states in Tablet Portrait breakpoint, the link between the Tablet Portrait breakpoint and the Desktop breakpoint breaks. The object changes in the Desktop view no longer reflect in the Tablet Portrait and Mobile views. The objects in the Mobile view now reflect any object changes in the Tablet Portrait view.

Example to demonstrate how the relationship breaks

Consider the following example.

User adds a text entry box to the slide, selects the object, and clicks State View on the Property Inspector. User is working in Desktop view.

The State View opens showing the default states of the text entry box that are available. You can edit these states or create more states.

User edits the properties of the in-built states, or creates a state. In this example, the text entry box is made transparent in the Down state so that when a learner presses the Submit button, the button becomes transparent.

This change to the object state (which is done in Desktop view) flows across all the breakpoints. 

User next goes to the Tablet Portrait view and edits the Down state further. If these changes deal with responsive properties such as character properties, position, or size then the link between the Desktop view and the Tablet Portrait view breaks. The Desktop view does not reflect these changes.

From now on, all changes done in the Tablet Portrait view (for that object) flow to the mobile views.

Best practices to follow

• Customize the normal state of the object before you add custom states
• Mark the Smart shape as a button before you customize button properties 

Object properties that do not flow across states

There are some object properties that do not flow across states. 

Properties such as shadow and reflection, text effects, and audio properties do not flow across states. For example, if you have an object with multiple states, and if you add a glow to it, the glow is not visible in the other states. Add the glow again to all the states.

In addition, text with different formats applied to it does not automatically flow across states.

Consider the below example. The word different has a different format applied to it. You can see that the formatting has not flowed to the new state.

To make this text flow across states, right-click the text and select Apply text to all states.

Multi-state objects in drag and drop interactions

Drag and drop interactions provide lot of options where you can use the multi-state nature of objects.

Consider this simple drag-and-drop interaction (choose the correct answer) example below.

In the above interaction, the LDAP oval object is the drag target and the rectangular options on the right are the drag sources. The correct answer 389 is mapped to the LDAP drag target.

Each of these drop sources and the drop target have multiple states that you can customize to enhance the appearance and function of this interaction.

Add all these in-built states by selecting the object and clicking +  in the Object State panel in the Property Inspector.

You can set the appearance of each state of the drop target and drop source objects.

Drop target:

• DragOver: This is the state of the object when the learner drags a source over the target. 
• DropAccept: This is the state of the object when the learner drops an acceptable source over the target.
• DropReject: This is the state of the object when the learner drops an unacceptable source over the target.
• DropCorrect: This is the state of the object when the learner drops the correct answer over the target and submits the answer.
• DropIncorrect: This is the state of the object when the learner drops the incorrect answer over the target and submits the answer.

Similar to the drop target, you can add the in-built states to the drop source as well.

Drop source:

• DragOver: This is the state of the object when you drag it over the target. 
• DropAccept: This is the state of the object when you drag the acceptable source to the target.
• DropReject: This is the state of the object when you drag the unacceptable source to the target.
• DragStart: This is the state of the object when you start to drag the source toward the target. 

From an expert: Adobe Captivate and Multistate Objects

Download sample projects

To learn more about Captivate and how you can create engaging learning content, download the following projects:

• Safeguarding-and-PII Compliance
• Picture-Perfect Simulation
• Adobe Captivate Draft
• CloudAir SoftSkills
• Captivate 9 eLearning
• Adobe Lead Generation
• Adobe Captivate 2017 Training