Bookmarking in Captivate (Classic and New) - Introduction

Intro

One of the new features in Charm (new version 12) release is the possibility to have bookmarks on any content slide. In Captivate Classic you bookmarks are only available on a slide with slide video (to create an interactive video.

What do you expect from a bookmark in its original meaning? Looking this up in multiple dictionaries, two possible meanings appear everywhere:

  1. A strip of leather, cardboard, or other material used to mark one's place in a book. It has a digital version in ebooks as well. In the digital world you'll find this has also become..
  2. A saved shortcut that directs your browser to a specific webpage.

I planned to summarize my experiences with bookmarking fo navigation purposes in one blog post.  However, after weeks of exploring, I realize this would lead to a short booklet instead of a short article, hence the decision to split the content up in multiple articles. Main purpose is to compare and explain the present differences between the new (Charm) version 12 and Classic Captivate.

This introduction will explain the terminology. A Captivate tutorial, demonstrating the terminology is inserted. This tutorial was created in version 11.5.5.553. Explanation of workflows both for New and Classic Captivate will follow in next articles.

Example

You can watch this 8-slide tutorial using this link (to be preferred) for a scalable version, or watch the embedded static version. Please turn on your audio, there is narration. Slide 7 is a long video slide, taken from one of the presentation in an online Adobe conference. Be patient, the Next button if you want to skip appears after 30secs.




Terminology

When you watch the example output below, you'll see that I see two types of bookmarks for navigation: static and dynamic. My choice of adjectives refers to what is used for text fields as well: static text doesn't include variables and when publishing the content is defined and will not be changed on runtime. Dynamic text fields, as you see on the score/results slide in a project with scored objects and/or question slides, need to be rendered on runtime, because they contain variables for which the value will be defined based on actions by the learner.

Static bookmark: is linked to a fixed frame on a fixed slide. Examples: start of an important part in an interactive video. It is a bit similar to what you can have in a Table of Content, but on frame instead of slide level. Have a look at this interactive video, where the menu uses static bookmarks to allow you to access them easily:

Custom Play/Pause button

Static bookmarks can also link to non-video slides, and are not limited to navigation within the same slide. That is valid both for version 12 (New) and Captivate Classic. However, due to the absence of bookmarks in Captivate Classic, you need to use Micro-navigation. If you want an intro to this type of navigation to frames, have a look at:

Intro to Micro-navigation

Dynamic bookmark: the frame for the bookmark can be chosen by the learner, and will allow to return to that frame if wanted. This is the closest digital equivalent to putting a real bookmark in a book after a reading session. The bookmark is created on runtime, reason why I use the adjective "dynamic", referring to the difference between static text and dynamic text. At this moment dynamic bookmarks can only be created in Captivate Classic, not in the New version 12.

Power of SVG Buttons

§Intro

In previous posts I have talked about the advantages and disadvantages of the 6 button types, and how you can edit the colors of SVG’s, even in states and when they are used as buttons. SVG’s, being vector images are excellent for use in projects to be viewed on multiple devices, whether it is a scalable non-responsive or a responsive project (fluid boxes or breakpoint views).

Unique about SVG’s used as buttons, is the fact that you have control over the clickable area, which is not the case for other  button types. In the example below you’ll see buttons which would have been impossible to realize with any other button type.

Example file

Watch this two-slide project. The Title slide is taken from the QSP ‘Legacy’ (non-responsive), but I have changed fonts (not fan of Arial). The second slide uses an edited master slide from that same QSP. Click the buttons in circular image in any sequence, and you can also reset the slide (used the Scenario 2 technique described in Replay Slide)

Setup Clickable Area

Six Buttons

The 6 buttons in the circular arrangement have overlapping bounding boxes. Have a look at this screenshot:


By unchecking the option ‘Enable Click in Bounding Box’ the clickable area will be limited to the space within the colored shapes, and those do not overlap. 

I kept only the Normal and Visited InBuilt states of the buttons . In the Visited state I added an icon (also SVG) from the Assets panel,  colored in the same color of the button (which was dimmed). That icon also covered up the number, which was part of the button SVG. Here is the Object state panel for button 6:

Reset Button

For this button I used an icon from the Assets panel. and added a text caption close to this button. The bounding box of the SVG is encreased so that the Reset text looks to be inside of the box. In this case The default option under the Style tab ‘Enable Click in Bounding Box’ remained checked. It now looks as if the learner can click both text and icon. I didn't use the padding option, which would make the icon smaller inside the bounding box.

Other Items

The information is stored in a multistate shape, where the Normal state is invisible (Alpha and Stroke set to 0). A two state shape is used for the final image, which is in a custom state of a circular shape. That circular shape also has an invisible Normal state. 

For the multistate objects the option ‘Retain State on Slide Revisit’ remains unchecked. Since the Reset button is re-entering the slide, all multistate objects will automatically revert to their Normal states.

Actions and variables were custom made, I didn’t use any of the click-reveal interactions from the QSP’s. Sorry about that, but I’m so used to create that type of interactivity that it comes almost naturally. One tracking variable for each buttons was needed to have the final image appear after all buttons have been clicked. 

D&D Feedback messages

Intro

Yesterday an interesting question appeared on the forum concerning Drag&Drop

The second question is answered in that thread, was about setting up the Accept for the drop target as I have already explained in previous blog posts. The first question however is at the base of this short article. I quote:

"Is it possible to show separate messages for cases such that the user not selecting the answer (Choose an answer msg) and selecting the wrong answer (Incorrect answer msg).  It currently shows 'Incorrect Answer' msg for both cases."

I asked for some details about the setup: 

  • Several drag sources, only one was correct
  • One drop target, based on my answer to the other question, it accepted all drag sources but only one by one. When dragging another source it would replace the first one.
  • Infinite Attempts

Drag&Drop confusions

Drag&Drop slide have some limitations such as: all drag sources and drop targets have to be on the slide from the first frame.  You can define it as a score slide or as a KC slide (see Drag&Drop Tips).  It has a lot of the behavior of a quiz slide, but it is not a full-blown quiz slide or KC side. Here are some points in its UI that I find really confusing and would love to see changed (logged feature requests about that since version 6):

  1. D&D slides are automatically pausing at 1.5secs but that is NOT visible on the Timeline, only in the Timing properties, whereas for quiz slides the pausing point is visible on the Timeline but NOT in the Timing Properties. This is confusing.
  2. D&D slides have an On Enter event and an On Exit event, whereas quiz slides only have an On Enter event. That is OK.
  3. Submit button both for D&D slides and for Quiz slides have one or two events, depending on the number of allowed attempts. For quiz slides, the actions triggered by those events will happen after the first step of the Submit process (where feedback messages appear), for D&D slides there is only one step in Submit process. That is OK, you just have to realize that.
  4. I talked about one or two events:
    1. If the number of attempts is limited you have two events: you allwasy have the Success event. That event and its linked action occur when the answer is validated and correct. That is fine, works the same for quiz and D&D slides. If you want to give the learner the time to read a Success message, which can appear automatically you have to leave some time to the learner by choosing the correct action On Success. Example: if you set the Success action to 'Go to Next Slide', learner will not be able to see a Success message. Change to 'Continue', and eventually increase the duration of the slide. Works fine, just that slight difference.
    2. If the number of attempts is limited, the second event is the Last Attempt event. That is indeed the indication in the Actions part of  the Quiz Properties.  The Failure message will always pop up with every Failure attempt, but the event that triggers an action only occurs when all attempts are exhausted. However in the Actions tab of a D&D slide it is wrongly labeled as Failure event. Many users  believe that the specified Failure action will occur for each Failure attempt which is NOT the case. This is confusing 
    3. If the number of attempts is unlimited you have only one event, the Success event. It is logical because you are supposed to try until you get the correct answer. For quiz/KC slides this is very clear because the Last Attempt event is dimmed when you choose for unlimited attempts. However for D&D slides the (alreadly wrongly labeled) Failure event is not dimmed, although it will never happend. This is very confusing IMO.

Sorry for this long explanation, needed to understand the workflow I explored to answer the question mentioned in the intro. I hope some of you, readers, will support my feature requests to 'repair' the UI and avoid confusion.

Workflow for  messages

User wanted to see a different message popping up:

  1. When the submit button is clicked but no drag action has been done
  2. When the submit button is clicked and the drag action was wrong

Both situations are considered Failures, but Failure doesn't generate an event until the last attempt. Since it is set to Unlimited Attempts, there will never be a Failure event. No way to replace the messages by custom text containers, if you cannot trigger advanced/shared  action on Failure.

The popup messages (Success, Failure) cannot be controlled, they don't have an ID.  You can create states for such a message, but since you cannot address the message, you cannot change the state by an action.

A possible solution is to replace the text in the Failure message by a variable, in this case I labeled it v_failure. It is possible to change the value of a variable. This is the screenshot in editing phaes of an example slide:

As default value on defining the variable I used the text to show when the learner has clicked the Submit button without doing any drag action:

The value of the variable has to change when at least one drag action has happened, which was not the correct action. Besides the events occurring after clicking the Submit button, D&D slides have also Object Actions. I will use those actions to assign another value to the variable v_failure. Open the dialog box in the Format tab for the selected drop target. In this very simple example, I used an Assign command as you see in this screenshot. I only needed it for the two wrong drag sources. For the correct source, no need to change the Failure message, since the Success message will appear. Since I used a simple action, needed to uncheck the box 'Continue Playing the Project'.

If you need to change a lot of those actions, and it is OK to have always the same Failure message, please create an advanced (oneline) action, will save you time when applying in the Object Actions. If you want a different feedback message for each wrong source, use either the Assign command (as above) or use a shared action.