Project in Unity that implements a dialogue box system with a typewriter text animation and a dynamic input glyph rendering. The system is built around a structure where dialogue data is stored in ScriptableObjects and processed through a manager that communicates with the UI.
- Unity Version: Unity 2021.3.45f2
- Language: C#
- Render Pipeline: URP
This project implements a simple dialogue interaction system used in narrative-driven games. The main goal is to make dynamically changes in the dialogue text when the input system changes from Controller to Keyboard.
At the start, a dialogue sequence is triggered and displayed through a dialogue box UI that shows:
- The speaker name
- The dialogue text
- A portrait placeholder
- A Continue button
- A Skip button
- Controller or Keyboard buttons.
Dialogue text is rendered using a typewriter animation, revealing characters progressively.
Players can press the Continue button to:
- Skip the typing animation and immediately display the full line.
- Advance to the next dialogue entry once the current line is fully visible.
Players can press the Skip button to:
- Skip the entire dialogue and get to the end of the system display.
Players can press either the Controller or Keyboard button to:
- Change between which glyphs will be shown base on the input system.
The UI logic is handled by the DialogueUI script which is responsible for:
- Updating UI elements when a new dialogue line is received
- Triggering the typewriter animation
- Handling user input through the Continue button
- Managing the state between typing text and advancing dialogue
Dialogue data is stored using ScriptableObjects through the DialogueObject class.
Each DialogueObject represents a dialogue sequence and contains all the information required for each dialogue entry, such as:
- Speaker name
- Dialogue
- Speaker portrait
The DialogueManager handles the background of the dialogue system.
- Receiving dialogue data from
DialogueObjectassets - Managing the progression of dialogue entries
- Communicating with the UI to display the correct dialogue line
- Getting back signal from UI to provide next dialogue line for display
The TypewriterEffect is providing the logic behind typewriting effect. Using a simple loop, it gives each character of the dialogue line with a small delay, using IEnumerator. It has three different speed variables:
typeSpeedhandles the general typing speed of the dialogueglyphSpeedhandles the typing when a glyph tag may appear in the dialogue linepuncSpeedhandles the speed if a punctuation character is seen. We have specified the marks on (.,,,?,!)
The speed can be modified through the Inspector via the DialogueUI script.
The DetectGlyphSystem.cs contains the logic behind detecting glyphs inside a string object to dynamically display the correct input icon depending on the player’s current input device. It checks if the name of a glyph (for example: _interact) (gotten from a list of scripatble Glyph objects GlyphObject.cs) is inside the string we are checking, ignoring case. If a match is detected, it replaces the tag with the correct glyph identifier.
Example:
Press _Interact to open the door
If the player is using a keyboard, the system converts it to:
Press Keyboard_Interact to open the door
This allows the text renderer (using a sprite asset sheet) to display the correct icon inline with the text.
Note: For the system to work correctly, glyph names used in dialogue must match the naming convention used in the sprite asset sheet. In our case, the glyphs are named with this format:
[InputDevice]_[Action]
Examples:
Keyboard_Interact
Gamepad_Interact
Each time the user presses the toggle buttons for input device, the text in the UI changes to the input device the toggle was attributed in.
Note: If the text is being generated and the change happens when the glyph is changed, it won't immediatly change the glyph text and show the previous input device glyph.
The input system uses Unity’s new Input System. InputManager.cs handles changes that may happen when a button is pressed. Specifically, it does the following:
- Detecting the current input device (Controller or Keyboard).
- Determining if the device is a Gamepad; if not, it defaults to Keyboard.
- Broadcasting input device changes to other systems via an Event.
The input system contains an Event that informs the listeners (ToggleColorOn and DetectGlyphSystem) that the input device has changed, so that the changes in dialogue take effect immediatly.
Note: A new action map is created in Input folder. The action map recognizes two actions, Interact (Space and A) and Skip (Tab and RB).
- Enhanced UI Effects
- Add more dynamic effects to character icons and buttons.
- Input System Refinements
- Improve detection of input devices to include mouse movement in addition to button presses.
- Ensure the InputManager event informs all the listeners at startup so the correct device is displayed immediately.
- Typewriter Effect Optimization
- Refactor the
TypewriterEffect.csto separate its logic into smaller functions for specific actions.
- Download the .zip file from the release section using
https://github.com/ISeferli/Glyph_Input_Dialogue.git- Extract all files and import on Unity
- Run the Unity scene.
- Read the dialogue as it appears with the typewriter effect.
- Press Continue to move to the next dialogue entry.
- Press Skip to skip at the end of the dialogue.
Iliodora Seferli
Portfolio: Link of Project Code