Drop area is one of the interaction objects in ActivePresenter 9. This object is useful in creating drag-and-drop interactions. Learn more in this tutorial.
A drop area is a special drop target that can evaluate, score, and record users’ answers when they drag and drop an object onto it. Unlike a normal drop target in Drag-n-Drop questions that can hold multiple drag sources at the same time, a drop area can only hold one at a time. If you drag and drop another drag source onto a drop area that already has a drag source, the new drag source will replace the old one and the old one will return to its original position.
This article covers:
- Insert a drop area
- Convert objects to drag sources
- Set accept values to correct values for drop area
- Set drop area properties
- Set scores and report
- Add and customize feedback messages
- Add events – actions
Insert Drop Areas
To insert a drop area object, do either of the following ways:
- Open the Insert tab > Drop Area.
- Open the Home tab > Interactions > Drop Area.
By default, a drop area object consists of five components, including:
- (1) a drop area (with red dashed line): Each drop area object can have multiple drag sources but has only one drop area.
- (2) a drag source (with green dashed line): This is the default drag source. You can add more drag sources as you wish. See the next section to know more.
- (3) a drag-n-drop connector (an orange arrow): This connector denotes that dropping a drag source into a drop area is a correct action. This connector and the dashed lines will not appear in the output. However, you can hide or show them in the Canvas by clicking on the Drag-n-Drop button in the View tab.
- (4) a Correct Message: A Correct Message will appear when users drag a correct drag source into a drop area.
- (5) an Incorrect Message: An Incorrect Message will appear when users drag a wrong drag source into a drop area.
Convert Objects into Drag Sources
ActivePresenter 9 allows you to add more drag sources as you want by converting objects such as shapes, images, etc. Perform the steps below to have it done:
Step 1: Select one or multiple objects > navigate to the Properties pane > Interactivity tab > Drag-n-Drop > select Drag Source (6):
Step 2: Select one effect from the Effect list (7):
- None: No effect happens when users drag a drag source.
- Zoom: The drag source will be zoomed in when users drag it.
- Highlight: The drag source will be highlighted when users drag it.
Step 3: Select or deselect the Revert checkbox (8). When this option is selected, a drag source will return to its original position if you drop it outside the drop area.
Note:
- You can convert multiple objects into drag sources at once.
- If you have multiple drag sources, you should rename them for easy identification when setting accepted and correct values. To do that, select a drag source > Properties pane > Interactivity tab > General > enter a new name.
Set Accepted Values and Correct Values for Drop Area Objects
Accepted values are drag sources that you can drop into the drop area. Accepted values can be correct or wrong drag sources. Meanwhile, correct values are correct drag sources (correct answers).
To set accepted values and correct values, do as follows:
- Select a drop area > Properties pane > Interactivity tab > Drag-n-Drop > click the Accept List button. Then, the Accept List dialogue will appear:
- Select checkboxes in the Accept column to specify the accepted values. If you allow users to drop all drag sources into it, select the Accept All checkbox.
- Select the checkboxes in the Correct column to specify the correct values (correct answers).
Another way to set correct values is to use the drag-n-drop connector (3). Just click on the marker in the middle of a drag source and drag the mouse to a drop area. This drag-n-drop connector denotes that dropping a drag source into a drop area is a correct action.
Set Drop Area Object Properties
To set up properties for a drop area, select it > Properties pane > Interactivity tab > Drag-n-Drop.
- Effect: Choose one effect from the Effect list as you do with drag sources.
- Snap Behaviour: Edit properties of drag sources after users drop them into a drop area.
- Size: Change the value to resize drag sources.
- Opacity: Set the opacity level from 0 to 255 for drag sources.
- Position: Define the location of drag sources with three options: Absolute (keep drag sources at the same position as where users drop them), Anchor (snap a drag source to an anchor point of a drop area), Tile (arrange a drag source so that it lies on a drop area without covering each other).
- Direction: Select a direction option if you select Anchor or Tile position.
Set Score and Reporting
A drop area object can not only validate learners’ actions but also give them points for correct actions. To set points for correct actions, select the drop area > Properties pane > Interactivity tab > Score & Reporting.
- Report ID: Track users’ activities. You can rename it to a meaningful name.
- Points: Set points for correct actions.
- Attempts: Set how many times users can drop a drag source onto the drop area.
- Timeout: Set a time limit for users to complete drag-n-drop action.
Insert and Customize Feedback Messages
Apart from the default feedback messages, you can add Timeout Message, Hint Message, Accept Message, and Reject Message to the drop area.
- Timeout Message will appear when users don’t complete an action in the predefined time.
- Hint Message will show up when users hover the mouse over a drop area.
- Accept Message will appear when users drag any accepted drag source into a drop area.
- Reject Message will show up when users drag any rejected drag source into a drop area.
To add those messages, open the Questions tab > Message. Or, right-click the drop target > Insert. Then, select a message from the list:
Then, you can customize feedback messages as you wish.
For more information, please refer to Work with Feedback Messages.
Add Events – Actions
Like other interaction objects, the drop area object also has default events – actions:
However, you can add more, edit or remove them if you want.
Below is the explanation for the meaning of each event:
- On Accept: Occur when users drag any accepted drag source into a drop area.
- On Reject: Occur when users drag any rejected drag source into a drop area.
- On Drag Enter: Occur when a drag source enters a drop area.
- On Drag Leave: Occur when a drag source leaves a drop area.
- On Correct: Occur when users drag any correct drag source into a drop area.
- On Incorrect: Occur when users drag any wrong drag source into a drop area.
- On Timeout: Occur when users don’t respond within the specified time.
- On Rollover: Occur when the mouse rolls over the drop area.
- On Rollout: Occur when the mouse rolls out of the drop area.
After adding events, continue adding actions to events, and conditions to actions if necessary.
For more details, see Use Events – Actions to Add Interactivity to Courses.
That’s how to work with a drop area object in ActivePresenter 9. Visit our Tutorial page, and YouTube channel for more tips and tricks using this app.
Related Articles: