All content in this course uses:

Display character dialogue using raycasting

In this tutorial, you’ll add a friendly NPC to your game to share a message with the player character.

By the end this this tutorial, you’ll be able to do the following:

Raycast to identify a specific GameObject.

Display the dialogue UI when the raycast is successful.

You’ve almost completed your game’s core functionality. In this tutorial you’ll add a friendly non-player character (NPC) who shares a message with the player character, explaining what the task is – to fix all the broken robots.

: For the purposes of this tutorial, we chose to use the 

 asset set, and the images used in instructions will reflect this. If you chose another asset set, the file names will be the same, but in your corresponding theme folder.

Overview

You’ve already learned how to configure character’s GameObjects like the 

 or the enemies of your game. The first step of this tutorial will cover some of the same setup: slicing the spritesheet, creating a new GameObject, and adding animations.

To set up the NPC character for your game, follow these instructions:

 button and slice the sprite atlas in a 2 by 2 grid.

If you need to recap this process, review the guidance in 

 window, select the three sprites for the NPC animation, then drag and release them over the 

This process will automatically add a new GameObject to the scene with an 

 set up with an animation clip using the sprites that you have chosen.

 dialog, name the animation “NPC” and save it in a new folder inside your 

 Rename the new GameObject in the scene “NPC”.

, just as you did previously with other animations.

 Now that the NPC sprite is visible in the 

 view, position it in the location where you want the NPC to interact with the player.

 If you want to change the size aspect ratio of your NPC, you can adjust the 

 GameObject and scale it to cover the bottom half of the sprite just as you did for the player and enemy characters.

 Create a new layer for the NPC and set the 

. Test the game and make sure that the animations and collisions work as expected.

Set up a new NPC

The NPC is going to tell the player that they need to fix the robot enemies, but if that text is constantly displayed on screen that’s going to take up space that could be better used. The NPC’s dialogue should only display when the player character is within a certain range, so you need to determine when the player character is close and facing the NPC.

You could use a trigger, but this means that the player character could trigger the dialogue without facing the NPC, which can feel clunky in practice. Instead, you’ll use a physics system feature called 

 is the action of casting a ray (straight line) in the scene and checking whether that ray intersects with a 

. A ray has a starting point, direction, and length. You cast a ray because the check is made from the starting point along the ray until its end.

To set up the raycast, follow these instructions:

 At the top of the class, declare a new public input action, as you did for the projectile launch action:

 In the Unity Editor, set up an event-based Input Action for the 

 key or your choice of alternative input, as you did when implementing projectile launch functionality in 

 function, add the following instructions:

 type variable hit stores the result of a raycast, which is obtained by calling 

; the version used here has four arguments (values you can pass to it).

The first argument is the starting point for the ray. Here it’s an upward offset from the position of the 

 GameObject, which will test from the center of the sprite rather than its feet.

The second argument is the direction that the player character is looking, using 

The third argument is the maximum distance for the ray – 1.5 units keeps the test within a short distance from the start point, because the characters aren’t shouting.

The final argument defines a layer mask, which is a way to only check within specified layers. Any layers that aren’t within the mask are ignored during the intersection test. The NPC layer is the only layer relevant for this test, so it’s the only one in the mask.

If the raycast detects a GameObject that meets the defined conditions, the

 statement below will execute and call the 

 function. You’ll see an error for now because the function hasn’t been defined yet – you’ll define the function next.

 that will first check if the correct input action was activated:

variable calculated earlier will be used inside the function.

statement code block, add the following instruction to print the GameObject found in the 

 Save your changes, then return to the Unity Editor and test your game to confirm that the raycast works.

Unity Editor showing the full layout. The Game view is centered and displays the level with the Ruby character, an NPC, damage zones, and strawberry collectibles. The Hierarchy window is on the left, and the Console at the bottom shows logged raycast hit messages.

Raycast to the the NPC

Next you’re going to create the UI window to display the NPC dialogue to the player.

 If you need more support to complete this step, refer back to 

To set up the NPC dialogue UI, follow these instructions:

 asset, call it “NPCDialogue” and open it.

pane, use the foldout (triangle) to expand the Inlined Styles section and then the 

), then search for and select the correct 

This will make the dialogue box transparent.

 Use the foldout (triangle) to expand the 

Create the dialogue UI

element to the UI that will display the NPC’s dialogue to the player, follow these steps:

 pane, use the foldout (triangle) to expand the 

 property box enter “25px”, to set the same value for all sides.

Feel free to experiment with bigger or smaller values to find one that looks right to you.

pane, use the foldout (triangle) to expand the 

 box, enter what you want the NPC to say to the player.

An example of what you could add is: “Press C to shoot cogs and help me fix these broken robots! Come speak to me when you’re finished!”

Add a Label element

To link the dialogue window to the rest of the game UI, follow these instructions:

button. Use the foldout (triangle) to expand the 

, like a prefab can instantiate a GameObject. Rename it “NPCDialogue”.

