Score in Software Simulation

Intro

This is a short blog post, answering a software simulation (assessment mode) question on the forum. If you are interested, here is the link.

You probably know that in such an assessment scores are attached to one interactive object on each slide: either a click box or a Text Entry Box.It offten happens that the same action can be done by clicking more than one 'target' on the slide, which will need customizing that slide to add at least one extra click box, which will also be scored. However that will lead to a results slide where the acquired percentage is not correct. Reason is that all scored objects are included in the total score. You can verify that easily in the Advanced Interaction panel, to be opened from the Project menu or with the shortcut key F9. Here is an example. Slide 59 has two target click boxes, both are scored.

The OP wants to show the correct percentage to the learner in the project, but for the reporting to the LMS Pass/Fail reporting is sufficient which can be done by basing it on the required pass points.

Variables

    • A while ago this blog post described using the system variables used in the Results slide: Quizzing System Variables. For this blog post the relevant system variables are:

cpQuizInfoTotalQuizPoints: will have the value you see at the top of the Advanced Interaction panel, and is not correct in this case because it includes the scores of the extra target click boxes.

cpQuizInfoPointsscored: will be correct because on each quiz slide only one of the targets can be clicked.

cpInfoPercentage: is calculated from both previous variables and will be lower than expected for the learner.

cpQuizInfoPointsPerQuestionSlide: this system variable is not behaving as expected for slides with multiple scored objects. It will NOT show the total score of the slide, but the score of ONE scored object. I will presume that in case of a slide with two target click boxes, both of them will have the same score. This is also valid if you prefer shape buttons instead of click boxes.

Since there  is no need to transfer the percentage to the LMS, it is possible to use user variables. Create these variables:

v_TotalScore: will replace the system variable cpQuizInfoTotalQuizPoints

v_TooMuch: will store the total score of the extra click boxes. I assume that click boxes on the same slide have the same score.

v_Percentage: will store the result of the calculation from v_TotalScore and cpQuizInfoPointsscored

Workflow

Simple

The easiest way would be to count the number of extra targets. If all the click boxes have the same score of 1 point you could calculate the correct percentage with this advanced action:

You can trigger this advanced action with the On Enter event of the custom Score slide. It will allow you to display the correct Percentage. 

Advanced

Situation becomes bit more complicated if not dual targets (click box/shape button) have the same score (of 1 point). In that case you can take advantage of the weird behavior of the quizzing system variable cpQuizInfoPointsPerQuestionSlide  (see above). I used this shared action, triggered by the Success action of the targets, and the 'Last Attempt' action which is used here (Success action on a background Shape covering the complete slide). I assumed that the Last Attempt action of the targets is set to No Action. That typical workflow was used by the OP, and explained in this blog post

You see that this shared action has no parameters, you could also create an identical advanced action, if you still fear shared actions. My main reasons for this choice:

  • Shared action can have a small description
  • Shared action appears in the Library, which make it easier to check the Usage
  • This shared action has no parameters, so it takes the same time as the advanced action to be applied to all the necessary events.
  • It is much easier to transfer this shared action to another Project.

There is a small change to the action to be triggered On Enter for the Results slide:

Conclusion

On the Results slide you can insert most of the default fields, an overview:

  • You scored:  the system variable cpQuizInfoPointsscored is correct
  • Maximum score: you need to replace the system variable by the user variable v_TotalScore
  • Correct questions: will be OK, it is the system variable cpQuizInfoTotalCorrectAnswers
  • Total Questions: will not be OK, you could add a supplementary command to the shared action similar to replace the system variable cpQuizInfoTotalQuestionsPerProject by a decremented user variable.
  • Accuracy: you need to replace the system variable cpInfoPercentage by the user variable v_Percentage
  • Attempts: will be OK, it is the system variable cpQuizInfoAttempts





Fractioning (custom) motion paths

Intro

Motion effects can be customized in many ways. Pausing Captivate's timeline will also pause automatically any effect if it is not finished. This feature can be used to make boring slides more engaging. To see what I mean, have a look at this example file. It has three slides using that approach:

  • Business Model: has a simple left to right motion path use on a cover shape to deploy an infographic sequentially.
  • Career Steps: uses a custom polygon path to have an animated avatar and discovering states in a multistate object
  • Captivate Hurdles: has a custom curved path, and uses also multistate objects.

You can watch the example file full screen by clicking this link.

Or have a look at this embedded example:


Workflow

Steps

Each of these three steps will be explained in detail below:

  1. Create the motion path, and edit its duration taking into account the number of wanted fractions.
  2. Create the button and its advanced action, which will have two decisions:
    1. Decision 1 will manage the motion and pausing, and a tracking variable if you want a second decision to be done when all parts have been deployed. This decision is non-conditional
    2. Decision 2 will be done when the path has ended and is conditional
  3. Test the interaction, it will probable need tweaking the path length and fraction times. Moreover if you allow to revisit the slide, you may need an On Enter action to reset the situation.

The detailed explanation will be done using the first example ‘Business Model’ . Explore its timeline:

Slide background is a a shape filled with a gradient. That shape was duplicated to be a cover, which is stacked on top of the Infographic (with the images) and the Next button. Motion effect will be attached to that cover shape. On top of the cover you’ll see the Play button (no pausing point), title and instruction text. The Next button has a pausing point which needs to be after the end of the motion effect.

Step 1: Motion path

The effect applied to the cover is a simple Left-to-Right motion path. It has no easing because easing would be applied to the start and/on end of the complete path, but you’ll use it in fractions. This linear path will be cut in 6 parts. I used a vertical guides grid to visualize the 6 fractions, and make sure that each guide is in between two images. Have a look at this screenshot, showing the guides and their setup (using View, Create Multiple Guides):

