Scenario: You have some interactive buttons in your course content that are disabled at certain times. But since disabling an interactive object in Adobe Captivate does not change its appearance in any way, users are often unaware of an object’s inactive state. Some users are even becoming frustrated and complaining about interactive objects that don’t respond, believing they have found a glitch in your course interactivity.
How can you ensure that users find your interactions more intuitive to use, especially when some objects should NOT be used?
Techniques required to solve this issue
You need to provide visual feedback that makes it obvious and intuitive to users which interactive objects can be clicked and which cannot. One common way software interfaces show disabled state is by ‘greying out’ or fading the appearance of the object.
The easiest way to provide visual feedback is by hiding and showing objects as discussed below.
- Navigate to a slide containing interactive objects that will be disabled at some point.
- Place a slightly transparent object such as a Highlight Box or Shape over the top of the interactive object. The screenshot below shows a white highlight box set to 60% opacity placed over the top of a button of the same size.
- Create a standard advanced action to Disable the interactive object and Show this slightly transparent object on top at the same time.
- Add any other actions that the interactive object is required to take (e.g. navigating to a different slide, showing or hiding other slide objects, setting any variables).
- Make sure you set the On Success event of the interactive object to execute this advanced action.
Enhancing the effect with extra images
- If deemed necessary, you can make it even more apparent to the user that an object is disabled by inserting an image that is universally understood to mean something is disabled or not allowed, and placing this image near or on top of the interactive object (as shown).
- Modify your standard actions to Show this image in addition to disabling the interactive object and showing the faded highlight box on top.
At run-time the disabled object looks like this…
Why not just use Advanced Actions to apply Captivate Effects to disabled objects?
If only it were that simple,...but unfortunately it's not. Many Adobe Captivate developers try to use advanced actions with the Apply Effect action to manipulate an object’s Alpha or Brightness percentage at run-time. However, unfortunately this does not work as expected because Captivate provides no way to manipulate the timing of effects applied by advanced actions. So the effect usually just lasts for a few seconds and then disappears again. This is another one of those areas where we hope Adobe will improve Captivate in future.
If you liked this topic, you'll also like these...
- Limit interactive objects to a single use
Learn how to disable a button after it has been clicked once, or disable a Text-entry Box after a user has entered information.
- Replacing an actual interactive object with an image that shows it in a disabled state
For most users the way feedback is provided above would suffice, but if you want to take it even further, you can try
- Dynamically enable or disable interactive objects based on user variables
This is a great technique that can be used in learning games.