Adding the additional UI here means that you can modify the individual asset you’ve created and the instance in the 

 will reflect those changes. If you added multiple dialogue windows in your UI, you would then have to change the source asset once to update all instances.

 Set the remaining property values in the 

If you want to adjust the exact positioning of the dialogue window on the screen, you can adjust the position values.

pane reflects the positioning that players will encounter in the game. If you need a reminder on how to do this, check the instructions in 

Set the UI Canvas size to match the Game view

Update the GameUI asset

Now that you’ve created the UI for the dialogue, you need to update your scripts to ensure that it’s displayed for a short amount of time after a raycast that finds the NPC’s collider.

 class, declare the following three variables:

 stores the length of time that the dialogue window will be displayed, initialized to 4 but made public so you can adjust this in the 

 when the dialogue window is instantiated, and will count down the time until the window needs to be hidden.

 function, add the following three instructions:

The first instruction stores the reference to the

The second instruction hides the element when the 

 GameObject is instantiated at the start of the game.

. This value is just below zero, and so can be used as a default for not displaying the UI.

Update the UIHandler script

Here, we encourage you to try writing the code on your own. But don’t worry – if you want to make sure you did it correctly, you can review the script in the next step.

You need to write two additional functions for the 

 function that decrements (decreases) the display timer if it’s above zero and then resets 

 window when called and set the timer variable to begin the countdown.

Apply what you’ve learned so far in this course and try to write these functions yourself before you read on to review the solution.

To check your functions for the NPC dialogue window, follow these instructions:

 function and code block that decrements the 

 if the variable value is greater than zero:


 Nested within that same code block, add another 

 statement that hides the dialogue window when the countdown is over:

 Inside the function add the following instructions to make the UI window visible and set the timer to its full count:

Challenge: Add new functions

The final step to complete is to display the dialogue window after the raycast finds the NPC and the Talk action key binding is pressed.

To implement this functionality, follow these instructions:

 Delete the current instruction that prints to the 

window and in its place, add the following line of code:

 script you defined in the previous step, and thus create an instance of the dialogue UI on the screen.

The function no longer requires a parameter, so remove it from the function definition and delete the 

 variable you passed when calling the function inside the 

This is how your function should look now:

 Save your changes, then return to the Unity Editor and test the game.

Now the NPC dialogue should display for a short time when the 

 is close to and facing the NPC and then provides the required input.

Display the dialogue window in the game

If you want to further develop your skills, explore new concepts, or improve your project, check out some of the optional activities below. Each one is tagged as either Easy, Medium, or Difficult, so you can choose the level of challenge.

These activities are entirely optional, so if you’re not interested, no problem – just skip this step. We do recommend attempting at least one of them in order to get the most out of this learning experience. Good luck!

 challenge is marked as optional, but it’s actually essential for a good gameplay experience, so we strongly encourage you to complete it. After this step, the affected script updates will be reflected in the 

 sections at the end of the tutorials. To avoid confusion between the provided scripts and your own code, please make sure you complete this challenge first.

Right now, there’s a small issue: as the developer, you know which key activates the 

 action, but the player doesn’t. UI elements help guide players through the game, showing how to move, interact, and make decisions. You’ve already used UI to display the player’s health and added text instructions for launching projectiles, but you still need to show how to interact with the NPC.

To fix this, you’ll add a small dialogue bubble that appears when the 

 detects the NPC with the raycast, showing the correct key to press, and disappears when the 

This asset is a sprite that already includes the 

 key printed on it, indicating which key should be pressed. If you chose a different key for the 

 binding, you’ll need to create your own sprite or find another way to display the correct key visually.

Tool to position it above the NPC. Then, set the 

 so it appears above the characters and background.

You’ve already learned earlier in this course how to control sprite rendering order using 

 In the Unity Editor, assign the script to the 

 GameObject as a component and assign the 

The main purpose of this script is to identify the 

 GameObject through code so that you can access its child GameObjects.

 method, after calculating the raycast to detect the enemy, and inside the 

, so avoid calling it every frame. In this situation, 

 code block, on the next line, but before the 

function calling, add the following lines of code:

With these instructions, you activate the 

 GameObject only when the raycast detects the 

 variable to keep track of the interaction during the current frame.

was not met – in other words, there is no 

. In that case, the code checks whether an 

The entire code block should look like this:

Medium: Add a second NPC with a unique dialogue

One NPC is great, but two are even better! Add a second NPC to your scene and give them something different to say than the first NPC. To accomplish this task, you should do the following:

Make the text displayed a parameter of the 

 function. (You’ll need to retrieve the 

By making the text a public property, you can write whatever you like for each individual NPC.

More things to try 

Take a moment to check that your script is correct before continuing.

: This script includes the instruction to implement the optional UI added to display de controls to talk with the NPC, added in the 

 challenge, but does not contain code for any additional extension work.

Check your scripts

You’ve added an NPC that guides the player through the task of completing the level by fixing the robots, making the game’s objective clearer. In the next tutorial, you’ll close the game loop by introducing win and lose conditions, and set up the scene to reload when either occurs.

Unity Version 6.3