Playing with Captivate 9

Intro

Version 9 has been released about 10 days ago, while I was on vacation. My fans know that I seldom will post immediately a 'full' review, because I want first to play around a little bit, to try out some reported new features before offering my personal reflections and tips. You will not read anything about the new Quiz features, nor about the enhancements to Responsive projects today, maybe later on in another article. There is too much to write about!

First project

No better way to get the feeling of new features than to create a real project from scratch. In the following movie (only one slide) you'll see that I recreated a slide that was posted in the first article about shared actions. I didn't upgrade the project, didn't use the objects, nor the actions/variables from the old project. If you watch it closely, you'll detect that I used:

  • new states work flow, both for static and interactive objects
  • imported SVG's and roundtripping with Adobe Illustrator
  • Effects 2.0 with custom curved motion paths
  • new commands in Advanced/Shared actions

I will offer some tips about those 4 major new features when you have played with this slide. Refreshing the browser will allow you to restart the movie. Of course I discovered also some little gems hidden between the big diamonds, while exploring. 

Example movie

Multiple States

In Captivate 8 it was possible to create 3 states for shape buttons, both in the Object Style Manager or individually using the Properties panel, Style tab. In this example you did see that the 'default button states' (Normal, Rollover, Down) can even have a different label, not only a fill and a stroke applied to them. Look at this screenshot of the Object State panel for the central oval shape button in the movie. Watch the default states (marked by red rectangle) and the extra 4 states I added to end up with 7 different states. 

For the four extra states I used SHIFT-CTRL-ALT-Z to Duplicate State a couple of times. You'll find the option also in the right-click menu on a state.

Drag&Drop objects also have InBuilt states, but will blog about Drag&Drop in a future post.

Hidden gem

In the Object Style Manager (I saved the style for that central shape button) the different default states for shape buttons show up, just like for any normal button. They were also saved in the OSM for Captivate 8, but not displayed in this 'cool' way :)

SVG - Illustrator roundtripping

I call this the (until now) missing link in the beautiful bracelet of Adobe applications that allow you to create amazing eLearning courses: Captivate, Photoshop, Audition, Edge Animate, Edge Inspect and now finally Illustrator!! Scalable Vector Graphics, contrary to bitmap images, do not suffer from quality loss on re-scaling. Moreover for simple graphics the file size is incredibly low, which is certainly an advantage when you are creating for mobile devices. Beware: file size can be large if you have complicated graphics. Look at this screenshot: I used 8 SVG's - they end up in a dedicated folder in the Library:

You see the usage in the Library as for other assets. Example: the SVG ManGreen has been used 4 times, in the 4 states of the central shape button.
The man-SVG's are very small, but the lightboxes with text are using a complicated filter and size is much bigger. The settings used in Illustrator to save these files as SVG are visible in the next screenshot. To preserve the font, you have to convert it to outlines.

Effects 2.0

The previous Effects panel is gone! Effects timelines are now embedded under the object to which they apply. Live preview with the Play button in the Timeline (or use Space bar), you can have all motion paths on different objects visible at the same time. That makes life so much easier. Curved motion paths are possible. When you hover over an effect in the Effects part of the Timeline panel, you'll see a preview of that effect. This works even with custom saved effects:


Hidden gems

  1. You can use the same shortcut keys for effect timelines as for the object timelines to increase/decrease its length. That is a valid alternative for typing in a value in the Timing panel or for dragging with the mouse. Example: right arrow key will move the whole effect timeline 0.1sec to the right, CTRL-Right will move over 1sec, SHIFT-Right will increase the timeline duration with 0.1sec. All arrow combinations shortcut keys described in this old article: TinyTimeline Tidbits are functional. I regret that CTRL-E, which extends the duration till the end of the slide has not been included for Effect Timelines. Neither does CTRL-L move the effect timeline to the playhead position, it will move the object timeline with the Effect timeline even if the Effect timeline is the selected one.

  2. For the custom motion effects (scribble, curved, line) start with the cursor over the present location of the object, and the beginning of the path will snap to the center point of that object (more precise: the center point of the bounding box).

  3. You can uncheck 'Show motion paths' if your screen is getting too crowded, look in the Timing panel just above the fields for Effect Start and Effect Duration. BTW you can increment the values in those fields using arrow keys: UP for 0,1sec, SHIFT-UP increments to the next full second. Field has to be selected in that case. If field is not selected you can use the typical Adobe scrubber.

New Commands

These commands have been added:

  1. Go to Next State: only available in the list for simple actions, for all events

  2. Go to Previous State: only available for simple actions, for all events

  3. Change State: available for simple, advanced and shared actions. This command needs two paramaters: the object and the state; for a shared action both will be compulsory parameters. I used this command a lot in the example movie, both in a conditional advanced action (on the central shape button) as in a shared action triggered by the four bubble shape buttons.


  4. Delay Next Actions by: finally you will be able to time commands in the sequence for standard/conditional advanced and shared actions. This new command takes one parameter: the amount of time which can be a literal or a variable. In the next screenshot you see that I used it to play the audio clip after the custom effect (with a duration of 1.2secs) has been finished. That parameter is a 'candidate' parameter, not compulsory, when you use it in a Shared action. For more information about parameters see the article Parameters in shared actions. The situation is the same in Captivate 9 as it was in Captivate 8.
    Personally I am very excited about the this new command, which allows better control over timing by advanced/shared actions. 

Hidden gem

Also about timing, not a new command but an improvement of the command Apply Effects in an advanced/shared action: you can now add values for the Start time and the duration of the effect.

More Small Gems

  1. Drag&Drop until Captivate 8 didn't have a Success Caption by default. I explained a workaround in Drag&Drop Tips. You can forget about that tip in Captivate 9, Success caption is now available. It uses the default Success Shape or Success Caption style, depending on your Preferences and theme.

    Objects used in Drag&Drop similar to interactive objects, have also 'Inbuilt states'. That is not a little gem, will post a new Drag&Drop Tips article for version 9 in the future


  2. Intelligent naming of copy/duplicate. In former versions, a copy or duplicate of an object in the same file or in another file would get a generic name. In Captivate 9 if you copy/duplicate an object with a meaningful name the copy will keep that name with an added underscore+number. Big improvement, and now you have even more reasons to set up a good naming convention for your projects. Look at this screenshot: this is a copy of the central shape button to another file:


  3. Simple action feature: another popular post (and a Youtube video) can be dropped in the trash can for Captivate 9 but I don't regret it at all. You no longer have to create a standard oneline advanced/shared action (or use micro navigation) to prevent the playhead from continuing. Just check the box that is highlighted in this screenshot:




Dynamic Buttons

Guidance

If you’re planning on attending the Adobe Learning Summit, DevLearn, or both this fall, read on….   (If you can’t make it this year, there’s a consolation! Skip to the bottom of this post to get a tip about dynamic buttons.)

