Timeline for 360 slides (static/video)

Intro

A while ago I published several blogs and interactive movies (created with Captivate) about the ins and outs of the Timeline in Captivate, which is still the feature that causes most frustrations because of lack of understanding. With CP2019 some new features are added to that timeline, for the VR projects (360 slides) and for interactive video. Looks like it is time to explain those new features. This blog has focus on the timeline in 360 slides inserted in a non-responsive project.  Those slides are not able to have overlay Quiz slides as is possible in a full VR project. In a future post I will talk about the overlay Quiz slides and their timeline. I published recently a short post with some tips for a VR project.

360 slides

In a non-responsive project you can use the big button Slides to insert a slide which has a centered button to choose either a 360° static image or a 360° video. It is not possible to drag a 360 item to the slide from the Library, you need to use that button.

The 360 image is inserted as background, whereas a normal image inserted on a slide will have an individual timeline. In the Library you will see the images in the Background folder, and you have to use 'Find Background'.

Static 360 image

Editing a 360 slide is more limited than editing a normal slide. You will not have an Actions tab in the Properties panel, which means that you cannot use the On Enter/On Exit events for the slide. The Big Button Bar is mostly dimmed. There are only two assets that can have a timeline as you are used to:

  • Audio (under Media button) can be added as slide audio, which will have its timeline as expected under the slide timeline. Slide audio can be paused on a 360 slide by a hotspot, just like by any interactive object: you find the feature 'Stop Slide Audio' on the Options tab of the hotspots (including Character which is also inserted as hotspot). 
  • Label (under Text button): can be added, formatted and timed. It can be used for titles or for instructions that need to be available even if the playhead moves. Labels can be moved and will be 'distorted' to fit in the spherical image if necessary. IT is not possible to apply an effect on the labels. 

You will see 'Characters' available' under the Media button as well. However inserting a character will create a hotspot where the character is used as custom image.  It is not possible to resize the image, only the location. In most cases the characters will be very big due to that lack of editing.

The functionality of a 360 image is mainly in the so-called  'HOTSPOTS' to be inserted from the big button with that name. Referring to existing terminology, a hotspot is a new type of  interactive object similar to click boxes, (shape) buttons. However hotspots have a timeline with zero duration. In the timeline the visual representation of a hotspot is  either a half circle (brownish) if the hotspot is on the first frame of the slide, or a full circle (when on a later frame).  A selected hotspot has a blue circle surrounding the normal icon. In the following screenshot Hotspot2 is selected. The generic names were kept, but I have changed the stacking order by dragging hotspot 2 on top of Hotspot3.  Each hotspot is marked on the stage and after publishing by one of the SVG's, a custom image or a character as mentioned above. 

Default setting for each hotspot is to keep the timeline paused. For simple actions triggered by buttons in normal slides, the default setting is 'Continue playing the project'. For the hotspots, that setting is unchecked by default (if you trigger 'Play Audio' with a hotspot it will change as expected to Continue movie after audio is finished).

If you leave that option unchecked, the playhead will remain paused. If you use the option 'Explanatory', this means that all hotspots sharing that frame will be visible to the learner. In some cases you'll have only hotspots in the first frame (look at the sample project), but to avoid overload in a complicated image, you could choose to have groups of hotspots in a later frame. You see an example in the screenshot of the timeline inserted earlier: two hotspots are in the first frame and 3 more in frame 45(1,5secs). In that case you have to release the playhead, which can be done in two ways:

  1. By checking the option 'Continue playing the project', not so interesting if you have set up the image in 'Explanatory' mode where the earner can choose the sequence of clicking the hotspots. But it can be a solution in 'Guided' mode.
  2. By adding a hotspot with the action 'Continue', which is available in the dropdown list. That was the case for the screenshot above: it has a character hotspot (with attached audio) and a second Continue hotspot. One of the hotspot icons is clearly recognizable as a 'Play' icon.
  3. By showing the playbar (and maybe instruct the learner to click the Play button). Both commands 'Hide Playbar' and 'Show Playbar' are available to be triggered by a hotspot, but I was never able to use them using a hotspot in a slide. However you can show the playbar by default or use a slide event on a previous static slide.

