Step 4: Display Dialogue In-Game

Set up dialogue UI components for text display and typewriter effect.

Step 4 — Display Dialogue In-Game

Dialogue UI Component

The DialogueUIComponent handles displaying dialogue text on screen. It receives text from the UI Bridge and shows it in a UI element.

  1. Create a UI canvas with a text panel for dialogue display (speaker name label + dialogue text area)
  2. On the UI entity, add a DialogueUIComponent
  3. Register the UI entity with the bridge by calling RegisterDialogueUI(panelType, entityId) or by placing it where the bridge can discover it

When a Text node executes, the sequencer sends the speaker name and dialogue text through the bridge to the UI component, which updates the display.

Typewriter Effect

The TypewriterComponent reveals text character by character for a classic RPG dialogue feel:

  1. On the same entity as the DialogueUIComponent, add a TypewriterComponent
  2. Set the Default Speed — letters per second (e.g., 30 for moderate speed)
  3. The typewriter automatically hooks into the dialogue display

When text arrives, the typewriter reveals it gradually. The player can press a button to call ForceComplete() for instant reveal.

World-Space Dialogue (Speech Bubbles)

For dialogue that appears above characters in the 3D world:

  1. Use WorldDialogueUIComponent instead of DialogueUIComponent
  2. Configure a spawnable prefab for the speech bubble UI
  3. The component tracks the speaking entity’s position and places the UI above them

Flow

Sequencer executes Text node
    → UIBridge.RunDialogue(text, speakerName)
        → DialogueUIComponent.DoDialogue(text, performerData)
            → TypewriterComponent.StartTypewriter(text)
                → Text reveals character by character
                    → Player presses button → ForceComplete()
                        → Sequencer advances to next node

Next: Add Player Choices