---
title: "UI"
content_type: tutorial
url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar?language=en"
language: en
container_type: course
container_title: "3D Game Kit Lite"
container_url: "https://learn.unity.com/course/3d-game-kit-lite.md?language=en"
standalone_markdown_url: "https://learn.unity.com/tutorial/ui-jbsmar.md?language=en"
previous_title: "Indicating Progress to a Player"
previous_url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/indicating-progress-to-a-player?language=en"
previous_markdown_url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/indicating-progress-to-a-player.md?language=en"
next_title: "Enemies"
next_url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/enemies-k?language=en"
next_markdown_url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/enemies-k.md?language=en"
difficulty: beginner
duration_minutes: 20
unity_version:
  - "2020.3"
  - "2020.2"
  - "2020.1"
  - "2019.4"
  - "2019.3"
  - "2019.2"
  - "2019.1"
  - "2018.4"
  - "2018.3"
supported_unity_versions:
  - name: "2020.3"
    url: "https://learn.unity.com/tutorial/ui-jbsmar.md?language=en&version=2020.3"
  - name: "2020.2"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2020.2"
  - name: "2020.1"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2020.1"
  - name: "2019.4"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2019.4"
  - name: "2019.3"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2019.3"
  - name: "2019.2"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2019.2"
  - name: "2019.1"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2019.1"
  - name: "2018.4"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2018.4"
  - name: "2018.3"
    url: "https://learn.unity.com/course/3d-game-kit-lite/tutorial/ui-jbsmar.md?language=en&version=2018.3"
last_updated: "2026-08-04T14:21:48.000Z"
---

# UI

Learn to communicate what each Switch does and why it matters so users can complete the gameplay.

To finish off the gameplay elements of each Switch, you need to find a way to tell the user what the Switch does, and why it’s important.

## 1. InfoZone Prefab

A common way to do this is via dialogue from the protagonist to the player. The 3D GameKit Lite achieves this with an InfoZone Prefab.

- In the Project view, go to **3DGamekitLite > Prefabs > Interactables** and select the **InfoZone** Prefab.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/dd8ec83c-9448-46c8-a0fc-357950e3c579_image10.png)

Drag **InfoZone** into the **Hierarchy** window under the **---- UI ----** section header. Remember to add it _below_ the section header, and not as a child GameObject of it.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/633978c5-4602-4c80-b4fa-4a103dc62789_image9.png)

- The **InfoZone** GameObject has a **Sphere Collider** component, which appears in the Scene as a large green sphere. Move this over the **Switches**, and resize it to include all three. This defines the area in which **Ellen** needs to stand to trigger the dialog, so don’t make it too big.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/3fadc104-c038-46ef-a2d7-17a8fcc1446b_image4.png)

- In the **Inspector** window, set **Layer** to **Environment** if Unity has not set it automatically.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/145e9b5d-e22c-44f8-8bcf-305449ac5f20_image1.png)

- On the **Sphere Collider**, enable Is **Trigger.**

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/65a1eec5-2dc8-4b1f-85ef-88acf8e74028_image8.png)

Now we need to link the **InfoZone** to the **DialogueCanvas** Prefab, which uses Game Commands to give the player information about the **Switches** when they enter the trigger zone.

- Go to **3DGamekitLite > Prefabs > UIPrefabs** and find the **DialogueCanvas** Prefab.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/ebd4dd76-ee66-4166-a588-915dd5ad4af2_image2.png)

- Drag a **DialogueCanvas** into the **Hierarchy** window and place it under the  **---- UI ----** section header.
- Deactivate it by unticking the checkbox at the top of the inspector next to the name.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/75cf06dc-7316-4bbb-8b16-0c43a1a87cef_image6.png)

- Later, we’ll set this up so that it only activates when **Ellen** enters the trigger zone of the **InfoZone**.

Select the **InfoZone** in your Scene and find the **Interact On Trigger** component in the **Inspector** window.

- Set **Layers** to **Player** if Unity has not set it automatically.
- Set **On Enter ()** and **On Exit ()** to the Dialogue Canvas Controller script. To do this, drag the script into the empty slot for each one.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/cda9a765-6ad6-4eaa-a4b2-741b4d5ef55f_image5.png)

Under **On Enter ()**, select the drop-down that reads **No Function** and change it to **DialogueCanvasController.ActivateCanvasWithText.**

Update the text field to provide some useful text to the player. This example uses the following: _“If I switch all of these on maybe the door will open.”_

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/c3ba9c86-1a88-46b2-9fa0-70ba28d50941_image7.png)

- Under **On Exit ()**, select the drop-down that reads **No Function** and change it to **DialogueCanvasController.DeactivateCanvasWithDelay**, then set the value field beneath it to 1.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/d1df107e-b39d-49ec-80c9-69035d603ce3_image11.png)

To test that your set-up works, press Play and walk towards the **Switches.** The dialog box with the text should appear when you get close to them.

![](https://connect-mediagw.unity.com/h1/20190214/learn/images/72847aa2-0ca1-4bb6-9774-e08506a137ac_image3.png)

Now that this is all set up, you can move the **Switches** and **Crystals** to other areas, or hide them from the player to make it more challenging. The Game Command links remain attached when you move things around, so you can use the GameObjects more dynamically in your level. You can also add the **DialogueCanvas** to any areas where you require the player to be notified of key gameplay mechanics in your Project.