Most of you know that I frequently blog and post about Adobe Captivate. Well, Adobe has given me the wonderful opportunity to offer free in person peer-to-peer Captivate project help at the MGM Grand Las Vegas on September 29th and 30th. Since I’m flying from my home in Belgium to present at the Adobe Learning Summit, this is a great chance to meet and help you face to face, not virtually.

My friend and fellow Captivate user, Alice Acker, will host this event. To see as many Captivate users as possible, we’ve limited each appointment to a maximum of 30 minutes.  If you are part of a project team, we can accommodate your team at the appointment. These times are designed to limit disruption of your Adobe Learning Summit or DevLearn schedule. We’re co-located with the conferences at the MGM Grand, so there is no need to Uber or bike to us. We’ve made this super convenient for you.

Please bring me your most headache-inducing project, and I’ll do my best to solve your quandaries.  Since these spots are limited, make sure to sign up now with your top 3 appointment choices. The slots will be filled on a first come, first served basis. We’ll do our best to schedule you for one of them. If you just want to drop in to say hi, I’d love to see you. But, please make sure that you register so we get an idea of how many Captivate users to expect.

Once you’re successfully registered, you’ll get an email confirmation of your appointment, directions to the session, and a link to upload the project. It will really help if I can review it before the session. All information will be kept confidential. What happens in Las Vegas, stays in Las Vegas.

Looking forward to meeting you. Tot weldra in Vegas!

Lieve a.k.a. Lilybiri

This is the link to the registration form Form to complete


Dynamic buttons

In the archive you'll find several articles about shape buttons, which appeared with version 6. I used to call them 'chameleon', because they can be useful as shapes (images), text containers, buttons, and recently also for the automatic feedback text appearing on question slides and with interactive objects. Maybe you are not yet aware of this aspect of shape button? You can insert a variable as a label on the button. On runtime the value of the variable will appear. That value can be changed by actions, and the label will change in that case, hence my title 'Dynamic'. Some ideas to use this feature?

  • Localisation: if you use custom shape buttons on master slides (or timed for the rest of the project) to replace the play bar, you can change the label on those buttons based on the language choice. If the language is chosen from a dropdown list (learning interaction) or with radio buttons (learning interaction), insert the variable associated with that interaction. Combine this with the work flow explained in Branch Aware Quiz

  • Custom Question Slide: if you want to allow a limited number of attempts, you can add the attempt number on the Submit button, or you can change the label to 'Continue' after the last attempt. Of course you'll need a companion conditional action to change the functionality of the button as well.

  • Navigation: if you use shape buttons on the master slide, they cannot be hidden/shown. But you can change the value of the variable that acts as label on each slide. Using a Back/Next button, put a null value to the label on the first slide for the Back button, and change the Next button to an Exit or Return button on the last slide (you'll need to create a conditional action in that case as well).


Windows 10

Just a short warning: do not hurry with upgrading to Win10.  Be patient, Captivate 8 is not guaranteed to be fully functional in this new OS. Personally I will wait to see eventual issues on forums and in groups.

Matchstick Game - shared actions

Intro

This post is inspired by a question on the Captivate forum, have a look at this thread: 'Advanced actions for a Matchstick Game'. After reading the question, I accepted the challenge. Some advanced actions are used, mostly to reset the game, but the two 
most important actions are shared actions. It is also a good example for a lot of tips I have offered in this blog:
  • Setup of a labeling system that makes it easier to choose parameters when applying a shared action.
  • Sequence of statements and decisions in a conditional action is very important because Captivate will always evaluate each statement and decision in sequence.
  • Choice of optional parameters for a shared action.
  • Using On Enter Slide events to reset variables and objects.
  • Using groups to simplify advanced/shared actions.

Game - rules

You can play the game:
  • goal is to create a word from the initial set of matchsticks by removing some of them;
  • clicking on a matchstick will remove it and a ghost image will appear instead of the original matchstick
  • you can reset the matchstick by clicking on the ghost image
  • maximum number to be removed is 6; you will be warned when you reach that number
  • you can try to remove a seventh matchstick, but I consider that as cheating :)
  • you have a Restart button

Objects - Labeling

The game is on one slide after the intro-slide. This is the Timeline panel:

From bottom to top you see:

  1. Gr_Match: group with the images of the matchsticks. For labeling I divided them in 3 groups. I_MS_11 is the most left matchstick of the first group, I_MS_22 is the upper matchstick of the second group, I_MS_35 is the bottom one in the third group, etc. Those numbers will also be in the names of the Outlines, the Click boxes and the associated variables. This group is initially visible.

  2. Gr_Outline: group with the grey ghost images (outlines). Same labeling discipline: I_OL_11, I_OL_22, I_OL_35,...This group is initially invisible

  3. Gr_Txt: which is expanded on the screenshot has the three messages that are used in the game. This group is initially invisible.

  4. Gr_CB: group with click boxes over the matchstick images+outlines. They follow same labeling system: CB_11, CB_22, CB_35...

  5. Bt_Restart:  the button to restart, reset everything

  6. Tx_Task: the title

  7. Tx_Rules: the explanation

Variables

To track the status of each matchstick, I created a boolean variable with initial value of 0 for each of them. Labeling is similar to those for the images, outlines and click boxes: 

  • v_11, v_12, v_13, v_14, v_15   for the first group

  • v_21, v_22, v_23, v_24, v_25   for the second group

  • v_31, v_32, v_33, v_34, v_35   for the first group

Three extra variables were needed:

  • v_moves: will track the number of removed matchsticks

  • v_correct: will track the number of correctly removed matchsticks

  • v_visit: needed to track if the intro slide is visited for the first time; a jump to that slide is used in an advanced action to reset the game

Actions

Advanced actions

I will not explain the simple and the 2 advanced actions, article would be too long. In a planned cookbook for shared actions I will explain everything in depth:
  • EnterIntro: conditional advanced action with two decisions that is triggered by the On Enter Slide event for the first slide 'Intro'. It will check the value of the variable v_visit and jump to the second 'Game' slide if it is not a first visit. 

  • ResetGame: a standard advanced action is triggered by the Restart button Success event, and by the On Enter Slide event for the second slide 'Game'. It will reset all the variables and restore the initial view of this slide (no outlines, only images).

  • Simple action 'Go to Previous Slide' is triggered by the On Exit event of the second slide 'Game'.

Shared Actions