As I explained in previous articles, the Timeline panel is also a Layers panel, defining the stack order of objects. In a 360 slides the stacking order is not always respected: even if you put a label on top of the stack, it will always be covered by any hotspot in the same location.

However for the hotspots it also has a third functionality, only for Guided mode. The stacking order will define the sequence in which the hotspots are presented to the user: starting from the bottom. In the example screenshot, at frame 45 hotspot 2 will be presented before hotspot 4.  You can change the order by switching the layers.

The dropdown list with actions to be triggered by the hotspots is more limited than for another interactive object. I already mentioned the command 'Continue' and its possible use. There are several navigation commands (previous, next slide, jump to slide and to last visited slide). There is the Exit and No Action commands which are self-explanatory. The most useful  commands are :

  • Display Image:  the image will be displayed for a duration specified in the Properties panel, Actions tab. You cannot choose an image in the Library, and once the image is imported it will not appear in the Images folder of the Library but in the Backround folder. Images folder only has the SVG icons of the used hotspots, whereas the SVG folder remains empty. Once the image has been displayed for the chosen duration,  the hotspot is converted to a visited state but remains active.  It is possible to click another hotspot before the duration of the first has ended. If you want all displayed assets to remain you have to choose a long duration for each of them.
  • Display Text: behaves the same way as Display image, you need to specify the duration. Very little formatting is possible, hence a suggestion in a previous blog post to replace Text b: y images with text in the wanted font and with controlled colors for the background. Hotspot will also have a visited state.
  • Play Audio: you can import a clip, or get it from the Library (they are stored in the Audio folder). No need to define a duration, once an audio clip is started it will continue playing unless you launch the command 'Stop Triggered Audio' from another hotspot.  If you have several hotspots using the Play Audio command and the learner clicks next hotspot before the first audio is finished, that first audio will automatically be stopped. That is the normal behavior of those audio clips as I explained in 'Pausing Timeline and Audio Clips'

360 Video slide

When you insert a 360 video in a 360 slide, it will end up in the correct folder 'Video' in the Library (under Media). I couldn't find a 'Find in Library' option. The video is represented the same way as a Video Demo slide or a FMR slide in a software simulation, it is merged into the background of the slide (mention for Usage in the Library uses also 'Background of slide).

Of course, the location of the playhead is now more important than for a 360 image. You can have an image where only the first frame is used to stack all the needed hotspots. However that makes no sense for a video, where movement is crucial. It will not be easy to create an engaging experience if the video has already audio embedded, because each hotspot will pause the video, which means also the embedded audio. Adding slide audio is possible the same as for a static 360 slide. However synchroniang will not be easy neither.  I need more exploration of this type of slides, but here are some first tips:

  • Try to offer audio only by using hotspots. I start the video with an inserted character that is set up to play audio, and have the video continue immediately after the audio is finished.
  • If you have only one hotspot in a frame, activate also the option 'Continue playing the project' whether you use Display Image/Text or Play Audio.
  • If you have more than one hotspot in the same location, and you use the Guided status, keep that setting only for the last hotspot to be presented. For the Explanatory status, you probably will need the playbar or a hotspot with the Continue command.

In the screenshot you see the video slide in its first frame. That frame has a character (selected) as hotspot which will play auio. The label indicates what the learner has to  do, but cannot be put on top of the character. When the audio is finished the video starts playing. It will pause again at 4.3 seconds which has two hotspots. The last hotspot has also Continue selected, status was here Guided.


Available Events in Adobe Captivate

Intro

Over 6 years ago I published a blog post explaining the importance of Events in the application. I also offered for free a table describing all the possible events. Meanwhile new features have been added, the User interface has changes. It is time to update that old post and table. You will be able to download the table at the end. It is a protected document, you can print it at a low resolution, but no permission for editing. You can find workarounds, but please I beg you to show some respect for my work.

When training/helping users to start with advanced or shared actions, I often detect that newbies are not aware of the process needed to trigger an (advanced/shared) action: each action, whether a simple, shared  or advanced has to be linked to an 'Event', and that is the subject of this article. 

Events - out of the box

