Custom Hotspot questions in Captivate 8

Update

If you are using CP2019, version 11.5 where you can use SVGs as buttons, with possible limitation of the clickable area to the image itself instead of the bounding box, have a look at this updated version of a custom hotspot question:

SVGs for Hotspot question

Intro

A couple of weeks ago I presented a session 'Enhance Effectiveness of Quizzes in Captivate 8' at DevLearn 2014. One of the subjects that I barely was able to tackle due to lack of time, is the creation of custom questions. You'll find several blog posts where I created custom questions using standard objects, widgets and learning interactions. On the forums I often suggest to replace the default hotspot questions by custom questions. And finally find the time to explain why I recommend this. The success of the Quiz blog posts and of this BYOL session at DevLearn make me wondering if an e-book with focus on Quizzing would be welcomed by the community? Looking for comments on that plan.

Why?

The default hotspot question slide has some limitations. Here are the ones I find most frustrating:
  • hotspots are always rectangular
  • it is not possible to have partial scoring
  • you cannot add shape buttons to that type of slide, because any space outside of the correct hotspots causes failure
Thanks to my favourite Captivate object, the shape button, it is pretty easy to create a scored custom hotspot question with
  • freeform hotspots
  • partial scoring, that can be reported to a LMS by SCORM
  • allowing to add shape buttons for more functionality

Why not?

What are the disadvantages of a custom hotspot question slide compared with the default hotspot question slide;
  • custom question slides always take more time (although shared actions can help), especially if you want to add all question functionality (Clear, Retake etc...)
  • if you like the animations that appear on clicked hotspots, they are not added automatically in custom hotspots, there is of course a way of showing the clicked hotspots
  • although the total score will be correct when using partial scoring, some quizzing system vars will consider each correct hotspot as being a separate question; you have to be careful when using a default score slide, in which you show number of questions/correct questions
  • it is not possible to use custom questions in a question pool

Example

Watch this movie. After the intro slide you'll see two Hotspot questions. Both questions have partial scoring. The fourth slide is the default score slide, to show how each correct hotspot is considered to be a question as is the case with all scored objects. To remediate, I added a custom score slide as last slide (use Continue button on the 4th slide). I didn't create a Reset or Retake situation. If you want to replay, refresh the browser window. Good luck!

Concept Hotspot Question - version 1

This question slide has one big shape button behind four shape buttons that indicate the form of the four countries to be clicked. The big shape button when clicked, will track a wrong click. I used 3 variables for this question:
  • v_attempt: number allowed attempts; will be reused for second question, number is assigned by On Enter action
  • v_counter: counts the clicks, to be compared with v_attempt;  will be reused for second question, reset to 0 by On Enter action
  • v_wrong: counts the mistakes, is not reset because it will continue to increment on second question, is used on custom score slide.
Here you see the timeline of this slide. The correct hotspots, shape buttons, have been duplicated to create the covers that are normal shapes with a texture fill. 

For the incorrect hotspot (shape button) I created a conditional advanced action with two decisions:
  1. "Always" is a mimicked standard action, self-explanatory. Because this hotspot can be clicked multiple times, the last statement is necessary to place the playhead one frame back, in the active portion of the shape button.

  2. "ShowNext" checks if the number of allowed attempts is reached, and if that is the case will hide all the hotspots and shows the Next button.

For the correct hotspots, that allow only one click, I created a shared action with two decisions

  1. "Always" is a mimicked standard action, self-explanatory. The parameters are highlighted.

  2. "Checker" is similar to the second decision for the incorrect hotspot. Parameters are highlighted.

The On Enter action for this slide is a standard shared action that resets the value of v_counter and v_wrong to 0 and assigns a value to v_attempt.


Concept Hotspot Question - version 2

I will not explain this question as extensively as version 1 (maybe in a planned book about Quizzes). It has multiple incorrect hotspots, and uses an extra variable v_scorehot. Try to figure it out. As a tip, this was my timeline:

Comments?

As always I welcome comments about this example. As mentioned in the Intro, I would also like to know if you'd appreciate a book explaining the design, the tweaking possibilities and custom questions for Captivate quizzing.

Controlling the score slide!

Intro

For sure that you already have used Quizzes in Captivate. And I suspect that sometimes you were frustrated by lack of control over Question slides and over the resulting Score slide? Such like not being able to add interactive objects like buttons on those slides, not having access to the timeline of buttons and objects, limited possibilities of actions attached to the buttons, etc. Last week I proposed workarounds concerning the Score slide on the Captivate user forums and thought they could be interesting to other users. Again, I am grateful to those who provide ideas for this blog and help me by stimulating my creative mind.
 
 