Two shared actions are used:
  1. MatchStickNOK: to be triggered by a click box over a matchstick that should NOT be removed. This shared action is used  9 times. It is a conditional action with 3 decisions: 'Doing', 'Checking' and 'Cheating'. In the screenshot you'll see this action, with as an example parameters are set to the '11' matchstick. That is a matchstick that should in this case trigger the second shared action.
    This shared action has 6 parameters. The only optional parameter is highlighted in this screenshot, it is the tracking variable v_x associated with the matchstick. No need to define the other variables (v_moves, v_correct) nor the literals as a parameter.



  2. MatchStickOK: to be triggered by a click box over a matchstick that should be removed. This shared action is used 6 times in this particular example. The first three decisions 'Doing', 'Checking', 'Cheating' are pretty much the same as for the previous shared action, with one exception: increment or decrement for the variable v_correct. This shared action has a fourth decision 'End' that will display a Success message if all correct matchsticks are removed. Since this can only happen when the user removes a correct matchstick, this decision was superfluous for MatchStickNOK action. The sequence of decisions is very important: the condition 'IF v_moves is equal to 6' (decision 'Checking') will also be True if 6 correct matchsticks have been removed, but the commands in 'End' will override those of 'Checking' because of the sequence. There are two screenshots here:

    This shared actions has 7 parameters since the Success Message has to be added. Only optional parameter that was upgraded to a real parameter is again v_x, the tracking variable associated with the matchstick.


Enhancements

I hear you! How will it be possible to use those shared actions for a Matchstick Game with another setup? I have some ideas, what about you? Please post your suggestions in a comment.





Dropdown Interaction - tips

Intro

Recently I published some tips about learning interactions, including an explanatory table. The use case in that post showed how to use checkbox and radiobutton interactions. Last week, a user asked a question about the dropdown interaction, which he used for a custom question slide: How can I check if the user has chosen an item? That is not difficult for checkbox and radiobutton, because their associated variable will be empty, but the situation is different for the dropdown interaction, hence this tutorial.
The most common failure that I detect on debugging advanced/shared actions with multiple decisions are due to a wrong understanding of the validation of those actions:
  • all decisions will be checked from left to right
  • there is no way of jumping out of the action when a correct condition is met.
In the use case from the example movie, that sequence behavior is very important!

Dropdown interaction

The properties dialog box is pretty limited:

In this example you see that:
  • entries are separated by commas
  • formatting allows to choose a font, font style and attribute (faux style), but font size is limited to 14pt maximum
  • the color dialog box doesn't show theme colors
  • the update button allows to see a preview of the look after formatting
  • if you want to validate the choice in the list, you need an associated variable (here v_drop); beware: you have to create the variable in the Variables dialog box
  • the first sentence mentions 'combobox' but as I understand the word combobox this is not correct: in a combobox you can not only choose from a list but you can type in a word (there was an older combobox widget), this learning interaction doesn't allow that.
Maybe you are bit puzzled by the first entry 'Choose a language'? Contrary to the radiobutton/checkbox interactions, the variable associated with a dropdown is never empty! By default it has a value equal to the first item in the list. In the example movie, you will see before choosing, and after resetting that v_drop is equal to 'Choose a language'.

Resetting: it is indeed possible since this latest version of Captivate not only to change the value of a variable by an action, but also to have this change reflected in the Display of the interaction. This new feature is used for the Clear button in the example movie.

Beware: for some reason, the first time you use the interaction you will have to click twice, first click to put focus on the interaction, second click to select item. Strange :)

Example Movie

This movie has only 4 slides. After the 'Intro'-slide you can choose a language on slide 'Drop'. Watch the variable v_drop that is visible in a text caption next to the learning interaction. You get 3 attempts to guess the correct language, reason for the variable v_attempts. The 'Drop' slide has two interactive objects: Submit and Clear. Try out Clear to see how the interaction is reset to its initial state. You can click Submit without choosing a language, you can choose a wrong language or the correct one. The third slide you'll only see when your answer is correct. If you exhaust the three attempts without correct result, you will end up at the 4th slide 'Retry', where you are able to get back to the 'Drop' slide and start guessing again.

Variables

Here is a screenshot of the user variables

As explained before v_attempts tracks the number of attempts and starts with value=3, v_drop is the associated variable for the dropdown interaction.

I used v_dummy, a variable containing the text  'Choose a language' out of laziness, to avoid having to type that text over and over again. Be careful: it has to be exactly the text in the first item, it is not possible to use a variable in the item list.

The variable v_groet is used on the third slide, to customize the text based on the current time of the user (cpInfoCurrentHour). The variable v_wrong is a Boolean (value=0) that will be set to 1 when the attempts are exhausted without finding the correct language.

Events and Actions

EnterDrop, triggered On Enter for slide Drop

This standard action resets everything on the second slide 'Drop': the group Gr_Feedback with empty, wrong and correct feedback messages (empty, wrong, correct) is hidden, group Gr_Bt with the two interactive objects made visible, variables v_drop and v_wrong are reset to the default values.

ResetAct, triggered by the Success event of the Clear interactive object

A standard action that restores v_drop to its default value and hides the group Gr_Feedback.

CheckSubmit, triggered by the Success event of the Clear interactive object

This conditional action has 5 decisions, one for each possible situation:
  1. EmptyDone if the user clicked on Submit without making a choice and it was the last attempt
  2. Empty if the user clicked on Submit without making a choice and there are still attempts left
  3. Correct
  4. WrongDone if the user choose a wrong language and it was the last attempt
  5. Wrong if the user choose a wrong language and there are still attempts left

The Sequence is important: if you put Empty before EmptyDone, it goes awry if it is the second attempt, because Empty would have decremented v_attempts and that means that EmptyDone would result also in a True condition, and user will lose an attempt. Same for WrongDone and Wrong, they cannot be switched. 

ExitDrop, triggered by On Exit event of slide Drop

Exceptionally I use the On Exit event, because in this case it will function perfectly. 
A simple conditional action, based on the value of v_wrong.

More...

There is a simple Jump to slide 'Drop' on the last slide. Resetting will happen with EnterDrop action.

The third slide has an On Enter action, to show the right caption based on the system variable cpInfoCurrentHour. 
Do you accept the challenge to figure out that (conditional) action? No need to use my tongue :)

Force first view - Captivate 8

Intro

As a former college professor I don't like to push students/trainees to watch everything in an eLearning course. After all, you can watch without really seeing as well, that doesn't prove anything about the real 'learning' process. Apparently not everyone agrees with my personal opinion and again a question popped up on the Captivate forums in this thread: Force navigation upon FIRST view....

Problem

The course was totally linear, which is a requirement for the simple work flow I will propose here. To force the student the first time to have the slide played totally before being able to continue is simple: use a custom Next button, timed at the end of each slide, do not use a playbar but a TOC for navigation to previous slides. And set up the TOC settings to allow navigation only to already visited slides.
To improve the user experience, when he is coming back to an already visited slide, the Next button should appear from the start of the slide. That way he can skip part of the slide if wanted. The easiest way to solve that problem is by using an extra, replacement Next button. Because timing from start till end of a slide is the same for all slides, this can be a shape button put on the first slide that is timed for the rest of the project, always on top. It is not possible to use a shape button on the main master slide because such a button has no ID, which means it cannot be controlled, shown/hidden which is necessary for our use case.
The initial buttons can also be shape buttons and for a seamless user experience I'd recommend to use the same look for both the initial and the replacement Next button. However those initial buttons need to be individual buttons on each slides because not all slides will have the same duration, especially when they have VO attached as slide audio.