Motion path  is visible on the stage with end and start points. Those points are always connected to the center of the bounding box of the shape. The start point is at 1024/2px = 512px because the project width is 1024px. You need to extend the length of the path by moving the end point horizontally (keep SHIFT key pressed) to the X coordinate 512+1024px = 1536px. For that reason I added another vertical guide at 1536px. Turning the snap on for the guides helps to position the end point. See screenshot:

For the duration of the Effect, start from the time to use for each fraction. I found that using a time between 1 and 2 seconds is fine. As you can see in the timeline screenshot above, for this slide a duration of 1.5secs was chosen, leading to the Effect duration of 9secs. If you look closer to the Timeline, you’ll see that the effect duration is slightly shorter, because of step 3: tweaking.

Step 2: Action for Play button

Basic setup

At first sight the needed advanced action for the Play button seems to be rather simple.:

  • Pause the slide On Enter.
  • For the Play button use this sequence:
    • Continue      to release the playhead, the motion effect will start
    • Delay Next Actions by 1.5 secs          for the Business model slide 1.5seconds is 9secs/6
    • Pause      to pause the motion effect waiting for the next step (see guides in the first screenshot )
  • The Next button will be uncovered in the last step.

However, there is no way to prevent the learner to click the Play button after the motion effect ended, and the Continue command would then override the pausing point of the Next button, which you probably want to avoid. To prevent this you need a way to track the end of the motion path. Using a variable v_counter for tracking is an easy way. Although you could use one conditional decision, I like to separate the advanced action in two decisions. Have a look at this screenshot of the basic PlayMotion action:

Supposed here is a starting value of 0 for the variable v_counter. When all 6 parts have been ‘discovered’ the Play button will be hidden. It could be possible to replace that Hide action by a pure Pause action, but it would lead to frustrated learners.

If you try out this basic action for the Business Model slide, you’ll have a flickering problem. That has been a pain since many versions. In the Tweaking section of this blog, I will show you how to solve this. Moreover in the video displayed in the previous post, you’ll see that the first part of the effect is deployed immediately. There is also need for an On Enter action on all the slides, to reset everything in the original situation including the value of the counter variable.

Extended Setup

This simple slide didn’t need to have another action to be done besides part of the motion effect. That is not the case for the Steps nor the Hurdles slides. The extra actions need to be inserted before the Delay command in the Always decision. Look at the versions for the Hurdles slide. Multistate objects were used to show explanations. There are 4 parts. At the end the Play button (is in a group with a Tooltip) needs to be hidden, and the group of extra buttons made visible:

Step 3: Tweaking

Timing

When testing the project with F11, Preview HTML in Browser, you'll see that the timing is not perfect: motion effect. There are two ways to tweak this timing, and often both are needed:

  1. Decrease the total time of the motion effect (Timeline panel or Timing Properties). That will speed up the motion, more will be shown with each part. If you look at the first screenshot, Timeline panel for the Business Model slide, you see that the duration of the effect is now 8.9secs instead of the original 9secs. For the Steps slide, I reduced the original 10secs (5steps of 2sec) to 9.7secs, for the Hurdles slide 5secs was reduced to 4.8secs

  2. Decrease the Delay time in the advanced action for the Play buttons. You could see in the Hurdles action the change to 1.8secs. 

On Enter action

You’ll need such an action to reset the situation if the learner is allowed to revisit the slide, and also to be able to reuse the unique variable v_counter.  Whenever possible, avoid to create multiple variables if you can reuse the same variable. Here is a simple On Enter action for the Steps slide:

As promised, here is the On Enter action for the Business Model slide, which is more complicated because it solves the flicker issue, and will show the first part of the image (Hence the Assign to 1 command for the counter variable):

To avoid the flickering of the InfoGraphic image, it is hidden to start with and shown after 0.3secs.  I also added a Fade in Transition The starting value of the variable is now 1 instead of 0. To deploy the first part of the infographics you’ll see the same actions as in the Play button action. The total delay for this first part is 1.6secs.

More?

It would be wonderful to hear how the described workflow could inspire you for your projects.. 

Creating custom paths - curved or polygonal - comes with some issues:

  • For polygons: you cannot create horizontal nor vertical parts for an obscure reason. I have logged this bug multiple times.
  • For curves: realizing cusp points is normally not possible... 

If you want to learn how to overcome those issues, please let me know.



Tip 2: Filtering (Advanced/Shared actions)

Intro

This second tip is closely related to the first tip about labeling. If you have read that post you'll have seen that good labeling could facilitate filtering for dropdown lists, using this screenshot. It shows the Parameters dialog box (Shared Actions) where filtering is used to limit the choices in a dropdown list.

Time to explain what I mean by the term 'Filtering'. Dropdown lists are all over Captivate's UI, not only in the Advanced/Shared actions domain. Some of those lists are sorted alphabetically, some are sorted chronologically (very annoying: most recent added item appears on top). They may show all items, but can have an automatic filter of items. That is the case within the Advanced Actions dialog box: when setting up a condition or a While loop, if you need to choose a variable, you'll only see variables in the dropdown list, for operators you only  operators. However, even when filtered and sorted alphabetically the lists can be very long and it takes time to find the proper item. Being able to reduce a list by manual filtering based on the names is a big timesaver! I remember older versions where searching was reduced to typing the first character, to scroll to the items starting with that character. That used to be the case for the variable dropdown list, reason why I started labeling user variables with v_ as first character, to differentiate from the system variables which started either with 'rd' or 'cp' (the first types disappeared from the lists).

Filtering workflow

It consists in typing a sequence of characters, resulting in displaying only items which have that sequence in their name. It doesn't matter where that sequence appears: at the start, at the end, in the middle. There is no case sensitivity, which is rather exceptional. Although names cannot start with a number, if you include a number in the name it will be very easy to use the number as part of the filter sequence. This will become easier to understand with some examples:

Show (Hide)

The dropdown list for those commands in advanced actions will show all objects on all slides, leading to a very long dropdown list. Using a filter and proper labels is very useful as you can see comparing these two screenshots of such an action before and after applying a filter. In this case the filter shows all groups, which are labeled as Gr_xxx

Change State

This screenshot (from the Memory game project) simplifies how to find the correct multistate object. In this case there were many multistate objects in the project:

Parameters

Although many dropdown lists are already filtered on the type of item needed, look at this example. You need to know that in the field here you need to click twice to be able to type in a filter: first click selects the field,  second click gets it in Edit mode (like with a text container). I added the Properties panel, because the label of the active button is used as reference for the 'active' button. Same example was shown at the start of this blog.

Availability of Filters

As you have seen the filters are available for all dropdown lists in:

  • Advanced Actions dialog box
  • Parameter dialog box

Too bad that it is not available for other dropdown lists:

  • Simple action (tab Actions)
  • Object actions (Drag&Drop)
  • Advanced actions list in the Advanced Actions dialog box (which would be very useful if you need to clean up)

Next tip?

It will compare the use of  Grouping (when using Show/Hide workflows) and multistate objects for similar goals.


Tip 1: Labeling (Advanced/Shared actions)

Intro

Many Captivate developers use advanced actions, which is an easy way to extend the functionality of the application without need for learning the rules of a programming language. After publishing the project, those actions are converted to JavaScript. This is also the case for the more flexible (underestimated) shared actions.

However the  ‘point-and-click’ approach for scripts has rules and limitations.  If you start using advanced/shared actions,  understanding those rules will avoid frustrating situations.  This first Tip is all about the importance of customizing labels, the reasons for establishing a labeling discipline (especially when working with a team). Last week two questions in the Adobe forums about issues with advanced actions were due to lack of knowledge about correct labeling.

The terminology used in this blog is the same as in the Adobe documentation. You can check the in-depth exploration of the Advanced Actions dialog box in one of my previous blogs meant also for starters with actions: 

