Home > Interactivity > Click Zone
A 'Click Zone' is another object that allows two-way interactivity between your movie and your end-users. Use a Click Zone in a scene to pause your Demo/Tutorial and require your that your users click a pre-specified zone on the screen in order to continue (or take some other action).
At movie run-time, the user will be presented with your Click Zone and the movie will pause, awaiting the user's action (click). Demo Builder then offers Events ('On Click Inside', 'On Click Outside', 'On RollOver' as described below) which determine the next action (or path) to be taken by the movie.
Set the following properties and options for Click Zones:
The default name for a Click Zone is 'Click Zone X' ('Click Zone 1', 'Click Zone 2', 'Click Zone 3', and so onward), and this is visible in the name property of the object. You can change a click zone's name by deleting the default name and typing in another one. Ensure the click zone is selected before attempting to change its name property.
- Rotate, Scale and Location
Adjust the rotational angles, scale or manually change the location of the
click zone on the Canvas. Rotations on the X and Y-axis are ignored when
the click zone is attached to the image.
|Click the Reset button to clear all values.
Click on the individual labels and select Reset to clear the corresponding value or select Apply to all if you want to apply your chosen values to all other click zones.
- Hand Cursor
Change the mouse pointer to a hand cursor when a user
positions the mouse pointer over the Click Zone.
The style property allows you to change the appearance (style and color) of the
Determines the color for the Rectangle's edges.
Change the thickness of the Rectangle's edges.
Used to specify a color for the Rectangle.
Adjust the transparency of the chosen color.
Makes the click zone fully transparent and the borders invisible.
Select 'OnClick', 'OnDblClick' or 'OnRightClick' event.
Using the Click Zone Object Events
As described above, you can use Click Zone Events to interact with the users of
your demonstration or tutorial and to control the behavior of your movie
based on your end-users actions. The Click Zone object offers the following
3 events to achieve this:
- On Success Event
Add objects, actions, effects and/or audio to this event to define how your movie will display and behave in response to your users clicking inside the borders of the Click Zone.
- On Failure Event
Add objects, actions, effects and/or audio to this event to define how your movie will display and behave in response to your users clicking outside the borders of the Click Zone.
- On RollOver Event
Add objects, actions and/or audio to this event to define how your movie will behave when users positions their mouse cursor over the Click Zone object. (For example to display an explanatory message or tip in a balloon or text as to the action required by the user).
Important: Each individual Event has its own Timeline to define the separate sequencing of display and behaviors for that event.
Adding Actions and/or Audio to control the behaviour of Click Zone Object
For each of the above events, you can assign the desired behavior of your movie by adding an Action to take, an Effect to show and/or Audio to be played.
For further information on how to incorporate Demo Builder Events and user interactivity into your movies, demonstrations and tutorials, please see this fully worked Example .