Example movie

Watch this movie to check the solution. To make the switch between the initial Next buttons and the replacement Next button clear I used a different style. Moreover I inserted a text container with two variables: the system variable cpInfoCurrentFrame and a user variable v_frames (see later) that are used to solve the problem. To navigate back to already visited slides, open the TOC with the red curved arrow top left. The TOC close button has a similar look. Refresh the browser to start the movie again. I didn't check AutoPlay, you'll have to click on the (ugly) arrow in the middle of the slide.


Events and Variables

I created one user variable: v_frames. The system variable cpInfoCurrentFrame will be used as well.
This variable will be used to store the current frame number when the user clicks on an initial Next button. Example: on the first slide the initialNext button Bt_One will appear at 5 secs and pause at 5.5 secs. When you click that button, you'll see that on the second slide the variable has the value '166' which is about the frame number of 5.5 secs at a speed of 30FPS. It is never totally exact (should be 5.5*30 which is 165, but index starts at 0, the exact number should be 164). But for the purpose it will be used, this is OK.

The used events are:
  1. Success event for the initial Next buttons: rBt_One, Bt_Two, Bt_Three, Bt_Four. I don't need a Next button on the last, fifth slide. Those button will trigger the same advanced action NextAction:
  2. On Enter event of slides 1-4 will trigger a shared action Show_Next:
  3. Success event for the replacement Next Shape button SB_Next executes a simple action: "Go to Next Slide"
  4. On Enter event of slide 5 (last slide) will trigger a simple action: "Hide SB_Next"

Advanced/Shared Actions

Advanced Action "NextAction"

This action, triggered by the initial next buttons on each slide except the last slide, has only two statements:
The frame number of the pausing point (which is where the action is executed by design) will be stored in the user variable v_frames. Then the Go to Next Slide command is done. 
Why did I prefer to use an advanced action over my favorite shared action? I don't need to change this action when applying to another button. You could create a shared action if you expect this action to be used in other projects because it is easier to transfer them using the library. In that case the shared action will not need any parameters. When you transfer it to another project, the user variable v_frames will be created automatically. That is certainly an advantage!

Shared Action "Show_Next"

This is the action that does the trick! It is a conditional action: 
When a user enters a slide for the first time, the frame number of the first slide frame will be greater than the frame number stored in the user variable v_frames. That user variable has in that case the frame number of the Next button pausing point that was on the previous slide. But if the user comes back to this slide, v_frames will store a frame number of a similar Next button pausing point on a later slide. In that case the condition in this shared action will be correct, v_frames will be greater than the cpInfoCurrentFrame. The appropriate button is shown or hidden. It is necessary, for an unknown reason (was not the case in CP6, when I blogged about toggle buttons), you also have to enable/disable as well. This is probably due to the buttons being in exactly the same location, but it was not necessary in a previous version. 
I defined only two parameters in this shared action:
It is not necessary to define the user variable v_frames as a parameter because it is always reused. It is a pity that objects have always to be a parameter, because in this particular case it would have saved some time to be able to deselect SB_Next (the replacement Next button, timed for the rest of the project) as a parameter. Maybe in a future version? Some will prefer advanced actions and duplicates to be edited for each button but remember: multiple instances of a shared action do not increase the file size, whereas multiple duplicates of an advanced action do increase file size. And I like the presence of the shared actions in the Library, and easy way to use them in other projects.

Conclusion

I love to solve this kind of problems, trying to find an easy solution that can be reused over and over again. If you ever are stuck with such a problem, please contact me. I am available as a freelance consultant, and having taught for many years in college, be sure to get some training on top.






Tips - Learning Interactions

Intro

Captivate 8 has included several learning interactions, that are not well documented in the official Help. You'll be able to download a descriptive table at the end of this article. In the past I have been blogging quite a few times about using Widgets. And there was a similar article 'Using Captivate Widgets? Some tips'. Learning interactions is the name used by Adobe to indicate widgets that are compatible with SWF and HTML5 output, whereas the former Widgets were meant for SWF output. Some of the widgets are still available, others have been replaced by a learning interaction. Widgets can be found in the Gallery\Widgets under the installation folder of Captivate. Learning interactions can be found also in the Gallery, but you'll use them from a duplicate folder in Public Documents, which is easier to access if you don't have full administrative rights. 

In this article I'll offer some general tips. You will see an example movie, using the Radiobutton and Checkbox interactions but I will not explain in depth the advanced actions used for that example. 

Inserting Learning Interactions

There are two possible work flows:

  1. In the Big Button Bar, use the button Interactions, last option. A dialog box with thumbnails of all interactions will be opened. You'll see a badge 'New' or 'Updated' sometimes, when a new version has been pushed to your system.
  2. From the Insert menu, choose Widget and if necessary browse to the appropriate folder. I'm on Win7, you see the folder in top of the screenshot:

The second work flow is also valid for Widgets, and can be used also if you have problems with the Thumbnails dialog box not showing up. I also prefer it because scrolling through a list with names is more efficient than with the other dialog box. Which work flow you prefer, you'll see the the dialog box to edit the properties and parameters for the interaction popping up. In this screenshot you see the dialog box for a simple radiobutton interaction with 2 options (True/False). I unchecked Highlight because that puts a rectangle behind the words 'True' and 'False'. This is one of the interactions that has an associated variable, labeled v_one in this case.


Associated Variables

As you'll see in the table, several interactions have one or more associated variables. In combination with advanced/shared actions this gives you lot of possibilities for using the interactions. You can have a look at the example movie, using both the radiobutton and checkbox interaction. 
As I warned already in the article Tips about widgets, mentioned above, those variables are not created automatically because you type their name in the Properties dialog box, you have to create them in the Variables dialog box as well. The type of the variable is mentioned in the reference table that you can download from the link at the end of this article. 

Example Movie

After the title slide you'll see a slide with 3 Radiobutton interactions to create T/F questions. The Next button triggers a rather complicated conditional advanced action that covers all possible situations:
  • if the user clicks without answering any question
  • if all questions are answered with False (they are mutually exclusive)
  • if more than one answer is True

If you want to test all possibilities you'll have to refresh the browser several times.

I'm using the new possibility to control the display of the radiobuttons, they can now be cleared by controlling the variable.

On the third slide I use the Checkbox interaction, and if you choose the first option (Captivate 8.0.1) on the radiobutton slide, the first option will already be checked for you, another application of controlling the display, in this case using the same user variable for the first T/F radiobutton and the first option of the Checkbox interaction. The advanced action triggered by the Next button will navigate you to another slide, either slide 4 or 5 as you'll find out.

