In this video, I show you how you can create additional copies of slides that contain variables and advanced actions without fear that the new slide will point to the wrong scripts and variables.
Main master slide, Blank and Title master slides
Main Master slide
However after some more testing on iOS devices, the Position properties set up for those objects are not correctly displayed in portrait mode.
TIP: at this moment avoid putting objects on the Main master slide (except background of course), since they don’t display at the correct location on some mobile devices.
Blank Master slide
Title Master slide
That master slide has one Fluid box (parent fluid box) but no child fluid boxes. It is set up as ‘Squeeze in a Column’, and vertically and horizontally centered. Since the Title Placeholder is inserted directly in this Parent Fluid Box, you are not able to add child fluid boxes. Because each new project, using the default theme White will start automatically with a Title slide, this has caused already many frustrations when starting with the use of Fluid boxes. If you want to use fluid boxes on the first slide, you have to change the master slide from Title to Blank (exception Blank theme which starts with a Blank slide).
TIP: if you want to add objects on the Title master slide, first take out the Title Placeholder, to be able to insert child fluid boxes. Then put back the Title Placeholder in one of the child fluid boxes.
Content master slides
Look at the setup of the Fluid boxes on the master slide: the parent fluid box (FB_15) has two vertcial child FB’s (FB_16 and FB_17). The top one is meant for the Title placeholder:
The bottom Fluid Box has 4 child FB’s, (FB_19,FB_20, FB_21, FB_22), which are set up to wrap Symmetrically (when width is too small, two FB’s will move to the next row), and have a padding both vertically and horizontally to have some spacing between the FB’s. Each of them has a placeholder for an image.
Play with this responsive movie (will open in a new window) which has only 3 slides: Title slide (with inserted Next button, and taking over my name from the main master slide), a slide based on Content04 master slide, with a lot of tweaking, and an End slide. On the content slide you are supposed to click each of the 4 buttons in the top. The Next button on that slide will only appear when you have clicked all available shape buttons and seen all the content.
Refining slide based on Content master slide
- I deleted the image placeholders
- I decreased the height of the top fluid box (FB_MS2_16) to 10%, originally it was 15% (edited font style as well)
- I added a third vertical child FB under the parent FB_MS2_15, it is labeled FB_9
TIP: changes like this will not affect the master slide. You can get the original layout from the master slide back by using the ” Reset Master Slide” button in the Properties panel of the slide.
- That last FB_9 got two horizontal FB’s, FB_37 (70% of the width) and FB_38 (30% of the width); the last one will be used for the navigation buttons (Back/Next)
- The setup for FB_38 is visible in this screenshot
- Each of the four FB’s in the center (FB_19,FB_20, FB_21, FB_22) has no longer any object (see 1) and can be divided in two new vertical child FB’s
- As you can see on the screenshot, the top FB will have a shape button and explanation text (originally hidden, but cannot be grouped in FB’s what would make the advanced actions a lot easier), the bottom one has an example of the style of that state in a shape (also initially hidden).
- Setup for the top FB’s here is visible in this screenshot; for the Shape button (‘Normal’) the option Maintain Aspect Ratio is kept, but not for the Text container, so that it can change for smaller screen sizes (especially in portrait mode).
Sure, I have several advanced actions in that movie, but that was not the goal of this post. No explanations here about those actions.
With Captivate 9 multistate objects was one of the most welcome new features. In previous versions only buttons and shape buttons had states like ‘Rollover’ (hover) and ‘Down’. Interactive objects like buttons/shape buttons have InBuilt States: ‘Normal’, ‘Rollover’, Down and with Captivate 2017 a fourth InBuilt state was added: ‘Visited’. For all objects, static or interactive, you can create custom states..
Less known is the presence of InBuilt states for all objects in a Drag&Drop slide, both for drag sources and for drop targets. Custom states can be added as well. Both InBuilt states and custom states have some limitations similar to the Inbuilt states for buttons. Drag&Drop objects have also limitations for extra custom states.
- The first use case has only two drag sources, one of them being correct, the other incorrect. There is one drop target, the cup. Watch the different InBuilt states both for the two drag sources which have identical InBuilt states and for the drop target. All objects also have one extra custom state. Because of my manipulation of the states on Submit, the default Reset button will not return you to a fresh start if you have used the Submit button. You’ll have to use the custom ‘My Reset’ button in that case.
- In the second use case you’ll see 7 drag sources and 2 target objects: the box and the trashcan. You are supposed to drag all sources to the appropriate target. You’ll find the ‘My Reset’ button here as well.
Drag Sources: states
- Normal state (InBuilt): is the Default state. This state will appear before dragging, and will re-appear if a drag source is sent back to its original position as well (for an incorrect object). The size of this state is important, because several states are locked to the same size. You can rotate the Normal state (watch the rotate handle at the top), which will also lock some of the states to the same rotation.
- Dragover state (InBuilt): this state appears when the drag source is over a drop target and will remain so until the object is dropped on or moved away from the target. This state is not locked, it can be resized and rotated.
- DropAccept state (InBuilt): will appear after dropping a drag source on the drop target, it will replace the Dragover state and become permanent. It is totally locked (watch the lock symbol bottom right): will keep the same size as the Normal state, cannot be rotated. Be careful: if you allow all drag sources, both correct and incorrect, to be dropped on the target, the DropAccept state will also appear for correct and incorrect objects! If you only allow the correct drag sources to be dropped, this state will only appear for them.
- DropReject state (InBuilt): will appear after dropping an incorrect drag source on the drop target if the target is not set to allow All objects to be dropped. It will replace the Dragover state. When the incorrect object is sent back to its original position, the DropReject state is replaced by the Normal state. Like the DropAccept state this state is totally locked: no resizing, no rotation possible
- DragStart state (InBuilt): this state appears when you start the dragging movement until you are over a drop target, where it will be replaced by the DragOver state. The state is not locked, it can be resized and rotated.
- Custom state: this state is also fully locked to the rotation and size of the Normal state. As written before, you cannot even add objects in this state (which is possible for buttons). That is a limitation, in many cases you’ll want to revert to the old method of hide/show objects. For this example it seems as if I added the image of the wings, but I’m just cheating: for all states I used smart shapes. That way I was able to change the form of the shape (Replace shape), to change its fill and stroke. For the InBuilt states I used gradients or solid colors as Fill, for this custom state I used Image Fill. Since a shape can also be used as Text container, it was possible to change the labels of the states as well. If you are not yet member of the Smartshape fan-club, maybe…
Drop Targets: states
The Drop Targets have 6 InBuilt States (see slide 3 in movie). Three of those states have a name that is identical to an existing state for the drag sources: DragOver, DropAccept and DropReject. For Drop Targets you can add objects to all states, both InBuilt and custom states. Some states appear immediately, other states only appear after Submitting the exercise. Here is the overview, again with a visual reminder from the first use case in the example movie.
- Normal state (InBuilt): is the Default state. This state will be the main state before the Submit button is clicked. It can be replaced by another state but that will only be for a short duration. The size of this state is important, because several states are locked to the same size. You can rotate the Normal state, which will also lock some of the states to the same rotation.
- Dragover state (InBuilt): this state appears when a drag source is over the drop target and will remain so until the object is dropped on or moved away from the target. This state is not locked, it can be resized and rotated.
- DropAccept state (InBuilt): will appear after dropping a drag source on the drop target, it will replace the Dragover state. However this state will remain visible only for a short duration. Then the Normal state will re-appear. The reason is that a drop target can accept multiple drag sources, and has to be ready to ‘accept’ or ‘reject’ the next drag source. It is totally locked: will keep the same size as the Normal state, cannot be rotated. But, as told, you can add objects, which was the case in the example movie (adding the wings).
- DropReject state (InBuilt): will appear after dropping an incorrect drag source on the drop target if the target is not set to allow All objects to be dropped. It will replace the Dragover state. The state will appear for a short duration before reverting to the Normal state. State is It is totally locked: will keep the same size as the Normal state, cannot be rotated. But, as told, you can add objects, which was the case in the example movie (adding the wings).
- DropCorrect state (InBuilt): this state will appear after Submit if the drag source(s) dropped on the target are all correct. It will replace the Normal state permanently. The state is fully locked (to the Normal state): no rotation nor resizing is allowed. You can add objects.
- DropIncorrect state (InBuilt): this state will appear after Submit if the drag source(s) dropped on the target are not all correct. It will replace the Normal state permanently. The state is fully locked (to the Normal state): no rotation nor resizing is allowed. You can add objects.
- Custom state: this state is also fully locked to the rotation and size of the Normal state which is limiting even though you can add objects.
Reset – My Reset
Setup Use Case 1
The advanced action SuccessDD4 has three commands:
- Change State of Target1 to AfterDD
- Hide Gr_Draggers
- Continue to release the playhead
Due to hiding the drag sources with this Success event, the On Enter action of the slide has to ‘reset’ the situation by showing the group Gr_Draggers again. This was combined with the assignment of the user variable v_enter for this slide in the action:
- Assign v_enter with cpInfoCurrentFrame for the Replay action
- Show Gr_Draggers
Use Case 2 ?
I hope you can figure out the setup of this slide. This article is a refurbished version of an older article which I wrote for Captivate 9. Feel free to visit that original post. This second use case has been modified: I edited the SVG’s by roundtripping with Adobe Illustrator, and the surprise at the end is no longer a Xmas surprise.
My plans are to upgrade important older blog posts to CP2017 and HTML5 output. At least if you let me know if this would be appreciated
In this video, I demonstrate how you can use a text entry box to capture a bunch of text from your users and then display it back to them on a later slide without any display difficulties.
I wanted to let my friends on the Adobe eLearning Community know that I’ve posted my first premium tutorial on Adobe Captivate 2017 through Udemy. In this course, you will learn how to…
- create a responsive design interface for your question slides in Adobe Captivate 2017 using fluid boxes
- setup variables to keep track of the selections made by the users of your eLearning course
- write advanced actions that will form the basis of the interaction for your users
- write conditional actions that will validate if your user has submitted the correct answers to your questions
- convert your questions to become scored final quiz questions
The regular price for this course is $50 USD, however, If you are willing to provide me feedback on this first course I would like to offer the first 20 Adobe eLearning Community members a $25 USD discount by using the link for the coupon below:
Slide setup – preparations
- v_counter: starts with a value=0 and will be used in the condition for the While loop to fix the number of repetitions to match the random number in v_dice
- v_stair: is a second counter, that will be used to keep track of the total number of steps done. It is needed to know when top is reached. The staircase has 16 steps. It also starts with a value=0.
- v_null: empty variable (see…) used to reset the v_dice variable after each use of the Play button
- v_roll: starts with a value=0, will track the number of dice rolls needed to complete the steps; that number appears after the top of the stairs is reached. It is a third counter.
- v_anim is used to store a random delay used for the On Enter animation.
Events and actions
- Success event of the Play button, it will trigger an advanced action PlayAct
- Success event of the Click box (Reset) it will trigger the advanced action ResetAct
- On Enter event of the Game slide, which triggers the animations: EnterGame
ResetAct triggered by Click Box
PlayAct triggered by Play Button
Decision 1 ‘Random’ (standard action)
Decision 2 ‘EndCheck’ (conditional IF action)
This decision checks if the character has reached the top by comparing the user variable v_stair with the total number of steps (16). Contrary to v_counter, v_stair is only reset to 0 when re-entering the Game slide (using ResetAct).
The Play button is hidden (to avoid disturbing the rest of the sequence) and the static multistate dice.
The original character disappears, is replaced by a group (character + click box + text balloon) with some default effects.
If the condition is not fulfilled (ELSE), which means the top has not yet been reached, the variable v_roll is incremented by 1.
Decision 3 ‘ShowNumber’ (While loop)
- The number of steps taken by the image cannot go beyond the random number stored in v_dice (see first decision) and
- The total number of steps done, stored in v_stair, cannot be greater than 16, number of steps in this staircase.
The commands to be done while that AND combination results in True are:
- Switching the static dice to the next state (see image of the Object states for this static dice above)
- Character gets on the next step (using custom effect StepUp, but that name has been changed by Captivate to the name of the effect it was based on ‘RightToLeft’.
- The variable v_counter is incremented, it is this variable which is used in the first condition
- The variable v_stair is incremented; that variable is not reset by clicking on the Play button, is necessary to check if the top is reached (decision 2 ‘EndCheck’).
EnterGame triggered by the On Enter event
Here is the Preview, let me know if you need more details
Fire away. Creating this game was a lot of fun, ‘while‘ exploring ‘while‘ loops. Let your creative juices surge!