Overview

Interactables are used to allow the user to click to interact with the scene in the browser. The interactable includes a hitbox component that determines the area that can be clicked.

SDKGuide_Interactables01.mp4

1. How to create Interactables

  1. Select the Treasured Map in the Hierarchy, and in the Inspector select the Interactables tab and click "+Create New"

Untitled

2. Placing Interactables

  1. Once you have created a new interactable, you will see it in the Hierarchy tab under Treasured Map > Interactables > Interactable. When selected in the scene it will appear as a green box (make sure Gizmos are visible). You can rename the interactable in the Inspector and rotate/move it to the location you want using the widget. When not selected the box will not be visible.

Untitled

  1. When you have placed the interactable in the desired location, you can adjust the size of the hitbox. When doing so, be sure to have the hitbox component selected in the Hierarchy, and not the whole interactable.

    1. The hitbox controls the area that can be clicked by the user within the browser preview that will trigger an action. It can be scaled as needed, though it must not be too thin in order to function properly.

    Untitled

  2. You can create and arrange more interactables as needed and arrange them in the Hierarchy by dragging them up or down.

    1. If you choose to duplicate an interactable to more easily place it, make sure to press the 'regenerate ID' button on the duplicated interactable in the Inspector. This will ensure that the duplicate and original are not treated as the same object.

    Untitled

3. Adding Actions

SDKGuide_AddingActions.mp4

  1. With the interactable(s) in place you can attach actions to them to be displayed in the browser preview. In the Inspector under Actions, click the "+" button to add an action group.

  2. Once the new group is created, click the "+" in the empty list to choose what action you want to occur. You can add multiple actions, and everything within one group will happen at the same time.

    Untitled

    1. Embed allows you to open a link or play audio by entering the corresponding code into the box. See Embedding Links
    2. Select Object Action allows you to select another hotspot or interactable
    3. Show Text Action will display the text you input in the Content box. There are currently three different display types: None, Dialogue and Fade.