I added a text container with the four user variables v_one...v_four to show how they are changed in the movie.

Resizing - Refresh Widget

When using the interactions Radiobutton, Checkbox, Dropdown and Scrolling Text you'll often need to resize the interaction on the stage to make everything visible. The placeholder on the stage then can look very distorted, discover the Resize Widget button in the Properties that will appear after each resizing to have the placeholder adapt to the new size:


Customizing - Theme colors

All learning interactions can be customized, at least concerning the colors used. New in Captivate 8 is the possibility to have the Theme Colors palette applied to the interactions. I mentioned this already in the article about: Theme Colors. In the table I indicate which interactions do have that new feature. It is not the case for the Checkbox, nor the Radiobutton interaction. You can see the option in this screenshot of a Glossary interaction:


Improvements for Responsive Projects

Some interactions recently got an update to improve the user's experience when used in Responsive projects. You'll also find indication about that in the table. Whenever you see the option 'Scale Text for Responsive Projects'. On the screenshot of the Glossary interaction that option is visible.

Static versus Interactive interactions

In the former Widgets panel, which disappeared in the new UI of Captivate, you could see that widgets existed in three types: Static, Interactive and Question. Interactions have only two types: Static and Interactive. The difference is the same as for the standard objects: an interactive object (shape button, click box, button, Text Entry Box) has events that can trigger an (advanced/shared) a action and can have a score that can be added to the Quiz total. Non-interactive or static objects do not have those two features.

Most learning interactions are Static. Only the Games (with exception of the old Word Search interaction) are Interactive. Beware: although the score for some Games is stored in the associated user variable, you cannot add that score to the Quiz total. The points attributed to a Game in the Reporting section, are granted to the user in the same way as most questions in Captivate (with exception of the MCQ): black-white. If the game has been played, the user will be awarded the points, whatever the score of the game was.

Table - categories

You can download the table here. The categories are my personal choice:

  1. Interactions without variables
    1. Objects: several small interactions
    2. Display: interactions like accordion, tabs... that allow you to show a lot of info on one slide
  2. Interactions with variables: most of my favourites are here like the checkbox, dropdown, radiobutton and scrolling text
  3. Games (with or without variables)

Drag&Drop is to me also an interactive interaction, but because of its importance and different work flow it is not in this table.

Waiting for your comments :)




Branch Aware Quiz

Intro

A recent question on the forum (Duplicate Quizzing) and my plan to write an e-book dedicated to Captivate Quizzes is the reason for this post. Forum user wanted small quizzes in different languages in the same Captivate file. If the trainee chooses for a language, He should be scored only for that language. I explained that 'Branch aware', feature added to Captivate with version 6, was the way to go. Help documentation however is pretty concise: exactly 91 words.  I wanted to explore this feature more in depth, and see how to create the best experience in each language, which is not that intuitive as you'll discover. It is more the localisation of Quiz/Score slides that is cumbersome.

Example movie

Play this movie to see the result. After the title slide, you'll have to choose one out of three languages, or all the questions. There are three questions (same) in each language, totalling 9 questions. The score slide is not totally localized as you'll see. Each question has one attempt on question level. I provided two attempts on quiz level. You'll be able to Retake the quiz once, and to Review. Backwards navigation is not possible. Branch aware setting automatically disables navigation (no playbar). Watch the progress indicator, which I edited to 'X/Y'. Refresh your browser window if you want to replay the movie. 

On the question slides a text caption with 4 system quizzing variables is inserted:
  1. cpQuizInfoPointsscored: score obtained by user until now
  2. cpQuizInfoTotalQuizPoints: maximum score if all questions have been taken; this can be found in the Advanced Interaction panel (F9)
  3. cpQuizInfoTotalCorrectAnswers: number of correct answers until now
  4. cpQuizInfoTotalQuestionsPerProject: total number of questions in the Quiz, also to be found in the Advanced Interaction panel (F9)

Quiz Setup

Quiz Preferences

In the screenshot  you see that:
  • 'Branch aware' is checked
  • 'Allow Backwards movement' is unchecked
  • 'Show score at end of Quiz' is checked
  • 'Allow user to review the quiz' is checked
  • 'Hide Playbar in Quiz' is checked
In Pass/Fail I allowed two attempts, and show the Retake button. Since the score slide is the last slide of the project, I didn't specify any actions on Quiz level, both are left to 'Continue', which means going to the End slide. The progress indicator was changed like this to make it universal, because you cannot localize it in this specific situation, it needs to be the same in all question slides. I changed it in Quiz, Preferences, Default Labels:
In the movie you saw that this indicator doesn't appear as configured, probably because the factor Y, total number of slides, is unknown at the start of the quiz. 

Object Styles/Master slides

The feedback captions are replaced by shapes (rounded rectangles) and I edited the colors with the Theme Colors used in this custom theme. 

For each language I created Quiz master slides (for the used question types) to localize the buttons. As usual I dragged the Next button (invisible here) under the Clear button ('Wissen' in Dutch). I didn't bother about the Back button because I accepted to delete those Back buttons when unchecking 'Allow Backwards movement'. 

Localization remains a cumbersome work flow: you cannot translate the content of the feedback containers on the master slide, this has to be done on the slides.

It had no sense to localize the Score master slide, because each Captivate file allows only one Score slide. Read later on why I didn't drag the Review under the Retake button, which is my normal work flow for Score slides.

Branching

Dashboard to Quiz

I created a user variable v_lang that will remember the choice of the user. For its values you can use numbers, one character (my choice: 'D' for Dutch, 'F' for French, 'E' for English) or a word. This variable is populated on the dashboard slide (slide 2) with the stars. Each star is a shape button, triggering a shared standard action. In these two pictures you see screenshots of the template and of the parameters, both filled in for the Dutch button star. Statements are self-explanatory: assigning a value to v_lang, disabling all buttons, applying an effect to non-chosen buttons and showing the right text.

If the user prefers to take all questions, by clicking on the CP-button, the value of v_lang remains empty. To make it possible to check for an empty value, I needed a second user variable v_null as explained in this post: Where is Null

The CP-button on the slide controls the navigation with a conditional advanced action that has 4 decisions. First decision 'Empty' checks if v_lang is empty, the three other decisions check which language was chosen (values D, E or F). 

Quiz to Score slide

Last slide of each group of questions needs a conditional navigation because of the branching. On Exit event for question slides is not available, the action has to be triggered both by the Success and Last Attempt event in the Quiz Properties, Actions part.

Because this action EndQuiz has never to be edited, I preferred a conditional advanced over a shared action:

Score slide

What is different?