Advanced Actions Outfit since CP2017 – eLearning (adobe.com.

This article will first explain Generic names (labels) attributed by Captivate, continue with Custom labeling. At the end you'll see also an explanation of 'Smart labeling', term used by Adobe when copy/paste is used on items with a custom name.

Generic names (labeling) - Uniqueness

Almost all items in Captivate get a generic name when they are created in a course: objects, placeholders, groups, slides, states, decisions (in actions)... There are a few exceptions:

  • User variables: you need to define a custom name except for the variable associated with a Text Entry Box.
  • Advanced/Shared actions: they also need a custom name 

The first global ruleis fully respected in those generic names. 

 'Each name needs to be unique'
Names are case sensitive, so it is easy to use similar names, by changing one or more characters to uppercase from lowercase. Uniqueness applies also to items from different type: do not use the name for a button, which has already been used for a variable (common mistake), or the name of an action for an advanced action (another common mistake). There are some minor exceptions:

  • Generic name for a Text Entry Box and its associated variable are the same. I don't really like this, and tend to create a new user variable with a custom name, using the X button next to the generic variable name:
    It is not wrong to keep the generic name, but it bumps on the general rule.

  • If you define the name of a button, and use the same name for the action to be triggered by the Success event, it will not be flagged as an error. But if you do the reverse (first action, later the button) you do get an error. I would avoid doing this. 

  • States can have the same name for multiple multistate objects, because as identifier the combination of the object name and the object will be unique if the object has a unique name.

  • Similar for decisions within an advanced/shared action. Although years ago I had issues with an advanced action using the same name as a decision in another advanced action. But decisions can have same name in multiple advanced actions.

When using Generic names, and duplicating the item, the duplicate will have a similar name but ending on another number. Check this screenshot, showing the timeline of a slide with multiple objects and of a duplicate slide:

Custom names (labeling)

Why and when is replacing generic names worthwhile, because it takes time?

  • It will be easier to understand, especially for your clients and collaborators. Referring to the screenshots of the Timeline posted above, if you replace the name of the TEB which will ask for a name by 'TEB_name', and the button is named 'Bt_Next' reading the timeline is more comfortable. Have a look at this Timeline, which is from the Stopwatch tutorial to understand better.
  • When using the items in advanced or shared actions, where you often will need to choose from dropdown lists, it is almost impossible to identify the right item for your choice when working in a project with tons of items.
  • To take advantage of the filtering (see Tip 2) provided by Captivate, custom names can save you lot of time. Look at this screenshot from the Memory Game tutorial where a parameter needs to be chosen for the shared action. There are lot of shape buttons in this game. By typing out one or two characters (here _2) the long list is filtered to facilitate the choice.

Setting up a custom labeling 'system' is also a timesaver, not only when you are collaborating with a team. The global rule of Uniqueness will have to be respected. Names cannot start with a number, nor have strange characters. Try to keep to short names, avoid spaces and remember that names are case sensitive! Here is a short summary of my personal labeling system, however this is just an example. Over a decade ago I started labeling for user variables. At that moment the only way to find a variable in the dropdown lists was by using the first character, because they were sorted alphabetically. To have the group of user variables separated from the system variables (which started with r or c at that moment) user variables started with v_. The first character indicating the type of item, followed by an underscore (replacing a space). This meant the item was also identified by that first character, and I continued to follow the same logic for other items. Some examples:

  • Bt_: first characters of buttons of the three old types (text, transparent, image)
  • SS_: smart shape
  • SB_: shape used as button
  • Im_: bitmap image
  • Ib_: bitmap image used as button
  • SV_: SVG image
  • SVB_: SVG used as button
  • Gr_: group both for object groups and slide groups (Table of Contents)
  • Tx_: text caption
  • CB_: click box
  • ...

For advanced actions I don't have a fixed system. One exception: if an action is meant to be used On Enter for a slide, I will start its name with Enter. I am a frequent user of shared actions whenever possible, which avoids the need for names for multiple duplicate advanced actions,  since you need only one name for a shared action that can be applied multiple times with different parameters. 

For the other characters in the name I will use camel notation. The system allows you to have the second part identical for items which are linked. Example: SVB_Reset can be linked with an advanced action ResetAct, and a variable v_reset.

Maybe I'll add an extra extension to multistate objects in the future, because they are not easily identifiable.

Tip: for much used variables create a shared action as explained in Rare tips (tip 1). By importing that action in a new project you avoid lot of typing.

Smart labeling

When you copy/paste an item with a custom name, the custom name will be preserved, but an extra number is added to the name. This is indicated as 'smart labeling', was introduced some versions ago. 

Example: Duplication of the Next shape button (from the Timeline screenshot for the Stopwatch slide), will lead to this:

The duplicate gets the original name followed by an underscore and a number. In this case the duplicate of SB_Next, became SB_Next_20. It means that the numbers 1-19 had already been used. Same would happen if you copy that button to another project, but the number will be different. If I copy this button to a almost empty new project, the name becomes SB_Next_2, because only one object already existed ending on 1. Keeping at least part of the custom name can be very useful. However it can also become a problem as I learned when importing Shared actions using the same variables. If you don't import (or drag) those actions in one workflow, but in steps, you will end up with duplicate variable bearing another name. You also need to be careful when copying interactive objects which are triggering actions using variables.

Conclusion

I hope this article convinced you of the importance of consistent labeling. Be sure I do not label every item, but I will when they will be needed in an advanced or a shared action. For slides the names do not need to be unique, because internally they are identified by cpInfoCurrentSlide which is a number. However slide names are important if you want to use a Table of Content.

Next tip about Filtering is closely linked to this first tip, and will save you time when developing advanced and shared actions. You will get an overview of the locations where filtering is possible, and those where - saddening - it is not available.

Memory game setup - version 2021

Intro

As new year's blog I offered a simple memory game in this portal

Let 's Play and Dream

The setup however is not explained in the blog. Since another user asked about the creation of such a memory game, this blog will explain shortly the workflow. It will be limited to the game itself, not to the consequences of having succeeded it.

Setup slide

Besides the use of ONE shared action and ONE advanced reset action, all is based on using multistate objects, groups and variables. It can easily be extended to more than 6 pairs as in the example file. The background image, which in this case is only a static image of all the small images, can be replaced by another image (or a random image if you use JS), which can be included in the game itself. To see what I mean, I have to refer to my first version of this game, 10 years ago: 

Concentration game created exclusively with Captivate

If you want to play that old game, I warn that it is a SWF.

Timeline

Have a look at the timeline of the game slide

The two buttons with the same back image are in a group. There are 12 buttons, so you end up with 6 groups. The buttons themselves indicate where they are. The expanded group Gr_6 has the second button on the third row and the fourth button on the second row.  However you can set up labels as you want.

Each button is a multistate object. Normal state is the symbol for the virus, the Back state has the image. 

Variables

Each group has a tracking variable: v_1 - v_6. Their default value is 0.

The variable v_click starts with a default value of 0. It will track the button clicks (first or second).

The variable v_counter will track the number of correct paired images. It starts at 0, and the game is finished when reaching 6.

The variable v_first is needed to reset the slide, will store the frame number of the first slide frame. For more information check: Replay or Reset?

Shared action 'ButtonAct'

This action is triggered by the 12 buttons, and has only 3 parameters as you can see in the preview of the action:

You see 4 decisions:

Always  is a standard action, it shows the back state of the clicked button and disables it. The tracking variable for the group and v_click are both incremented by 1.

WrongAct (conditional) checks if this is a second click, and it didn't match the first click (because v_1 is equal to 1). In that case the Reset workflow is used. The advanced action 'EnterGame' (see below) will reset what is necessary.

CorrectAct (conditional) if both clicks pointed to the same image, the variable v_counter is incremented. The group with the two buttons will be hidden, to reveal the background image. 

Done: (conditional) checks the value of the variable v_counter and navigates to the conclusion slide if it reaches the value 6, which means the game has been completed successfully.

Advanced action EnterGame

This action is essentially resetting the slide. 

 Since buttons can have been disabled (see ButtonAct) all buttons need to be enabled. A group tracking variable can have a value 1, needs to be reset to 0. The variable v_click needs to be reset to 0 as well. The only variable keeping its value is v_counter.

Extension tips?

More possibilities will not need a lot of work. If you want to reuse the workflow in more projects a shared action has a lot of advantages.  If you import that action in a new project, the variables v_counter, v_first and v_click will be created automatically including their default value and description. Personally I would use the present advanced action ‘EnterGame’ to create a new shared action, keeping only the variables to reset, not the buttons. If you import that new shared actions at the same time as the first shared action, you don’t have to create the group tracking variables neither. You only have to set up the multistate objects and the groups in the slide.

Want less or more groups? 

It is logical that you’ll need to edit the EnterGame action. What about the Shared action ButtonAct?  Since I wanted to make the workflow simple, I kept the literal ‘6’ for the number of groups. Two possibilities for editing:

Use the Shared action to create an advanced action. Delete the shared action in the Library. Edit the literal to the wanted number, and recreate the shared action. You can even use the same original name.

If you want to reuse this action in multiple projects, replace the literal by a variable (v_max) which you can edit in the variables dialog, or by adding an Assign command on a slide preceding the game slide. 

Background image can be replaced, as I mentioned above.

It is also possible to create a more complicated game, maybe with groups of 3 buttons to match. 

Have fun!

Let's Play and Dream

Intro

I want to try to keep the tradition to offer a special blog at the start of a new year. Like last year it is a game, hiding my greetings card. There is some nostalgia here as you will read.

On my personal blog you can still find the very first game I every created exclusively with Captivate: no Javascript, no use of widgets nor other applications. That was almost a decade ago. Since that  game used Captivate 5 , it took me quite a number of hours to get a satisfactory result. If you still have a browser with Flash Player plugin enabled, you can even watch the embedded game in this post:

http://blog.lilybiri.com/concentration-game-created-exclusively-with-c

With version 11.5, all interactive learning interactions were taken out (lack of use), including the games. You will recognize the former ‘Memory game’ in this game which I offer as an interactive Greetings card for 2021. Last year I also offered a game for the Chinese New Year.

Using version 11.5,  this version took me only about 20% of the time I spent in 2011 for the original version. This game uses only one shared action with 3 parameters, one advanced action for reset (and another one to restart the game). It is also much more flexible than the original game. Creating another game with more or less pairs will be a breeze due to the shared action. Finding or creating the images will take lot longer than adding the actions. It is possible to create 'pairs' that are not identical images: for language learning you can pair an image with a word (and maybe even audio), you could pair words in different languages, acronyms with their description etc...

Personally I would have used CpExtra to reduce the statement lines in the Advanced actions, because that wonderful widget allows to Assign, Show, Hide, Disable multiple objects in one statement. However, for the sake of consistency I have created the advanced actions  in the default way.

Have fun in 2021!

Game

As usual, I provide both a link to a rescalable version, and an embedded one with a fixed resolution.



Invite

I want to organize a webinar about this topic:

Remodeling Advanced actions to flexible Shared actions

This would be for developers with some experience about variables and  Advanced actions. If you are interested, please add a comment. From exploring Shared actions I learned to use a different mindset and could offer practical tips. You can even send me an advanced action you estimate to be appropriate to convert to a shared action.


Use Hyperlinks as Interactive Object.

Intro

Quite a while ago i have blogged about using Hyperlinks as interactive objects. Those blogs included examples. However the articles were written in the SWF era… which is almost over.  I'm talking about these posts::

More is in a hyperlink – Dropdown menu

More is in a hyperlink – Close button

Later on I used the Dropdown menu workflow in all the interactive videos which I posted here, to create a Bookmark menu. Here is one example: Custom Play/Pause button

Last week, a user asked questions about the same topic. That was the incentive to check out if the described workflows for SWF output were still valid for HTML5 output. 

Example file

You can have a look at this example file, where I show 4 use cases; or watch the embedded version below (fixed resolution, whereas the link goes to a rescalable HTML output):
  • Navigation buttons
  • Show/Hide workflow
  • Close button for a popup
  • Forced view

I did keep the typical Underline for the hyperlinks (but often edited the color). You will find tons of them. The design of the slides was taken from the Quick Start Project included with version 11.5, labeled ‘Rhapsody’. It always reminds me of the epoch of the Hippies…

No audio, sorry.  There is no playbar, nor TOC. Navigation is done with SVGs, which have a tooltip (added in the Rollover state) for those who use a desktop/laptop. It is a rescalable, non-responsive project. I  checked  out the workflows in a Fluid Boxes project as well, because they may be very interesting for that type of project.


Setup

Navigation menu

The list with commands which you can open when clicking the down arrow next to the field 'Web page' looks shorter than the Simple Actions list under the Actions tab for an interactive object:

Some commands are indeed missing, but most Slide commands can be found under the unique 'Slide' command. In this screenshot you see how to translate the Jump to Slide command, which you'll need to create navigation buttons (see Menu slide, second slide in the example project):

Comparing with interactive objects

The big advantage of using hyperlinks is that everything could be done with one text container, in which you mark several items as hyperlinks . Great way for a custom Table of Contents, which you can have sliding in/out. Especially for responsive projects: click box over text is not possible in a normal fluid box; limiting number of objects make setup much easier for Fluid Boxes workflow as well as for Breakpoint Views.

Alternative for buttons? Advantage is that you don't have shrinking of the text when pressed, you don't have to configure InBuilt states. Disadvantage: you miss the Visited state to indicate that an item has been visited.

Show/Hide

The slide with the hyperlinks in ellipses, was created as a 'dynamic' hyperlink (to be compared with Dynamic buttons). Text in the ellips are user variables, used as hyperlink. 

The user variables v_fx and v_KC  have a default value of 'Show', while the text shapes with the info are hidden with the On Enter action of the slide. A simple conditional action (similar for both) is used:

It would also be possible to have all the info boxes in one multistate object (which I use in the next two use cases).

Comparing with interactive objects

Similar to the navigation solution, if you don't like shrinking nor styling of InBuilt states this could be a solution. Again, since a Visited state is missing, that can be a drawback.

Another drawback is that you cannot use shared actions, which I would have done in this case. You need to use duplicate advanced actions.

Close button

Normally it is not possible to add an interactive object to a state in a multi-state object. You cannot create a hyperlink neither. However it is possible to have the same hyperlink available in all states, with the same triggered action. On the Close Box - slide, The info multi-state object is a shape with 6 states. Here is a screenshot:

Just FYI, the second state (QSP) looks different in the Object State panel, but that is just a  glitch. It is exactly the same on the state. To create this multistate object you need to follow carefully this workflow:

  • Create the shape (Tx_Info is the label I used) with a close hyperlink (big X), which I aligned to the bottom, centered. That will become the Normal state. You need to choose a command, but will have to edit that command later on. 
  • Go into the Object State panel and duplicate the state, the X hyperlink will be included in this second state.
  • Close the Object State panel and edit the hyperlink. It need to be 'Change state of Tx_Info to Normal'. 
  • Change the color of the X character to a color from the background, so that it will be invisible; if there is a Fill and/or a stroke, set Alpha and Stroke both to 0. The Normal state will now seem 'invisible'.
  • Return to the Object State panel.
  • Select the second state, style the X hyoerlink to a visible color. Add the necessary text and/or background fill.  Double check by previewing if the hyperlink action is functional.
  • Duplicate the second state, and edit the text/fill
  • Continue the duplication until you have all needed states.

I have tried with Hide for the hyperlink, but had lot of issues, seemed not to be functional. That is the reason why I switched to an invisible Normal state.

In the ellipses you find more hyperlinks. They change the multi-state object to the appropriate state. Here is an example for the first category 'QSP':

Comparing with interactive objects

As far as I know this is the only way to have an action propagating to other states in a multi-state object. Shared actions are not possible nor are Visited States (although with a more complicated advanced action possible).

The action triggered by the hyperlink can be rather complicated. A not so complicated example follows

Forced View

Setup of the multi-state object is quite the same as in the previous slide. In this case the change of state is triggered by real 'buttons', which seemed logical with this content. That also allowed me to use a Shared action. To track the clicks, a user variable is needed for each of the buttons. The shared action is visible in these two screenshots:

The X hyperlink, which was propagated to all states, triggers an advanced action with two decisions. The Back to Menu button is hidden with the On Enter event of the slide, and made visible when all variables have been toggled to 1. That meant that they all have been clicked:








Lightbox setup

Why?

Lightbox is a popular technique to make extra information (text, images, video…) stand out. Traditionally that information will appear on a background of an object which hides or dims the original objects on the slide. A way to close the lightbox is necessary, and will also make those objects visible again. In a way, the overlay slides in an interactive video are sort of lightbox as well. It is evident that such a lightbox is rather easy to create in a non-responsive project, but several limitations (like stacking) in Fluid Boxes project make it almost impossible. The example shown here, and the setup, was for a non-responsive project.

Recently a Captivate posted a question in the Adobe forums.: ‘How to create a lightbox within a state of an object‘. She was upgrading an older project, where the developer used a slide for each lightbox, by using multistate objects to replace the multiple slides.  After having asked for some extra information, it turned out to be more complicated than just the creation of lightboxes.  It was about a two-step process for extra information:

  1. Clicking a ‘question button’ would show the answer to the question as a popup (Click-Reveal workflow). That popup didn’t really need a way to close it, but clicking another question button should replace the content by new content. OP was correct that using a multistate object was the perfect workflow for this first step, with a Normal state which was invisible by setting Alpha (for the Fill) and Stroke both to 0. I have demonstrated this use multiple times in blogs.

  2. The content needed to have a way to open a ‘lightbox’ (in the traditional sense explained before) with more information related to the question/answer already shown. 

Problem

States in a multistate object, with the exception of the Normal state cannot have interactive objects! In both steps such an object is necessary. In the first step it is needed to open the proper lightbox, in the second step to close the lightbox.

Such an interactive object can be a button, a click box or… a hyperlink. Quite a while ago I wrote a couple of articles to demonstrate the power of hyperlinks which is ignored by many. However, for HTML5 output in the recent version (11.5.1) its use to run advance actions seems not always to be functtional, needs lot of testing. Originally when creating the sample output, I planned to use hyperlinks in most cases, but had to give up for the reason just explained. BTW all actions triggered by hyperlinks worked perfectly for SWF output. So I had to revert to buttons in most cases. I will explain the complete setup in a blog.

Example project

Watch this project. There is no real content for questions, answers nor lightboxes. Focus is only on the structure and workflow. There is one slide after the title slide, which has 5 question buttons:
  • Clicking a question button will show a popup which should contain the answer, and there is a (image used as) button to open the lightbox. The question buttons shows a ‘Current state’ when clicked.

  • Clicking the button opens a lightbox: cover, shape with content, and a hyperlink used to close the lightbox. When the lightbox is closed, the question button will revert to a ‘Done state’. It is not a Visited state, but a custom state.

You can watch the project below (fixed resolution) or using this link (rescalable output)


Setup

Objects – timeline

See the setup, using this screenshot of the timeline panel:

From bottom to top:

  • Five question buttons, which are shape buttons labeled SB_Quest1….SB_Quest5. They have a pausing point at the default 1.5secs. For those buttons I deleted the InBuilt Rollover and Down states, but added two custom states: ‘Current’ and ‘Done’. 
    .
  • A group of shapes used as text container for the answers SS_Answer1…. SS_Answer5. I could have used a multistate object as well. I started using individual texts because I hoped to use a hyperlink for the lightbox switch.

  • A shape used as Cover. Its position in the stack order is important: it needs to be above the answer and question objects, but under the multistate object SS_ExtraInfo. That cover is a shape, filled with dark gray, partially transparent. Beware: it is also used as text container: look for the text ‘Close Lightbox‘ which has been converted to a hyperlink triggering an advanced action.

  • Multistate object SS_ExtraInfo which has a state to appear in the lightbox for each of the answers. The Normal state is empty (Alpha and Stroke shape = 0).
  • Button Bt_Info (used a button from thitOt not necessary to be on top of the stack, Its position in the stack order is not important, because will be hidden when the lightbox appears.

Variable

One user variable v_quest was created. Default value can be empty. It will store the number of the question chosen by clicking the question button. That number is necessary for two advanced actions. as you’ll see below.

Events and Actions

On Enter slide event: "EnterAct"

This simple non-conditional action is meant to set the slide to its original situation:

If I had used a multistate object for the Answer popups, with a Normal state that was invisible (like for the SS_ExtraInfo), I would not have needed the second command (Hide Gr_Answer). By hiding the Cover, I also hide the hyperlink since it is a text in the cover. No need to hide SS_ExtraInfo since the Normal state is invisible. Why didn’t I use a hyperlink instead of the button Bt_Info? Because the advanced action was not triggered as it does when using SWF output. Too bad.

Question buttons:  Shared Action "QuestAct"

Another non-conditional action, based on this Advanced action:

I converted it to a Shared action, with these 6 parameters:

If you prefer a multistate objects over a group for the answers, you will still have 6 parameters, but the Group will be replaces by the name of the multistate object, and the Answer object by the wanted state.  I already explained my choice for a group.

Button Bt-Info: Advanced action "ShowLightBox"

This is an action with 6 decisions. The first decision is non-conditional, the five remaining decisions are conditional because a different state has to be shown based on the question number in the variable v_quest.  Those decisions have only one command and can easily be created with the duplicate decision button.

Hyperlink: Advanced action "CloseAct"

The hyperlink in the Cover shape triggers a 6 decision action very similar to the previous one:

More…

You can extend the described workflow to more than 5 questions. The shared action can be used, and you may have to add decisions to the two longer advanced actions.

I didn’t provide a close button on the answer popups, for learners who don’t want to see the lightbox, for whom the answer popup is sufficient. It could be done with a hyperlink or an extra button.

It would be possible to have something happen when all question buttons have been clicked, but that will require the creation of one extra variable for each button, a Boolean to be toggled from 0 to 1 if a button has been clicked.  The check for the extra happening has to be added to the CloseAct.

Prevent Skipping on Drag&Drop quiz slide

Intro

In a recent thread user asked how to prevent that a learner would click the Submit button on a Drag&Drop slide before having performed at least one drag action. Sort of alternative for preventing ‘Skip’ on a normal quiz slide. Such functionality is not available out of the box.  The D&D slide needed to be scored, which made the situation more complicated (easy reset by developer is only possible for Knowledge Check slides).

Like all quiz buttons, the Submit button on a D&D slide is an embedded objects. Consequence: it doesn’t have an individual timeline nor an ID. There is no way to disable that button. You can drag it out to the scratch area, and use Auto Submit, but that was of course no solution for this situation.

Example file

Have a look at this published file.  As usual I used some ready-to-go-slides, in this case from the project ‘Rhapsody’.  All slides were taken from this Quick Start Project, but I deleted the existing Drag&Drop interactions,  just used the design components. After the title slide, you’ll see two Drag&Drop slides. The Submit button is not on the slide when you start, it will only appear after the first drag action.

The Submit button is not on the slide when you start, it will only appear after the first drag action.  To make the slides more similar to quiz slides, I added a second step to the Submit Process.

Check your Captivate knowledge for version 11.5. Either use this link (rescalable) or watch the embedded published file (fixed size):


The trick is to use the Timeline and a motion path effect triggered by any Object action. Not really very complicated, follow the steps below. This workflow, due to stacking of objects, is not that easy in a Fluid Boxes project, the example was a non-responsive project with Scalable HTML output.

Step-by-step Delaying Submit button

1. Pause the timeline before the default pausing point

By default each Drag&Drop slide has a pausing point at 1.5secs, similar to question slides and linked to the Submit process. Too bad, that pausing point is not visible in the Timeline panel, you can only see and edit it in the D&D panel.

You need to pause the timeline at a frame before this pausing point  at 1.5secs by inserting an interactive object which remains invisible to the learner. In this case I inserted a click box, small size (1px for width and height) and located in a place where it is very improbable that learner will try to click. Set it to infinite attempts with the command ‘No action’ to be triggered by its Success event; do not show the Hand cursor. Have a look at this screenshot for the setup of this click box:

The topmost click box which appears later, will be explained the workflow for creating second step Submit process.

Step 2: Drag Submit button off the slide

To make the Submit button invisible you drag it in the scratch area, either to the left (first D&D slide) or to the right (second D&D slide).

Step 3: Timebased motion effect to Submit

Although the Submit button is an embedded object, you can apply an effect to it using the Right-click menu or the Timing properties. The timing of the effect will not be visible in the Timeline panel, because the button has no timeline. The only way to set up the timing is with the numbers in the Timing panel. This motion effect (I used Left-to -right or the opposite one depending on the location) can be very short (used 0.2secs). It is important that it starts at or after the pausing point of the click box (step 1), and ends before the default D&D pausing point (which was kept at 1.5secs.). See this screenshot for one of the Submit buttons:

Step 4: Create User variable 'v_drag'

Create a Boolean variable, labeled it v_drag. Its default value should be 1. It will be toggled to  after the first drag action.

Step 5: Advanced (conditional) action 'ObjectAct'

The purpose of this action is to release the playhead with the first dragging of any drag source to a target. The result will be that the Timebased effect on the Submit button will occur, and the Submit button enters the slide. The playhead will be paused by the default D&D pausing point at 1.5secs. Hence the importance of the timing of the effect described in step 3.  To avoid a same playhead release to happen on subsequent dragging, the tracking variable v_drag is toggled to 0, and the action is conditional:

Step 6: Attach 'ObjectAct' to all Object actions

Since you don't know which will be the first drag action, you need to attach to every drag action. That  is the boring part since there is no easy way to attach the same action to all at once, not even for one drop target. Here are the steps for each drop target:

  • Select the drop target
  • Click the button ‘Object Actions’ in the tab ‘Format’
  • For each of the drag sources open the No action list, choose Execute Advanced Action
  • Choose ‘ObjectAct’ as advanced action.

In the example file you’ll have 3*6=18 object actions in the first D&D slide, and 4*4=16 in the second slide. I really hope one day there will be a way to apply the same action to multiple object actions at once…

Do not forget to test! The actions Success and Last Attempt (wrongly labeled as Failure) were left both to the default command ‘Continue’. That way the learner will have time to watch the feedback. Timing of the feedback shapes (or captions) can be edited as you probably know.

Workflow: adding second step to Submit Process

If you veiwed the example file, there was a second step (click the slide to proceed) added. If you don’t do that, the feedback message will appear and the playhead will be released, out of control for the learner. It is a simple trick, as you may already have seen in the first screenshot of the Timeline for the first click box.

I added a second click box, covering the whole slide, but appearing after the release of the playhead by the Drag&Drop actions on Success of Last Attempt (1.5seconds). This click box triggers the default ‘Go to Next Slide’:

Don’t forget to warn the learner about this second step, The example file had the warning in the feedback messages.

This last extra workflow is NOT possible in a Fluid Boxes project because stacking is not allowed. You can use the first workflow with the motion path in a Fluid Boxes project, but may have to replace the click box by an invisible shape or transparent button (no fill nor stroke) if you want to add them to a normal fluid box.

Quiz: Replace Score by 100% or 0%

Intro

Recent question on the Adobe forums is the reason for this blog. User didn't want the score (points or percentage) to be transferred to a LMS. Since the questions were random questions, using pools, it was impossible to use Knowledge Check slides, nor Pretest slides. The requirement to succeed the assessment was to have a minimum amount of correctly answered questions (7 out of 8). If that was the case, the transferred result to be transferred to the LMS should be 100%, and on failure 0%. I designed a workflow based on previous blogs about Random quiz slides and Reporting custom quiz slides. You will be able to check out a published example project, and follow the setup, Step-by-Step. To save some time I used a couple of ready-to-go slides from the project 'Alliance', but had to do edit of course.

Example

You can watch this file either from this link, (scalable)  or in its embedded version (fixed resolution):

Project has 11 slides, one of them (default results slide) is hidden. A pool was used to insert 5 random quiz slides. You need to have at least 4 correctly answered questions to obtain a score of 100%.


Setup

Here is the filmstrip of the example file:

Slides 1-3 are based on ready-to-go slides from the project Alliance.

Slides 4-8 are random quiz slides taken from a pool with 10 questions.

Slide 9 is again taken from Alliance (but with lot of multistate objects, see later).

Slide 10 is the hidden default score slide. It will automatically be moved after slide 9 because of the scored button on this slide (see step 3).

Slide 11,  final slide allowing to be sure that the final result (100% or 0% ) is correctly transferred to the LMS. I inserted the system variable cpInfoPercentage in a shape on this slide (top left).

Step 1: Score random question slides

Supposed you have the question pools ready, insert the required amount of random quiz slides in the project. All slides in a pool have by default the same score (10 points), it is not possible to have partial scores for MCQs with multiple correct answers.  There seems to be a bug for a FIB slide, where the correct answer appears as tooltip in case you have that question. Will log the bug, seems new.

Once the random quiz slides are inserted, it IS possible to edit the score. I took all score out, set them to 0. Just a tip, check the Advanced Interaction panel (F9, or under the Project menu) to see that the total quiz score is now indeed set to zero.  Penalty has no sense in this situation because success doesn't depend on the acquired score of the quiz.

To avoid long waiting time after the submit process for a question, I moved the pausing point near the end of the slides in all the pool questions.

Step 2: Tracking correct questions

To track the number of correctly answered question, you need to create a user variable v_counter, with a start value = 0. 

That variable needs to be incremented with each correct answer.  Number of attempts on question level is set to 1. It is then sufficient to create a simple advanced action to be triggered by the Success event of all random quiz slides:

Step 3: Results slide

I used a ready-to-go slide to show the result, but have converted several objects to multistate objects. The Normal state is the one shown on Success, the Failure (new) custom state will be shown on failure. This is the timeline of that slide:

Moreover I added two interactive objects to the slide, both invisible in output to start with (eye button in Properties):

  • Bt_Failure: is a transparent button similar to the Next button in the Alliance project. It has its default command 'Go to Next Slide'. 
  • SB_Success: is a start shape marked as button. Special is the fact that this button is set to Report (Actions tab ), and to include in Quiz. When you check in the Advanced Interaction panel (F9), this shows:

 Step 4: Conditional action EnterResult 

Use the On Enter action of the Results slide (slide 9) to show the correct state of the 4 multistate objects shown in the Timeline screenshot, and to show either the button SB_Success or Bt_Failure, based on the requirement of having at least 4 answers correct. Of course, the number 4 can be changed (OP wanted 7 correct answers). The action is self-explanatory:

This trick with the two buttons was published in my blog, over 8 years ago. The example file in that article is of course SWF output.  I didn't want to use two identical buttons - same location - in the example of today because that is impossible in Fluid Boxes projects.  This was not such a project, but it is perfectly possible to use the same workflow in a responsive project. It was also the main reason for the multistate objects used on this Results slide.

Extra: Editing Alliances

This is bit off topic, just for those interested

I did edit the ready-to-go slides a lot. Having a pause triggered by the On Exit event is not something  like because it can create problems. All slides have at least one interactive object, which can pause the slide near its end. That project has some quiz slides, but they are NOT based on the quizzing master slides. This means that the theme was not fully realized. When I inserted random quiz slides, which necessarily do use quizzing master slides they looked very different from the nice quiz slides. I have updated the master slides to make them looking approximately like the ready-to-go slides.

There are more problems with this project, which I detected but didn't encounter in this particular project. As I have written in previous posts, never do use the Switch to Destination theme!