Setting up an Advanced Action Debug Mode

Before you begin developing in earnest using Captivate’s Variables and Advanced Actions to enhance the interactivity of your Captivate content, I recommend you take a few minutes to set up a debugging environment. Doing so can potentially save you many hours of frustration wondering why your carefully-crafted interactions are not working as you expected.

There are a number of ways you can achieve this, but in the example below I use Smart Shape Buttons because they can be timed to display for Rest of Project and are therefore available for view on any slide after the point where they are inserted.


How to set up a DEBUG slide in Captivate

First we need to insert a Smart Shape timed to display for Rest of Project. This shape displays values of any important User Variables you need to check at some point. We use a Conditional Action (triggered by other Smart Shape Buttons) to toggle the visibility of this shape when it needs to be seen.

  1. Insert a new slide near the beginning of your project file or project template, but not as the very first slide. (Having too much complexity on the very first slide of a Captivate project is never a good idea because too much is happening in the background as that slide is loading.) Use graphics and captions to clearly indicate this slide is a debugging slide.
  2. Create a User Variable called DEBUG_MODE_ON, set to 0 by default, and another called DEBUG_MODE_INDICATOR_TEXT which contains whatever text you want to have showing as the label of the toggle button used to Show or Hide your debug variables. I set mine with a default value of DEBUG IS OFF.
  3. Insert another Smart Shape and select the option in Properties tab to Use as button so that it becomes a Smart Shape Button. Set the button timing to display for Rest of Project. You’ll need to make this button reasonably small and place it in an area at the top or bottom of the slide so that it will not end up in the way of other controls when testing the content at run-time but can still be easily clicked.
  4. Double-click this Smart Shape Button to add text and from the Properties tab, click the Insert Variable button. When the Insert Variable dialog appears, select the DEBUG_MODE_INDICATOR_TEXT variable from the User Variable list and click OK. This variable’s current value will now be displayed as the button label.  We will be changing the value of this variable later when the debug display is being toggled on and off.
  5. Insert a second Smart Shape and resize it to cover most of the slide but place it so that it does not cover your toggle button shape. This object displays any user variables you want to view at run-time. So add some explanatory text at the top to make it obvious.
  6. Both Smart Shapes should be situated at the very top of the layers on the DEBUG slide, and both should be set to display for Rest of Project. Only one is set to Use as Button. To make these objects easier to find, give them meaningful Item Names (as shown below).
  7. Now we need to create the conditional action that will toggle the visibility of the Smart Shape displaying your user variables. That conditional action looks like this:
  8. Test the functionality of the debug slide by clicking the Smart Shape button that triggers the Conditional Action to Show or Hide the Smart Shape that displays variable values.  If clicking the button shows and hides the shape as intended, so far so good. The label text in the button should change from DEBUG IS OFF when the variables are hidden, to DEBUG IS ON when they are visible.

Although your debug slide is ready for use, you may want to simply Hide it in the filmstrip until you actually need it.  Hiding a slide prevents it from being published in the output.  You definitely will NOT want this slide to become visible to your end users when the project eventually goes live.  So, be sure to hide the slide again before the final publishing of your course content for delivery.


How DEBUG MODE works

Now that you have everything setup, if you encounter any issues with Captivate’s interactivity, just go to the debug slide and into the large Smart Shape there (not the button) insert all variables that are related to the problematic functionality.  This would especially include any variables that are directly referenced by Conditional Actions, or that are dynamically assigned values by other Actions, Advanced Actions or Shared Actions.

Then unhide the DEBUG slide, preview your project as HTML or else publish to HTML5, and click the debug Smart Shape button to toggle the visibility of the other Smart Shape that displays the debugging variables.

When you have finished debugging, just hide your DEBUG slide again to turn off DEBUG MODE and immediately disable your debugging environment. That’s all there is to it!

In most cases what you will find is that some variable is not changing to the value you expected and that is why things are not working properly.  In my experience faulty logic in Conditional Actions is the usual reason for unexpected interaction behaviour. The big gotcha for many newbie Captivate developers is that all decision blocks in a Conditional Action get executed, not just the one where the condition evaluates to true. The order of the decisions is particularly important because a later decision may be changing the value of a variable that was correctly assigned by an earlier decision block. So, make sure you correctly understand how these work in Captivate. You can spend many fruitless hours debugging these things unless you can expose the values of the variables.


Can’t fit all your variables in one shape? Use two, or three!

One caption is usually sufficient to display all variables you need to monitor. However, you can add more captions to the debug slide if needed. Just place the rollover areas or toggle buttons side by side at the top of the slide so that you can call up each relevant caption or shape.

Add debugging to your project templates!

Since I started using this approach I’ve found it so useful when creating complex interactivity in Captivate that I now have this debugging environment built into any project templates I set up when working with clients for whom I create courseware.