If you watch the system variables displayed in the movie, and compare them with the numbers on the Score slide, you see that they only match if all questions are taken. When only one branch has been done, you see a difference for:
  • Maximum score (cpQuizInfoTotalQuizPoints), which is used to calculate the percentage as well; it contains always the total number of questions, but the results slide shows only the maximum score for the questions in the Branch taken by the user.

  • Number of questions (cpQuizInfoTotalQuestionsPerProject) also contains the total number of questions, but on the results slide you'll see the number of questions in the Branch taken.
Consequence is that you will not be able to create a custom score slide (see: Intermediate score slides)  when Branch aware is checked.

I discovered another difference in the behavior of the Retake button. For a non-branching quiz, the Retake button will disappear automatically in two situations: when the Quiz attempts are exhausted or when the user passes the quiz. If you check Branch Aware, the Retake button does not disappear when the user passes, only when the Quiz Attempts are exhausted. Bit strange. To avoid confusion between the Review and the Retake button I use to drag the Review button under the Retake button. This prevents the user to Review a Quiz before having succeeded or finished the Quiz attempts. That work flow proves impossible with Branch aware checked. For that reason I had to show both Review and Retake buttons, and add a warning in the custom Feedback. I dragged the Retake button over the Continue button, because that button also can lead to confusion and should never be deleted. 

Localization

That was the toughest part. Only one default score slide is allowed in any Captivate project, the numbers shown in that score slide cannot be retrieved for use in custom score slides. 
Each field on the score slide has a 'label' and a 'number' part, they are linked. You can format them separately, but you cannot delete the label and keep the number result.
I had to cheat, because the labels needed localization, and I decided to change the color of the default labels to the same color as the background of the slide (luckily a solid one-color fill), to make them invisible. Then I made them small and dragged them to a corner of the slide. 

That way I was able to add custom labels, which are grouped in the Timeline; each group (Gr_Dutch,....) also includes a localized title:

The feedback on the score slide appears normally in the Review Area. It is possible to drag that area off stage. I created 8 feedback shapes and grouped them in Gr_Review. The appropriate feedback will appear due to another conditional advanced action triggered by the On Enter event of the Score slide. This action has 8 decisions, you see first 3 decisions in this screenshot; the other decisions are similar:

The buttons are not localised, and I didn't create trilingual labels for the users that took all questions. It would be possible for the buttons, when splitting them up in a button and an overlay text, but I always get tired when having to localize Quizzes, sorry for that.

Conclusion

Branch aware is a great feature (if you don't have to localize). I hope you discovered with me how to set it up, and where you have to be careful. Maybe the localization tips are overkill for the lucky Captivate users who never have to create a project in another language than Captivate's language :)

And for the fans, between the lines you could discover a tip about choosing between shared and advanced actions as well. Hope you discovered that tip?

Theme Colors

Intro

In my previous post I explained the work flow to create a custom Theme Colors palette, starting from an Adobe Color palette (ase). Theme Colors palettes can be applied to any theme, they are stored in the Layouts folder of the Public documents, they are not project specific. This article will show the consequences of applying a new Theme Colors palette to a theme. As you probably know a theme has three principal components: object styles, master slides and skin. 

Moreover Captivate 8.0.1 allows to apply theme colors to a bunch of learning interactions (not to all yet). That is a big improvement, because most of those interactions have their own themes and it was a lot of work in former versions to edit colors in the interactions to match the theme of the project. 


How are Theme colors used?

You can customize one of the existing themes by changing the Theme colors in the first place, then adding objects, changing styles, master slides etc. For a totally new theme you will probably start with the Blank theme. Maybe in a third article I will offer some tips about using Blank theme. In this post I will only talk about the other themes, and the way a new colors palette will interact with them.
In the dropdown list under Select Theme Colors, you'll see on top the category 'Custom Theme Colors' and to the bottom 'Pretest Theme Colors'. 

For each included theme you'll find two Theme color palettes in Captivate 8: one with the same name as the theme (in 'Preset Theme Colors'), and one with that name followed by Shade (in 'Custom Theme Colors'). Example: Flat color palette, and Flat Shade color palette. Only the Blank theme is an exception. 