Lot of events to trigger an action are linked with interactivity, requiring  the user to act. That  is the case for Success/Last Attempt  events for (Shape) Buttons, Click Boxes, Text Entry boxes, interactive Learning interactions, Drag&Drop but also for Question/Knowledge Check slides. 

Less known are the actions that can be triggered when a Quiz is completed (Passed/Failed).

In that older blog post I mentioned the  Rollover slidelet which had  two events: on Rollover, and on Click. Since that object is no longer supported for HTML5 output, I took it out of the table. 

Object actions can be triggered by each drag event in a Drag&Drop slide and offer a lot of possibilities. Have a look at all the posts I published about Drag&Drop

Ignored by most users are the Hyperlink events. Such an event is not limited to 'hyperlink', but can trigger all sorts of actions, including Advanced actions. Find a example here.

Events that are not linked with interactivity are the slide events: when entering or when exiting a slide, you can have a simple, advanced or shared action to be executed. Have a look at the table to see possible limitations.

Often I get the question if an action can be triggered by time or by a frame. Not possible out of the box, but with micro-navigation, eventually the Delay Next actions command and/or the Timer/Hourglass interaction this limitation can be overridden. 

Overlay slides in Interactive Video, both the content and KC slides have similare events to those in a normal project. However the events for the hotspots in a VR project or 360 image/video are more limited as are the overlay Quiz slides in a VR project.

Widget to extend events

InfoSemantics developed a HTML5 widget that is one of my favourites: the CpExtra Widget. Adding events to objects is only one of its multiple features. It is not free but if you are plunging really into advanced/shared  actions, please try it out because it can add as many events as you want to any object. A trial version is available.

InfoSemantics used to have a SWF widget (EventHandler), worked great, but with the EOL of Flash player for all browsers, not so useful anymore.

List

You can download the list from this link

First column (Event) identifies the event, second column (Assign action) shows in which Properties panel (PI) you can indicate the action to be triggered, third column is A Description. When necessary you’ll find some comment/use cases in the last column, which also mentions the possible limitations for the event. 

There are two  tables. First table shows events able to  trigger only one simple, shared or advanced action/ The second smaller table summarizes the events which can trigger one out of two possible actions based on a condition: validated TEB, question slides, scored Drag&Drop slides  and Quiz.

I would appreciate if you left some comment in case you find this list useful. If you find this list useful, I could offer some other tables as well.

Tips and Tricks for VR projects.

Intro

The ability to embed 360 images/video in an eLearning course is an enhancement (CP2019) which can be used in a lot of eLearning courses. As a civil engineer I think about the organisation of a construction site, detection of lack of safety in a building etc. The most recent release of Captivate allows to use those assets in two different type of projects: either a full VR project, or on individual slides in a normal cptx project.  You will have to use a normal (blank) project, as far as I know it is not possible in a responsive project with fluid boxes.

A VR project will be created right from the welcome screen. It can only have slides with a 360 Image or Video. All other Slide types except 360 slide are dimmed under the big button Slides, and the menu Insert is completely dimmed. You can add hotspots to trigger several possible actions,to the 360 slides, and overlay Question slides (not KC slides) where two types are possible: T/F and MCQ). The score slide is available but will not show up as overlay for the 360 slide, you’ll have to define a background slide for it.  I will offer some tips for the overlay Quiz slides, and for the Quiz Preferences.

If you use a 360 slide in a normal (blank) cptx-project (tp be inserted from the big button Slides), you’ll have the same hotspot functionality but will not be able to have overlay question slides. However you can use normal quiz slides and KC slides in the project. You’ll find more information about 260 slides in a future blog post.

In this article I will only talk about VR Projects using 360 Image slides. You can use multiple slides of that type, also 360 video slides, but no static slides.

VR project

Overlay Quiz slides – tips

Quiz Preferences

Quiz Preferences are available for the graded Overlay Quiz slides. But lot of the options are dimmed. Reporting setup is the same as in any other project with a quiz. In Settings options are limited to:

  • add the Clear button
  • add the Review navigation buttons if Review is allowed for the learner
  • hide or show the Score slide
  • allow Review

As usual for all Quizzes in Captivate, I strongly recommend to keep the Required field set to the default ‘Optional’ to avoid problems. You have same control over Quiz Result Messages and Quiz Review Messages as in any other quiz.