Questions 

  1. The first question was about the new functionality in Captivate 5 to have Quiz results posted to acrobat.com or to an internal server. When using this feature, a button 'Post Result' will be added to the Score slide. This button appears at the same moment as the Continue button, and eventually the buttons Retake Quiz/Review Quiz. To be sure that the user posts the results, and not just click on Continue, I was asked if the button Continue could be delayed until the user had posted his results?

  2. Second question was about being able to have audio played when entering the Score slide, based on the score: different audio clip depending on the Pass/Fail status. Although it is possible out of the box to play audio after clicking the Continue button on the Score slide, for having this at entering the slide I had to look for a workaround.

Result

Play with this movie to watch the result of the proposed workarounds
 



Workarounds

Delaying Continue button

It is not possible to time the buttons on the score slide, their timelines are hidden. For this workaround I feel like cheating on Captivate and the users:
  • Make the button Continue invisible: change its style to Transparent and delete the text 'Continue' (first image in the Gallery shows properties); then I did shrink the button to a very small one and put it somewhere on the slide where the user probably never will try to click.

  • Attach a shortcut key Enter (feel free to choose another one) to this button.

  • Increment the slide duration and move the pausing point towards the end (second image in the Gallery shows the Timeline of the Score slide). In this example the duration is 10 secs and the pausing is set at 9 secs.

  • Create a Text Caption that appears just before the pausing (in the example at 8,9 secs); in this Text Caption the user is instructed to use the shortcut key to continue (after posting of course).
The idea is that the user will only see, for a reasonably long time, only the button 'Post Result'
and thus will be pushed at posting them. To me 9 secs seems a very long time, but perhaps you will have adapt them to your public.
 

Audio on entering Score slide

Here I based the workaround on a condition advanced action, labeled CheckScore and triggered on entering the score slide, and on the fact that object audio will only play when the object is visible. This is the proposed workflow:
  • Add two rectangles to the Score slide (see second image in Gallery), labeled PassAudio and FailAudio. They have audio clips attached to them (I used clips from the default Sound Library of Cp). They are totally invisible, because the stroke width is set to 0px and the fill color to 0% Alpha. Beware: even though they are physically invisible, you still have to deactivate 'Visible' in the properties panel to avoid that the audio plays automatically when entering the slide.

  • Create an advanced conditional action CheckScore, triggered on entering the Score slide. You can see that action in images 3&4 of the Gallery. It checks the system variable cpQuizInfoPointsScored, and based on the check shows either the rectangle PassAudio or FailAudio. The result is that one of both audio clips will play on entering the score slide.
Of course you can improve the workflow: having more than two possible audio clips by creating a more complex conditional action, showing images as well as audio clips, adding voice overs, etc.
 
Thanks for taking the Quiz and reading this post. Please feel free to add comments or suggest other topics.

 

Customize your Quiz using Advanced Actions (CP5)

Captivate has a lot of predefined question slides on board of all kinds. Formatting options have been greatly improved in version 5 using the Object Style Manager and the Property Inspector. But those Question slides are different from normal slides, and you have much less control over them. Just some examples:

  • you do not see the different objects on the Timeline, it shows only one 'interactive object', although you have a lot of Text Captions, dropdown lists, Text Entry Boxes and buttons on the slide
  • you can have only one type of Question on a slide,
  • the score for a Question slide is always 'black/white', correct or incorrect, you can never have a partial score
  • you can add only non interactive objects on the Question slide (no buttons, no click boxes, no Text Entry Boxes)
  • you can customize the success/failure captions for each Question slide
  • even have up to 3 different failure captions but... Review message wiil be the same for all Question slides

To have more control you can create your own Question slides. Of course this is possible using Flash (or Dreamweaver). Using standard objects, variables and Advanced actions can however result in constructing most of the Question slide types, except for the types that involve drag-and-drop (as can be used in Sequence and Matching Questions). I published several articles for different usecases. In the articles I provide a Captivate SWF to show the result and start files (for downloading), to enable you to practice the workflow described in the article. Here are the links:

  1. Creating a test resulting in multiple scores: using Advanced Standard and Conditional actions you will construct a test that will collect scores about the learning type of the user (Auditory, Visual, Kinesthetic). Contrary to a normal Quiz resulting in one score, here you will obtain three scores. Those scores will be used in the next article:

  2. Conclusion based on multiple scores: based on scores obtained in the previous article, you will use one Advanced Standard and one Advanced Conditional action to show the conclusion. I meant this article to be an introduction to the new User Interface of Advanced actions.

  3. Create question slides with partial scoring and customized feedback: one of the issues with the default Captivate Question slides is that the user never can get partial scores if his answer is partially correct. In this article I created a hotspot question slide with multiple hotspots and the user can get a partial score.

  4. Create customized feedback: in this video tutorial you will learn how to use an Advanced Conditional action (with multiple decisions) to show differentiated feedback based on the score of a Quiz constructed with the default Question slides of Captivate. This video is meant as an introduction in the terminology and workflow of Conditional actions.

I hope this can help to start using Advanced actions. Please, feel free to comment and suggest other usecases.