When you open the Theme Colors window, and choose Customize for a palette, you'll see 10 colors. A name has been given to each color, but those names are misleading, as I will explain. 
I prefer to label them color 1-10. Why? What do you expect when seeing a name like 'Title', 'Sub-Title', 'Slide BG', 'Fill', Stroke? I naively (or is it my engineer's mind) supposed that the first color (Title) would be applied to the Titles on the Master slides, the second color (Sub-Title) to the subtitles on master slides, Fill and Stroke to shapes or other objects, Slide BG to the background of the slides (project background). But when I explored the themes, included with Captivate, I discovered that this is almost never the case :). If you download this file, you'll see two tables: one for text styles and one for the three states of Shapes. Some conclusions:
  1. Font color of the default Title Smart Shape Style which is used on the Master slides is the first color 'Title' in themes Flat, Green, Nimble, White and Woodgrain. Blackboard uses Text 2 (Color 4), Clean Blue, Clouds and Vivid use Skin 2 (Color 9), Half Tone uses Stroke (Color 6). 

  2. Font color of the default Sub-Title Smart Shape Style, also used on Master slides is never color 2 'Sub-Title' except for the Flat theme. All other themes use another color.

  3. Font color of Caption text uses quite a myriad of colors: Stroke (color 6), Text 1 (color 3), Sub-Title, Sub-Title tint 5 (color 2 - see tints later on), Title (color 1), Skin 2 (color 9).

  4. Same for the three font styles on Question slides: Title, Question and Answer.

The default Shape style in the Object Style Manager has three states (Normal, Down and Rollover) because every shape can be used as a button. In the second table you'll see Stroke color, Font color, Fill color (Solid or Gradient, and Alpha) for the three states. Only the Font color seems to remain the same for each state - not always a good choice (sometimes unreadable because of change in fill). 

Why did I create those tables? If you change the theme colors, some of the object styles, master slides and skin will change based on the new colors and on setup of the colors in the original palette. This means that the same custom color palette will create a different look, depending on the theme for which it is used.  Not all object styles are using theme colors however, some will not change color: this is the case for the new Success/Failure/Hint smart shapes that you can use to replace the captions for interactive objects and question slides (Preferences). Of course, the old Success/Failure/Hint captions cannot apply theme colors neither, but for the shapes this is possible without having to create custom captions in a graphics editor. 

Example

I created the color palette  'Lilybiri' based on my logo (see previous post). Browse this Picture Gallery. You'll see one slide, with that palette applied to the White, Vivid, Flat and Halftone Themes. Watch the colors of the master slides, Title, Subtitle, Caption and the 'rollover' state of an inserted shape button. You see that the result is totally different.

If you want to change just the theme colors for an existing theme you have to check the master slides and the object styles. I would have preferred to have more consistency in the use of the theme colors in the themes. Especially in this version, because to create a custom theme you need to start from an existing theme, certainly for responsive projects. 

Tints 

In the first article I already explained that Captivate will create 5 tints for each of the theme colors, besides the base colors of the palette. Some of those tints are used in the existing themes: on master slides, in object styles and in the skin.
Contrary to the base theme colors, which I indicate now with codes 1.0, 2.0 .... 10.0, you do not have any control over the way those tints are created. I use code 1.1, 1.2 ... 1.5 for the tints based on color 1.0 in my code system. If you apply a custom theme colors palette, Captivate will create those tints, but my curious mind wondered "HOW"? Because the term 'tint' was used, I suspected that looking at the HSB code would be a better idea than the provided Hexadecimal or RGB codes. HSB is used in a lot of Adobe applications to indicate Hue, Saturation and Brightness. I have now a complete table with HSB-codes for all provided theme color palettes. I didn't include it here, it was meant to discover the logic of the tints creation. And there is some consistency, my conclusions (see also the image below):
  1. For gray colors (like 4D4D4D, E6E6E6...) you'll see that Hue and Saturation remain equal to 0 and only the Brightness will decrease from tint 1 to 5.  Same of course for Black (000000) and White (FFFFFF).

  2. For normal colors the Hue remains constant (there are small variations) for all tints.

  3. First tints (1-3 or 1-4) keep high Brightness but start with lower Saturation that will increase

  4. Last tints (4-5 or 5) keep Saturation of previous tints but decrease the Brightness

Depending on the default Theme you are using, the tints can be slightly different, but not in the same way as what I showed about the style colors in the previous point.


Learning Interactions - Theme Colors

Some learning interactions do have their proper themes. Now it is possible to apply the colors of the active Theme Colors palette to the interactions as well. However, they are not applied automatically, you need to use the Custom button. There are two possible work flows:

For the (older) interactions Accordion, Tabs, Process Circle, Pyramid Stack, Timeline, Circle Matrix, Pyramid Matrix, Glossary, Word Search and Certificate

  • The interaction themes are at the left, with default theme selected; use the Custom button at the bottom

  • Default Colors are activated, and you could customize them using the Customize button, but then you'll see the old cold dialog box, which has no link to your theme colors

  • Click on Theme colors: the preview will be changed immediately, and the Customize button now appears under Theme Colors

  • When using this customize button, you'll see the Theme colors with their tints when changing a color.

For the new games Catch AlphaNum, Jeopardy, Memory and Millionaire

  • After setting up the game, go to the second screen (mostly with an red arrow at bottom right) to Customize

  • Look for the button 'Color settings': in some games it is at the top, in other (like in the screenshot) at the bottom

  • Same work flow there: if you click on Theme colors the present color palette will be applied

  • Customize becomes available under Theme colors instead of Default colors and will show you the Theme colors palette with all the tints.

The other interactions do not yet offer the possibility to use theme colors.

Tips

  • Be careful when creating a custom color palette to apply to an existing theme: look at the two default palettes provided for that theme and try to assign bright colors to the same color number as those palettes, same for darker colors. Maybe the table I offered with the use of the theme colors in all themes can help.
     
  • Check the object styles after applying the new color palette, the easiest way is in the Object Style Manager; do not forget that shapes have colors for the three states

  • After checking the object styles, check the master slides: objects and background will have changed colors as well. If you use shapes for Success/Failure/Hint messages, check their style because they will not be changed to the new color palette.

  • I didn't mention the skin, but playbar as well as TOC settings will also get color changes when applying a new color palette, check them as well

  • When using learning interactions, try to change to Theme Colors if they offer that possibility, and double-check the result that you can edit with the Customize button.





Colorful 2015 with Adobe Captivate

Intro

Color management in Adobe Captivate is improving slowly but steadily. Too bad: the Help documentation is not offering much explanation about color workflows at all. Have a look at what is explained about enhancements in Captivate 8.0.0 and 8.0.1 and tell me if this is sufficient? It is not for me, and I have a 25 years history as a Photoshop trainer. Do you know about the relationship between the Swatches panel, the Color schemes that appear in a lot of dialog boxes (not only for Fill/Stroke, but also in learning interactions), the Theme colors and the colors applied by default in the Object Style Manager, Master slides and Skin? Since many months I'm trying to figure out a good practice using the enhancements in Captivate 8. In previous versions I created color swatches in the scratch area (outside of the stage) to use with the color picker in order to achieve a consistent color use. That is at the least cumbersome compared with color management in applications like Photoshop and Illustrator.  Since October 2014 for those CC applications I'm able to create and use my Adobe Color palettes (ase), stored in the cloud, on any device and system. Adobe Color is installed on my tablets and smartphone, allowing to create color themes at any moment, often from a shapshot. That new sharing feature (Libraries) is not available (yet?) for Adobe Captivate. 

In this first article I will try to find a way in the jungle of Captivate's color terminology and explain my present work flow to manage colors in a project by creating a custom theme color palette, starting with an 'ase' file created in Adobe Color. Let me know if you find this useful, please? In a second article focus will be on the use of Theme colors:  in object styles, master slides, skins and how to use them in (some) learning interactions (new in Captivate 8).

Swatch Manager

In the help you'll find a lot of screenshots where it is labeled 'Swatches'. But in CP8 title was changed to 'Swatch Manager'. I'm working in Expert UI, and have that panel always available in the right docking station, and make it floating when necessary. If you prefer the default newbie UI, there is a video in the Help that explains how you can open this panel: http://helpx.adobe.com/captivate/using/whats-new.html

You'll see a pretty big color palette in the manager: 8 rows with 15 color/tints, starting with 12 gray tints. When you hover over a color you'll see its Hexadecimal code, top left. To see RGB or HSB codes of the existing colors is a lot more complicated. When a color is selected and you click on the color wheel on top, it is not the selected color that shows up (as I expected) but always the gray color #404040. There is no direct way to see other color codes of the swatches (like HSB, RGB), contrary to the Color Dialog box, that will show you the hexadecimal code and RGB (not HSB) when selecting a color and clicking on the Color Wheel.

If an object is selected on the stage, you can use this Swatch Manager to apply one of the swatches as Fill or as Stroke color. For a text container (shape or caption),  in text editing mode, you can use it to apply a swatch as Text or Highlight (background color behind text) color. That is the goal of the radio buttons in the third row. Honestly, I never use that work flow, if you accidentally choose the wrong radio button, you'll change the Fill instead of the Stroke color. 

The color picker and the color wheel (that will show HSB, RGB and hexadecimal code) on top (first row) are meant to add individual swatches. You will be asked to give a name to a new swatch, the default swatches have no names.

TIP  

When you customize the palette in the Swatch Manager, it becomes available for all open projects, it is not project specific. BUT!!! A big problem is that you cannot save the swatches with a project at all. Whenever you reopen the project, the default swatches palette will appear. Even when you put a PC in Sleep mode, after wake up the custom swatches palette has disappeared and you have to load it again. This is the main reason why I never use the Swatches Manager to edit colors in a project as I mentioned before, but use it only to define a Theme Colors palette. 

The buttons in the second row are the most interesting!


Captivate and Adobe Color

I am using the Swatch manager to create a custom color palette, starting with an Adobe Color scheme. The buttons at the second row, from right to left, are:

  • Clear: this will delete all color swatches in the panel - not really necessary if you use Load

  • Reset: will revert to the original 8x15 palette, any added individual swatch, or loaded custom palette will be cleared

  • Save: the present palette will be saved in the Adobe Color format, extension 'ase' (Adobe Swatch Exchange). The default name will be the project name (you can change the name of course); this can be useful if you created a custom color palette in Captivate, for import into another Adobe applications like Photoshop.

  • Load: allows you to load an 'ase' file created in another Adobe application like Adobe Color. Captivate also accepts 'aco' (Adobe Color, have more information like Pantone color) files but I seldom use that palette format. You get a warning that the existing palette will be replaced by the new, but can still revert to the last option:

  • Append: will add color palette described by an ase or aco file to the existing colors.
An Adobe Color ase file will typically have only 5 colors. There are a lot of tutorials around about using Adobe Color (formerly Kuler) and you can install it for free on any device or use it right from the web site. Just an example: you can create a color scheme from a logo in a quick way. The color scheme imported here into the Swatch Manager is based on my company's logo.
Adobe Color is part of the Creative Cloud,with a CC subscription you'll have access to your personal color themes in the cloud from a lot of Adobe applications without having to save/load it using the ase file. Crossing my fingers that in the future this will also be possible for Captivate.

In most cases, 5 colors will not be sufficient for Captivate to have a complete color scheme. The reason is that Theme color palettes in Captivate have 10 colors (see later). 

Add swatches

Second step in my work flow is to extend the palette to more colors (not necessary 10), that match the existing scheme. This can be done, swatch by swatch,  with the color picker or with the color wheel. Very often I will add white or a very light tint of one of the existing colors (using HSB), and a very dark one or black (if it is not yet present). A similar approach is used by the Tints in Theme colors (see later). Depending on the style chosen for the Adobe Color Theme, maybe you'll need a very contrasting color as well.
In this screenshot you'll see how I used the green color to create a very bright one by keeping the Hue (H in HSB) but increasing the Brightness (B) to 100%. I added 3 swatches in total to have a palette with 8 colors.

Color dialog box

The color dialog box has 3 different looks, depending on the buttons on the top. The active look can be detected because that button will have a very thin black line surrounding it (maybe you'll have to get closer to the screen to see it). Those looks are, from left to right:

  • "Theme Colors": this look will appear by default if the selected object's Fill (or Stroke) has a default Object style using a Theme color, or if its color has been applied from the Theme Color palette.
    The top row shows the Theme colors (see later), under them you'll find 5 extra tints for each theme color. I regret that it is not possible to see the color code of any of the colors directly, it would be great if they showed up on hovering over a color (as hexadecimal code) or even better if you could have full info in the color wheel when clicking on a color. That is not the case (yet?). When exploring, I found that all tints have the same hue (in HSB), different Saturation and Brightness.
    At the bottom you'll find the colors as they were last used, last used color is the first in that sequence. Not that useful (my personal opinion). That row is dynamic, changes whenever you use another color.


  • "Swatches": this look will will appear by default if the selected object's Fill (or Stroke) color has been applied using the Swatches Manager.

    You will see the swatches in the upper section, and the 'last colors' palette at the bottom

  • "Color Wheel" will never show up by default. It allows you to choose a different color, either by picking it (click first on the right vertical bar to choose a hue, then you can change saturation and brightness in the big rectangle) or by entering a Hexadecimal or RGB code. Contrary to the dialog box for adding a swatch,  HSB is not available here. It also shows the last used colors.

  • "Color Picker" is the last button, no look on itself. It allows to pick a color somewhere outside of the dialog box. While moving the picker you'll see the Color Wheel showing up in the dialog box.

A similar Color dialog box shows also up for the gradient stops when editing a Fill gradient, when customizing colors in the Theme Color palette, and in a reduced edition when customizing colors for Learning Interactions.

Theme Colors 

This new feature in Captivate 8 allows to change quickly the look of an existing theme (object styles, master slides, skin). Next week I will talk more extensively about those changes, because not every style will be edited automatically when applying a new palette of theme colors. My work flow, after having imported and extended a color scheme in the Swatch Manager, is to create a custom Theme color palette based on those colors. With that work flow, the color dialog box will always appear in its first look and provide besides the original Theme Colors a set of 5 extra tints for each theme color. Although there are by default 10 colors in such a palette, you can assign the same color more than once. More details about the use of the 10 colors will be provided in the next blog post.

Contrary to the color schemes created with Adobe Color - ase file format - the Theme Colors are saved as XML files. You can find them in the Layouts Folder (under eLearning Assets in a public folder). The XML file is pointing to the RGB codes as you can see here:

You could create a custom theme colors palette by creating new XML files, but you'll need a more exact number for RGB in that case then the one provided in Captivate. An alternative is this work flow:
  • Open the Themes list with the big button on the top bar

  • Click on the Theme Colors button, bottom right

  • Theme Colors dialog box, in its Basic view only gives you the dropdown list with color palettes


  • Click the Customize button (bottom right) to open a hidden part of the Theme Colors dialog box (with Basic button you can hide that part again)


  • You'll see the 10 colors, and clicking on a color will open the Color dialog box in its "Swatches" look. You can now customize that color. The names of the colors are not really relevant. Some colors are not really used in most themes but that is another story, which you'll discover in a later blog post.

  • When you are ready, first change the name of the theme: blue text 'White' can be edited; there is no Save as (at least I couldn't find it).

  • Click the Save button: custom Theme Colors palette is created and immediately applied to the present project. You'll find its definition in a XML file with the same name in the public folder I showed before.
From now on you can use these theme colors for all editing. In the next blog post I'll explore how those colors are used in the current themes in Captivate, and how you can apply them to learning interactions. That post has now been published.

Summary

If you made it up till this paragraph, maybe you'll be confused by the Captivate Color Jungle?  Here is a short summary of the described work flow, to create Theme Colors from a custom Adobe Color scheme:
  1. Import the 'ase' file in the Swatch Manager, using the Load button

  2. Add more swatches to the default 5 colors of the scheme, using Color Wheel or Color picker in the Swatch Manager

  3. Save that extended scheme as an 'ase' file (because custom color schemes in Swatch Manager cannot be saved); that way you can reload it if necessary

  4. Open the Theme Colors dialog in its extended version, customize the 10 colors.

  5. Change the name of the default theme

  6. Save the custom Theme Colors palette

Thanks for your patience, please leave your comments! May a lot of your wishes be fulfilled in 2015. I have some for Captivate as well :)

Custom Hotspot questions in Captivate 8

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.