In Pass or Fail you can set the passing score (in % or points). But for the number of attempts on quiz level, you have only th choice between 1 or Infinite Attempts. In the last case you should activate the Retake button on the Score slide. There are no actions possible for Passing or Failing grade. No advanced actions are possible in a VR project, not only here for the Quiz, but also for the hotspots, for the On Enter events of any slide.

Default Labels are stripped out as you can see in this screenshot. It is impossible to change a style, only the Feedback messages, Clear and Submit button labels are available:

Styling the Quiz and Score slides

In a VR project, Themes are not available. Moreover the Object Style Manager cannot be used (as you did see in Quiz Preferences, Default Labels).  That seems to be a show stopper if you want to implement the font and colors that are part of your company’s default styles. However it is possible, manually,  to change the font and other features of the different text containers on quiz and score slides. You can even use Typekit fonts. It is of course more work than just applying another style, which is a pity. Maybe launch a feature request?

Score slide

Since the score slide needs a background slide, I tried to add slide audio to that background slide. However that audio played, but only for 1,5sec. As usual the pausing point for the sore slide (as for quiz slides) was set at 1,5secs.  You can move that pausing point and increase the length of the slide. But I did not succeed to make the audio play in combination with the score slide showing up.

Hotspots and actions

A hotspot is similar to a click box, but without a duration. It shows in the Timeline up as a brown circle. If you just add a number of hotspots without touching the timeline, they will all show up on the first frame of the slide, which means they’ll all be available to the learner at the same time, when in ‘Exploratory’ mode. If you prefer to use the ‘Guided’ mode, the sequence used to show a hotspot is following the stacking order: bottom hotspot shows up first, top hotspot last:

You can also scatter the hotspots over the timeline. But I will dedicate a separate article to the timelines of the 360 image and video slides in a near future:

Possible actions triggered by clicking hotspots are limited:

  • Show/Hide Playbar
  • Navigation commands: Go to Previous Slide, Go to Next Slide, Jump to Slide, Go to Last Visited Slide
  • No Action, Continue, Exit
  • Play Audio/Stop Triggered Audio.  There are more ways to have audio playing in a VR project:
    • You can add slide audio.  There is no way to pause that slide audio however with a custom action triggered by a hotspot (Pause is lacking in the commands). The only way to pause or mute the audio is with a playbar that has the appropriate buttons.
    • Hotspot audio: you can add audio to a hotspot like with any object. Be aware of the fact that this audio will play when the object becomes visible. This means that if the hotspots are all in the first frame, all audio clips start playing immediately (maybe even parallel with slide audio). If you scatter the hotspots, this is a way to combine a Display Text or Image command with audio. More info later in an article about the Timeline of a 360 Slide.
    • I mentioned above that adding
  • Display Text: the text will always be in Times New Roman, no way to change the style at all. The only possible workaround I see at this moment is to create an image with text in the appropriate font, size and color. Beware: you need to have a background for the text, or it will not show up. You also have to take care of eventual have a lower opacity, which means you will be limited to PNG  images, because JPEG doesn’t support transparency. Here is an example of a simple text image which I created in Word (text box, not simple text), captured with Snagit and lowered the opacity to 80% (this is not visible here, but shows well up in the VR project.:
  • Display Image: can also be combined with audio as explained before, and is probably the most versatile way of adding information. I mostly use it also for Text display?

Zooming?

The question has appeared a couple of times in the forums. It is not possible to zoom in on the 360 image, hoping this will make it in a future release. At this moment, a possible workaround is to take a 2D enlarged image and insert it on a hotspot that displays that image. Not the real stuff of course. I used it to display a full shot of my kitchen appliances in a 3D image of my kitchen.

Interactive Video, Navigation Bookmarks

Intro

Interactive Video is without any doubt my favourite new feature in Captivate 2019. It makes adding some interactivity to a passive video very easy compared with the old workflows which I used to simulate such an interactive video in previous versions. I had in mind to blog about some possible workflows that could add even more functionality. A user posted a question today about Bookmarking for Navigation. I had already some workflows in mind, and want to share one of them with you. I tried it out on the sample project provided with Captivate. That project has only two bookmarks, which are labeled 'ExerciseBenefits' and 'O3Jump'. the workflow can easily be extended to more bookmarkst. We'll create a shape button to pop up a menu. 

Popup menu

To create the menu, which is hidden when the video starts, I used a shape,  but you can use a text caption as well. I filled that shape with one word for each of the bookmarks. In this case I used the words 'First ' and 'Second'. Those words will be indicated as hyperlinks. Hyperlinks have a lot more functionality than just pointing to an URL, as I explained in some blog posts.

Close button

Dropdown menu

The menu for hyperlinks is missing some options (which I regret): you will not see the option 'Jump to Bookmark' nor 'Execute Shared Action'. My only choice was to use the command 'Execute Advanced Actions'.  That means that you have to create as many advanced actions as you have bookmarks. They are very simple oneliners, but with a simple action or a shared action it would be a better workflow.  It is also impossible to prevent release of the playhead, but that is not really an issue in this case since we are creating navigation actions, and the video may continue to play when it gets to the chosen bookmark.

The shape with the hyperlinked texts needs to be invisible in output, and timed for the rest of the slide. If you have multiple video slides, and you want one menu for all videos,  time it for the rest of the project. Because the overlays are possible, you'll not have any problem to have the shape being visible on top of the video.

Menu Button

The menu button (which you could see in the screenshot with the popup shape) is a shape button. I added a custom state 'Close' to the 3 InBuilt states, where the label is changed from Menu to Close. To avoid confusion I took out the label from the Rollover and Down state which are used both for the open and closed version of the button:

The button is a toggle button, to track the visibility of the popup shape I needed a user variable (Boolean) which I labeled v_visib as usual. Default value = 0, which means the popup shape is closed and the Normal state of the button is active. When the button is clicked to open the popup, the state will change to Close, and the variable will be toggled. This leads to a conditional action which I have described/used already many times:


Conclusion

I hope you liked this workflow which is not included by default. You can add this toggle button to other buttons like an Audio/Mute and a CC button. If you missed it, you can find a workflow for that type of buttons in this blog post:.



Answer key for Survey

Intro

Once in a while a question like in this thread pops up:

“….students will need to answer short answer questions.  They will not be right or wrong, they will be their thoughts.  Is there a way to have all their answers compile into a final screen at the end?”

It seems logical to use short answer quiz slides, in Survey mode, for this use case. However I prefer to use one of the Learning Interactions, ‘Scolling Text’ for reasons I want to explain in this article, by describing both workflows with their specificities. It is up to you to decide which you’ll use. In both workflows variables will be important, hope you are familiar with them.

Short Answer quiz slides, Survey mode

Setup quiz slides

No right/wrong answer means that scoring has no sense, change the stqtus of the quiz slide to ‘Survey’. Nevertheless a score slide will be inserted but you can hide it easily.

Answers to quiz slides are stored in a reusable variable, cpQuizInfoAnswerChoice.After a short answer question the variable will contain the text typed in by the learner in the short answer field. Reusable means that the value will change after each short answer slide. Since we need to store each answer safely (for reusing on the slide at the end), you will need:

  • to create a user variable for each short answer question; I will label them v_First, v_Second, v_Third for the example you’ll see in the demo movie;
  • the default answer area is pretty small (one line), if you expect longer answers, make sure to increase the height of the answer area. It is not possible to edit the used master slide because it applies to multiple types of quiz slides;
  • the content of the system variable cpQuizInfoAnswerChoice is updated when the Submit button is clicked; it has to be transferred to the appropriate user variable, using the After Survey event; for that purpose I created a shared action with two commands:
    Assign v_First with cpQuizInfoAnswerChoice
    Go to Next Slide
    only parameter is the user variable (here v_First)
  • apply this shared action to each of the question slides, with the appropriate parameter.

Setup Answer Review slide

In the example movie I created one text container (shape or caption) and inserted the three user variables in it. Be careful to increase the number of characters to be shown when inserting the variables. You’ll also have to leave enough space for each variable. Of course you could create multiple text containers and/or have the answers distributed over multiple slides.

Using Scrolling Text interactions

A limitation of Short Answer quiz slide is that you can have only one answer per slide. When using a Scrolling Text interaction you can have several question on a slide as you can see in the example movie.

Setup interaction

Setup of the first answer box can be seen in this screenshot:

Two important items are indicated  in the screenshot:

  1. You have to type in the name of the variable to be used. There is no way to use a dropdown list. Beware: you have to create the variable, it is not created uatomatically.
  2. To allow text to be typed in by the user, the checkbox ‘ReadOnly’ has to be unchecked. By default it is checked.

It would have been possible to enter the question in the interaction, instead of having it in a separate text container. I preferred not to do it. Reason: if the user adds the answer, instead of overwriting the question, the variable will contain html tags, like <br>.

The Submit button, which you’ll see on the slide, triggers  the (default) action ‘Go to Next Slide’.

Since I reused the three user variables in this part of the example, I have created an advanced action triggered on Enter to empty the user variables with the technique described in this article.:

Setup Answer Review slide

Very easy: duplicate the slide with the interactions, and take out the On Enter action to reset the variables. The interactions are now populated with the given answers. Moreover the learner can still edit those answers, because of the option ‘ReadOnly’ being unchecked. If you don’t want it, check the option ‘ReadOnly’ on this duplicate slide.

It is also possible to use a similar slide for the first workflow with short answer quiz slides. That will be useful if you want indeed to allow editing the answers.

Example movie


Rare Tips for Shared Actions

Intro

It is not a secret that I am a big fan of Shared Actions. A project without at least one shared action is a big exception to me. From what I hear and read, lot of you don't realize how much time you can save with those mysterious action. This short article will offer some ideas where Shared Actions are used for (maybe) a totally different situation than you expect.

1. Creation of Variables

If you are reading this post, it is very likely that you use system variables as well as user variables. Do you create user variables in each project, and include a proper description and eventually default values?  I have a list of variables which I use very often in projects, here are some examples:

  • v_null: an empty variable used to check if Text Entry Boxes remained empty after a learner clicked its Submit button, or to reset the variable associated with a TEB.
  • v_counter: as the name tells to track a number of clicks, attempts....
  • v_visit: for situations where the content of a slide has to be different on a later visit, you want to track if the slide has been visited
  • v_one, v_two, v_three....: number of variables that can be used for different use cases, like tracking clicks on hotspots, finishing chapters...

Knowledge fact: when you import a shared action in another project, variables not defined as parameters, will be created including the description and default value.

I have a shared action with a list of Assign commands, one for each of those often used variables. It doesn't matter what you assign at all. I drag that shared action from my external Library with shared actions to each new project. Variables are ready for use, even as parameters in other shared actions. 

  

2. Shared Action without Parameters

Sounds very strange, because the reusability of a shared action is based on parameters? I already gave a first example of such a parameter-less SA under 1.  It is much safer and easier to transfer a shared action to another project than an advanced action. You use the shared action directly or convert it to an advanced action if you prefer (maybe for more editing). Here is an example:

 I use this action to calculate the reference time in seconds (to be used later in calculations) of a frame, mostly the first or last frame of a slide. Defined as a shared action, it needs no parameters. Once dropped into the project Library, I can use it for any frames where I want a reference time.

3. Shared Action as Template 

You can copy an object or a slide, which has advanced actions attached to a new project. But that is not always working great. If you have navigation in the advanced action 'Jump to Slide', that command will often be reset to 'Continue' if that slide is not found. Same for objects, variables etc. 

Less known is that any shared action can be used as a template to create an advanced action. In the top left of the Advanced Actions dialog box, you are used to see 'Blank' which is the default template for an action. Open the dropdown list, and you'll find all shared actions in the project as extra templates:

Choose one of them, you'll have to fill in the parameters, add a name, edit the commands (delete, add as you want) and save as an advanced action. 

Example: a shared action triggered On Enter for a dashboard, checking a number of tracking variables and showing something special after all variables prove that everything has been visited. You can set up the shared action for 4 variables. If you need less or more variables, convert the action to an advanced action and edit it!

What about you?

Do you use shared actions? Did you like these tips? Do you want to have some training about variables/advanced/shared actions?  I love seeing comments on my posts, and promised: you will always get an answer!


Rollover in Fluid Boxes?

Intro

One of the type of objects that is indicated by the tracker as not compatible with HTML output are rollovers: rollover caption, rollover image, rollover slidelet, rollover shape. However if you ignore that warning for a non-responsive project, the rolloverrs will work fine when used with a mouse on a desktop or laptop screen (with the exception or the slidelet, which you should avoid at all times). Its functionality will not work on a mobile device, even not when using a stylus. But the 'mouse' users have that functionality.

However when you create a responsive project using Fluid Boxes, the options for inserting a rollover are greyed out. There is no way to add them. Is there a workaround to have rollovers for desktop/laptop users? That question appears once in a while in forums or social medai. In this post I will talk about my tentavies to mimick a rollover..

Example Movie

I cannot insert a responsive movie in a blog post. Use this link to have access to it. Try it out on a laptop or desktop screen: roll over the buttons in the left and in the right most Fluid box. You'll see rollovers for the big Blue buttons which do not have a real button functionality. The red buttons on the right are active, a hint message appears when rolling over the buttons. You can click those red buttons. This is a static screenshot of that slide (which appears after the poster image and the first slide):

If you try this on a tablet or a smartphone, rollovers will not appear. I tested on iPad and on an Android (HTC) phone.

First Mimick: Hint Messages

You did see the Hint messages for the red buttons when hovering over them. If you use a tablet or a phone they will not show up. Those buttons have the InBuilt States 'Rollover' and 'Down', but only the Down state will be visible on those mobile devices. This is the Object state panel for the second button:

For interactive objects it is possible to check the option 'Hint message' in the Actions tab. In all themes included with Captivate those messages are no longer in a caption but in a shape. The hint message appears wh

There are some problems with this solution:

  • Buttons and Hint messages will share the real estate in the (normal) Fluid Box.
    That is a waste of space especially for mobile screens where those hints never appear. and the buttons may shrink too much as you can see here:
  • I tried to use a static fluid box for each button+hint to be able to stack the Hint message over the button but that leads to very ugly flickering and is excluded.
  • You don't have control over the exact size of the buttons, and certainly not over the HInt messages (look at the screenshots above). This may be not so important since you'll only watch on a big screen, but nevertheless.

Second Mimick: Rollover State

With the blue shape buttons I demonstrated that you can fill the Rollover state with Text (mimicking a rollover caption), with an image (mimicking a Rollover Image) and with both. Here is a screenshot of the second shape button, having an image and text:

The effect is quite nice, provided you use rather big shape buttons as was the case here:

There is a possible problem when using images: they can be distorted if the option 'Maintain Aspect ratio' is unchecked. That was the case in the example, and can lead to distortion:

Shared Action for Red buttons

The active red buttons trigger a shared action which will change the state of a shape (showing explanations), add a star to a progress indicator and have it animated. If you have read blog posts written by me, you know that I am a big fan of Shared Actions.


Tips to localize a quiz

Intro

This article will not be interesting for you if you always create courses in the same language, and you have Captivate in that same language. In my casen Captivate is not released in a Dutch versoin, and moreover I sometimes also need to create French courses, along with English courses. Practical tips to save time when localising are always welcoem. Today i will focus on Quizzes. I have an English version of Captivate but want to create a quiz in Ducht and in French. What is the work flow?

Quiz Preferences

Start by localising Default Labels  in the Quiz Preferences. That dialog box allowas you to translate messages and labels on buttons. You don't have to trabslate labels that you'll never use. As you can see in this screenshot, I never use Skip/Back, Submit All nor the Timing message. 

After savibg the Preferences, usie File, Export, Preferences. You can import them later on in any project where you need the same language for a Quiz.

Master slides

The changes you made to the labels are not relected in the quizzing master slides, which is a pity. It can be necessary to increase the width of the buttons if the new labels are considerably longer than the original ones. I will not bother about that now, nor about editing any of the texts, like "True" and "False" which need translation. The embedded object 'QUestion title' is a placeholder, will be replaced by the questiob type on quiz slides, you cannot even edit it if you want those indicators translated. All can be done with:

For the score slide, you have to edit the master slide if you want the field labels to be localized.  Those labels are not included in Quiz Preferences which is too bad. As master slides are part of the theme you can include them in a custom theme. It would be great if the labels translated in Quiz Preferences were included as well, but that is not the case.

GIFT text

Several versions ago the possibility to import a GIFT file to create quiz slides was introduced. That is not only a great way to import lot of questions, but also to localise the questions. I include a txt file created with the GIFT rules, to allow you to try out this feature (and to learn some Dutch ).  Here is an example of a question, MCQ with multiple corect answers and partial scoring:

// === Multiple Choice MA ===
::Meerkeuzevraag (meerdere correcte antwoorden) ::
Welke componenten maken deel uit van een thema?
{
~Aangepaste Effecten
~%30%Master Slides
~%40%Objectstijlen
~Taal met spellingcontrole
~%30%Kleurenpalet
}


After importing the GIFT from Quiz menu, the rhird question shown above, looks like this:

Watch how the Question title placeholder now has a Dutch text. The feedback messages are translated as are the labels on the used buttons: 'Submit' became 'Indienen' en 'Clear' is now labeled 'Wissen'. The tiny progress indicator is translated as well. You may have to check the score, because the partial scoring will have rounded numbers. In this case it is not necessary: 3 points go to the second and fifth answer, 4 points to the third answer. 

Final edit T/F slides

Something cannot be done automatically, which is the translation of the words ‘True” and “False” on that type of slides. For that finishing touch, which can only be done after inserting the Quiz slides, I use the Find and Replace functionality. 



 

Quiz Slides with Fluid Boxes

Goal

Today this question appeared on the forums:  "Easy way to give better feedback in Fluid boxes in the Quiz"

So for the second time in a couple of days a blog post based on such a question. If you missed my workflow to tweak Feedback messages for Drag&Drop, here is the link.

That question is related with a blog post I have been writing about the setup of Fluid Boxes in Quizzing Master slides. If you have read that post, it explained that all feedback messages on those master slides are stacked on top of each other, and for that reason that Fluid Box needed to be converted to a Static Fluid Box. I didn't mention in that post the workflow I am using to create individual feedback messages on the quiz slides which is the purpose of this short article. You can see it as a add-on for the article about fluid boxes in Quizzing master slides, and maybe also show some features of that static Fluid Box, which are not very well documented but which I discovered when trying to find the easiest workflow.

Workflow

Before starting the work flow described below, check the quizzing master slide. Make sure the used styles for the messages are correct and that all the message containers have the same size and are aligned. For the packaged themes that is not always the case.

You have to know that it is NOT necessary to unlock an object from a static fluid box before moving it! That is only the case for the normal, non-static fluid boxes. In static fluid boxes the objects are not glued to the fluid box in the same level. You can even move them out of the fluid box.

Remember: if you screw up something when trying out the workflow, you can always return to the normal situation by clicking the button 'Reset Master Slide' in the Properties panel of the slide.

Step 1

Select the top message. In the default stacking order it will be the Success message. Edit the text. If you are seeing the text of the other images below, check the opacity of the fill, and increase it. 
After editing keep the message selected and move it out of the way. I mostly use the shortcut key CTRL-UP in this case. With each use of that shortcut the message will move up 16px (which is the default size in the grid). Be careful: the message will be over the fluid box containing the answer area. It will not snap to that fluid box, but you'll not be able to select it anymore. That doesn't matter.

In the used theme shape for this message had an Opacity = 0. I changed it to 80% to be able to read and edit the text. No need to  reset the style, will be done in the last step.

Step 2

Edit the next message, in default setting it will be the Incorrect message. 

Step....

If you have more messages, move the second message up, edit the third etc..

Last Step

Pretty easy: reset the master slide as shown in the first screenshot.

Conclusion

It remain a cumbersome workflow, but at least you don't have to unlock from the fluid box as many tell, nor getting them back into the fluid box. If you looked at the thread you see those unnecessary steps mentioned by the Adobe chat and another user. Probably misunderstanding the differences between static and normal fluid boxes. It is still a new workflow, Fluid Boxes, and really quite different from designing a non-responsive project or even a responsive project with Breakpoints.

 

D&D Feedback messages

Intro

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

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

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

I asked for some details about the setup: 

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

Drag&Drop confusions

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

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

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

Workflow for  messages

User wanted to see a different message popping up:

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

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

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

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

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

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

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