[et_pb_section fb_built=”1″ _builder_version=”4.4.3″ background_image=”https://www.sovereignmoon.studio/wp-content/uploads/2020/07/moon.jpg”][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.4.3″ max_width=”1206px” max_width_tablet=”” max_width_phone=”” max_width_last_edited=”on|phone”][et_pb_column type=”3_5″ _builder_version=”4.4.3″][et_pb_text _builder_version=”4.4.3″ text_font=”Muli|300|||||||” text_text_color=”#e0d8c9″ text_font_size=”18px” text_line_height=”1.8em” header_font=”Abril Fatface||||||||” header_text_color=”#e0d8c9″ header_font_size=”42px” header_letter_spacing=”1px” header_line_height=”1.1em” header_3_font=”Raleway|200|||||||” header_3_text_color=”#e0d8c9″ header_3_font_size=”29px”]
SOVEREIGN MOON PRESENTS…
How to Add Dialogue Boxes & Text Info Popups in Unity’s 3D Game Kit
In this tutorial we’ll learn how to add dialogue boxes using the “info zone” prefab within Unity’s 3D Game Kit.
[/et_pb_text][et_pb_button button_url=”#tutorial” button_text=”Read the Full Tutorial ?” _builder_version=”4.6.1″ custom_button=”on” button_text_size=”18px” button_text_color=”#353535″ button_bg_color=”#fff4af” button_border_width=”1px” button_border_color=”#d3d3d3″ button_letter_spacing=”1px” button_font=”Abril Fatface||||||||”][/et_pb_button][/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.4.3″][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|phone” _builder_version=”4.4.3″ background_color=”#fcfcfc” module_alignment=”center” custom_margin=”||||false|false” custom_padding=”10px||10px||false|false” custom_padding_tablet=”” custom_padding_phone=”||||false|false” global_module=”1107″][et_pb_row column_structure=”1_5,3_5,1_5″ _builder_version=”4.4.3″ max_width=”998px” custom_margin=”|||150px|false|false” custom_margin_tablet=”” custom_margin_phone=”|||auto|false|false” custom_margin_last_edited=”on|phone”][et_pb_column type=”1_5″ _builder_version=”4.4.3″ custom_padding_tablet=”” custom_padding_phone=”|125px|||false|false” custom_padding_last_edited=”on|phone”][et_pb_image src=”https://www.sovereignmoon.studio/wp-content/uploads/2020/08/smlogo2.png” align=”center” src_tablet=”” src_phone=”” src_last_edited=”on|phone” align_tablet=”” align_phone=”left” align_last_edited=”on|phone” _builder_version=”4.4.3″ width=”100%” max_width=”48%” module_alignment=”right” custom_margin=”||||false|false” custom_margin_tablet=”” custom_margin_phone=”” custom_margin_last_edited=”on|phone” custom_padding=”|0px||0px|false|true” border_radii=”on|90px|90px|90px|90px”][/et_pb_image][/et_pb_column][et_pb_column type=”3_5″ _builder_version=”4.4.3″ custom_padding_tablet=”” custom_padding_phone=”||||false|false” custom_padding_last_edited=”on|phone”][et_pb_text _builder_version=”4.6.1″ text_font=”Muli|300|||||||” text_font_size=”17px”]
Sovereign Moon Studios is dedicated to helping game enthusiasts bring their creative visions to life. We are the publisher of the Web’s most loved NoCode game design course. Learn more here.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_5″ _builder_version=”4.4.3″][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.4.3″ background_image=”https://www.sovereignmoon.studio/wp-content/uploads/2020/08/space-blog.png” background_size=”initial” background_position=”top_right” custom_margin=”5px||0px||false|false” custom_padding=”5px||0px||false|false” background_last_edited=”on|phone” background_enable_image_tablet=”off”][et_pb_row column_structure=”3_4,1_4″ _builder_version=”4.4.3″ custom_margin=”25px||||false|false” custom_padding=”5px||||false|false”][et_pb_column type=”3_4″ _builder_version=”4.4.3″][et_pb_text _builder_version=”4.6.5″ text_font=”Muli|300|||||||” text_font_size=”18px” text_line_height=”1.8em” header_font=”Abril Fatface|700|||||||” header_text_color=”#0a0001″ header_font_size=”42px” header_line_height=”1.4em” header_2_font=”Abril Fatface||||||||” header_2_font_size=”33px” header_2_letter_spacing=”1px” header_2_line_height=”1.1em” header_3_font=”Abril Fatface||||||||” header_3_text_color=”#565656″ header_3_font_size=”26px” header_3_line_height=”1.8em” header_3_font_size_tablet=”” header_3_font_size_phone=”20px” header_3_font_size_last_edited=”on|phone”]
How to add Dialogue Text Boxes Within Uniy’s 3D Game Kit
Today, Sovereign Moon Studios, the makers of your favorite NoCode game development course, are excited to bring you a new tutorial that will walk you through the steps required to add dialogue boxes and text popups into your Unity 3D Game Kit video game.
Let’s jump in!
Introduction:
Being able to add dialogue boxes into your Unity game using the free 3D Game Kit add-on is easy and doesn’t require any coding.
Let me walk you through the steps of adding dialogue boxes
Step 1: Add an “Info Zone”
Let’s begin by adding something into our scene that will act as a visual cue for our character to interact with. This object can be anything, but in our example, we’re going to use a crystal as our main object. When our character approaches the crystal a text box will popup with information for the character.
To add an info zone, we simply need to look under our “interactibles” folder (under our “prefabs” folder) and look for the item called “info zone”. We then need to drag and drop the info zone component under our “game utilities” section within our scene hierarchy tab.
Once we have that done, we need to scale the info zone object down so that it only covers the area we want to use as our trigger area. Because we’re using a small crystal in this example, we’re going to scale down our info zone collider until it reaches out just past the limits of our crystal. This will mean that our character will need to walk close to the object before the dialogue box will popup.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”4.4.3″][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.6.1″ background_image=”https://www.sovereignmoon.studio/wp-content/uploads/2020/08/space-blob2.png” background_size=”initial” background_position=”center_left” custom_margin=”0px||0px||false|false” custom_padding=”0px||0px||false|false”][et_pb_row column_structure=”3_4,1_4″ _builder_version=”4.6.1″ custom_margin=”0px|auto|0px|auto|false|false” custom_padding=”0px||0px||false|false”][et_pb_column type=”3_4″ _builder_version=”4.4.3″][et_pb_image src=”https://www.sovereignmoon.studio/wp-content/uploads/2020/09/Unity-dialogue-box.jpg” alt=”Unity dialogue box” title_text=”Unity dialogue box” _builder_version=”4.6.1″ custom_margin=”0px||0px||false|false” custom_padding=”0px||0px||false|false” border_radii=”on|10px|10px|10px|10px”][/et_pb_image][et_pb_text _builder_version=”4.6.5″ text_font=”Muli|300|||||||” text_font_size=”18px” text_line_height=”1.8em” header_font=”Abril Fatface|700|||||||” header_text_color=”#0a0001″ header_font_size=”42px” header_2_font=”Abril Fatface||||||||” header_2_font_size=”33px” header_2_letter_spacing=”1px” header_2_line_height=”1.1em” header_3_font=”Abril Fatface||||||||” header_3_text_color=”#565656″ header_3_font_size=”26px” header_3_line_height=”1.8em” custom_padding=”35px||35px||false|false” hover_enabled=”0″ header_3_font_size_tablet=”” header_3_font_size_phone=”20px” header_3_font_size_last_edited=”on|phone” sticky_enabled=”0″]
Step 2: Add Dialogue UI Prefab
Essentially, the info zone acts as our trigger area. this is the area within 3D space that our player will need to walk inside of in order to have the text boxes popup.
Next, we need to look under our prefabs folder for the sub folder UI prefabs. Within the UI prefabs folder, you’ll see an object called DialogueCanvas.Prefab. Drag and drop this object into the UI section of your hierarchy window.
Step 3: Connecting the Dialogue Controller to the Info Box
All we have left to do is connect the dialogue controller prefab to our info box. To do this, we first need to select the Info Box from our hierarchy section. Once selected, the object’s details will show up under our inspector tab. You will notice there is an “interact on trigger (script)” component within the inspector tab. Within this area, we’ll need to make a few edits to tell Unity and 3D Game Kit what we want the info box to do when the player enters and exits this region.
Of course, we want Unity to display a popup text box when the player enters this region and we want the popup box to disappear once the player has left the region.
So let’s set these up now.
First, ensure “layers” is set to “player”.
Next, under “on enter” we need to drag and drop our dialogue controller (from our hierarchy section) into the object section (as outlined in the video above). Once this is done we need to change the function to “DialogueCanvasController” and then we need to select “ActivateCanvasWithText (string)“. Once you do that, a small text area will be visible where you can enter the text you want to display once this object is selected.
Step 4: Setting Up “On Exit”
The last thing we need to setup is what we want our game to do once our player exits the info zone. In order to do this, we simply to to select “DialogueCanvasController” and then “DeactivateCanvasWithDelay (float)”. Because this function uses “float” and not “string”, we need to insert a number which will tell Unity how long we want the message to stay up on the screen after the character has left the info box area. In our example, we’ll set this to 2 which will represent 2 seconds.
Once we have completed that step, we can play our game and test out our dialogue box.
Conclusion
My goal today was to show you how to add a dialogue box using what you already have at your disposal within Unity’s 3D Game Kit. However, there are many other ways to add a dialogue system into your Unity game as well. For example, you could use Bolt, Unity’s free visual scripting add-on to do the same thing. However, my goal today was to keep the creation of a dialogue system as simple as possible.
So that’s all I have for you today. Thanks for stopping by our blog. In the next tutorial in this series I’ll teach you how to use switches and counters within your game worlds to create more interesting game mechanics.
If you are an indie game maker and you’re looking to bring your no-code game development skills to the next level, then consider signing up for our comprehensive no-code game development course. In that course, we’ll dive into much more detail and help you make breathtaking indie video games without having to know how to code, how to draw or how to animate. Simply visit our homepage to learn more.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”4.4.3″][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|phone” _builder_version=”4.4.3″ background_color=”#fcfcfc” module_alignment=”center” custom_margin=”0px||0px||false|false” custom_padding=”||0px||false|false” custom_padding_tablet=”” custom_padding_phone=”||||false|false” global_module=”1106″][et_pb_row column_structure=”1_5,3_5,1_5″ _builder_version=”4.6.1″ max_width=”998px” custom_margin=”|||150px|false|false” custom_margin_tablet=”” custom_margin_phone=”|||auto|false|false” custom_margin_last_edited=”on|phone”][et_pb_column type=”1_5″ _builder_version=”4.4.3″ custom_padding_tablet=”” custom_padding_phone=”|125px|||false|false” custom_padding_last_edited=”on|phone”][et_pb_image src=”https://www.sovereignmoon.studio/wp-content/uploads/2020/08/smlogo2.png” align=”center” src_tablet=”” src_phone=”” src_last_edited=”on|phone” align_tablet=”” align_phone=”left” align_last_edited=”on|phone” _builder_version=”4.4.3″ width=”100%” max_width=”48%” module_alignment=”right” custom_margin=”||||false|false” custom_margin_tablet=”” custom_margin_phone=”” custom_margin_last_edited=”on|phone” custom_padding=”|0px||0px|false|true” border_radii=”on|90px|90px|90px|90px”][/et_pb_image][/et_pb_column][et_pb_column type=”3_5″ _builder_version=”4.4.3″ custom_padding_tablet=”” custom_padding_phone=”||||false|false” custom_padding_last_edited=”on|phone”][et_pb_text _builder_version=”4.6.1″ text_font=”Muli|300|||||||” text_font_size=”17px”]
Sovereign Moon Studios is dedicated to helping game enthusiasts bring their creative visions to life. We are the publisher of the Web’s most loved NoCode game development and design course. Learn more here.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_5″ _builder_version=”4.4.3″][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”4.4.3″ background_color=”rgba(10,0,1,0.98)” global_module=”1039″ saved_tabs=”all”][et_pb_row column_structure=”1_2,1_2″ _builder_version=”4.4.3″ width=”84%” max_width=”1191px”][et_pb_column type=”1_2″ _builder_version=”4.4.3″][et_pb_text _builder_version=”4.6.1″ text_font=”Muli|300|||||||” text_text_color=”#e0dad2″ text_font_size=”18px” text_line_height=”1.8em” header_font=”Abril Fatface||||||||” header_text_color=”#e0d8c9″ header_font_size=”33px” header_line_height=”1.1em” custom_padding=”5px||||false|false”]
Want to Make Video Games?
Do you love game design? So do we! For this reason, we created a no-code video game development course that walks you through the process of bringing your game visions to life without needing to know how to program and without having to be an artist. We will teach you how to bring your game to life in our 4 hour 36 module no-code game development course.
[/et_pb_text][et_pb_button button_url=”/” button_text=”Learn More ?” _builder_version=”4.4.3″ custom_button=”on” button_text_size=”18px” button_text_color=”#fff4af” button_bg_color=”rgba(255,244,175,0)” button_border_width=”1px” button_border_color=”#fff4af” button_letter_spacing=”1px” button_font=”Abril Fatface||||||||”][/et_pb_button][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”4.4.3″][et_pb_text _builder_version=”4.6.1″][/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]