🌍 Lesson 4.4: World-Space UI — Nameplates & Damage Numbers

A Canvas in the World

Back in Lesson 4.1 you met World Space render mode: the canvas becomes a physical object in the scene with a real position and size in meters. That's exactly what a nameplate is — a little screen floating a couple of meters up, parented to the enemy so it moves along with them.

The setup that trips everyone: a fresh World Space canvas is enormous (its RectTransform is hundreds of units wide, meaning hundreds of meters). You shrink it with the RectTransform's Scale, typically to around 0.01 on each axis, then set a sane width/height in the now-tiny units. Here's the result — a nameplate hovering above a character:

The Enemy Nameplate

A nameplate is just a small World Space canvas parented above the enemy, holding a name label and — reusing everything from Lesson 4.3 — a Filled Image health bar. Because it's a real child of the enemy, it follows them around the level automatically. You only need code for two things: setting the name, and driving the bar from the enemy's health event.

using UnityEngine;
using UnityEngine.UI;
using TMPro;

public class Nameplate : MonoBehaviour
{
    [SerializeField] TMP_Text nameLabel;
    [SerializeField] Image healthFill;   // Filled Image, exactly like the HUD bar
    [SerializeField] Health health;      // the enemy's Health (from Lesson 4.3)

    public void SetName(string enemyName) => nameLabel.text = enemyName;

    void OnEnable()  => health.OnHealthChanged += UpdateBar;
    void OnDisable() => health.OnHealthChanged -= UpdateBar;

    void UpdateBar(int current, int max)
    {
        healthFill.fillAmount = (float)current / max;
    }
}

That's the whole nameplate. Notice it's the same event-driven pattern as the screen HUD — the only difference is where the canvas lives. One OnHealthChanged event can feed a screen HUD and a world nameplate at once.

Billboarding to Face the Camera

A world-space nameplate has a real rotation, so if the enemy turns away, you'd read the text backwards — or edge-on, as an invisible sliver. Billboarding fixes this: every frame, rotate the canvas to face the camera, so the player always reads it head-on.

The simplest, most robust billboard makes the canvas share the camera's forward direction (so it stays parallel to the screen plane rather than tilting toward a perspective camera at the edges):

using UnityEngine;

public class Billboard : MonoBehaviour
{
    Transform cam;

    void Start()
    {
        cam = Camera.main.transform;   // cache it once
    }

    void LateUpdate()
    {
        // Face the same way the camera faces → always flat to the screen.
        transform.forward = cam.forward;
    }
}

Two important choices here:

• LateUpdate, not Update. The camera may move in Update; running the billboard in LateUpdate guarantees we orient after the camera has finished moving this frame, so the plate never lags a frame behind.
• Match camera forward, not LookAt(cam). LookAt aims at the camera's position, which tilts plates at the screen edges under a perspective camera. Copying the camera's forward keeps every plate perfectly flat and parallel — the look players expect.

Floating Damage Numbers

Now the satisfying part: a number that pops off an enemy when it's hit, floats up, and fades out. Each number is a tiny World Space canvas (or a TMP text set to world space) with a script that animates it over a short lifetime, then deactivates itself.

The animation is pure interpolation over a lifetime t: rise on Y, drift a little, and fade the alpha to 0. It also billboards (reuse the component above, or fold it in). When the lifetime ends it returns itself to the pool:

using UnityEngine;
using TMPro;

public class DamageNumber : MonoBehaviour
{
    [SerializeField] TMP_Text label;
    [SerializeField] float lifetime = 0.9f;
    [SerializeField] float riseSpeed = 1.4f;   // meters/second upward

    DamageNumberPool pool;   // who to return to
    float age;
    Color baseColor;

    // Called by the pool when this number is handed out.
    public void Play(string text, Vector3 worldPos, DamageNumberPool owner)
    {
        pool = owner;
        label.text = text;
        transform.position = worldPos;
        age = 0f;
        baseColor = label.color;
        baseColor.a = 1f;
        label.color = baseColor;
    }

    void Update()
    {
        age += Time.deltaTime;

        // rise upward over time
        transform.position += Vector3.up * riseSpeed * Time.deltaTime;

        // fade alpha from 1 → 0 across the lifetime
        float k = age / lifetime;                 // 0..1
        Color c = baseColor;
        c.a = Mathf.Lerp(1f, 0f, k);
        label.color = c;

        if (age >= lifetime)
            pool.Return(this);                    // recycle instead of Destroy
    }
}

That's a complete, self-contained popup: spawn it at the hit point, it rises and fades, then hands itself back. The only question left is how to spawn them cheaply when a fast weapon is landing five hits a second.

Pooling the Damage Numbers

The naive approach — Instantiate a damage number on every hit and Destroy it when it fades — works, but it hammers the garbage collector. Every Destroy leaves memory to clean up later, and in a busy fight that causes frame hitches. The fix is an object pool: create a batch once, then hand out and recycle the same objects forever.

Here's a compact pool built on Unity's simple queue pattern. (Module 12 covers pooling in depth; this is the practical version you need now.)

using System.Collections.Generic;
using UnityEngine;

public class DamageNumberPool : MonoBehaviour
{
    [SerializeField] DamageNumber prefab;
    [SerializeField] int prewarm = 16;

    readonly Queue<DamageNumber> available = new();

    void Awake()
    {
        for (int i = 0; i < prewarm; i++)
            available.Enqueue(CreateOne());
    }

    DamageNumber CreateOne()
    {
        DamageNumber n = Instantiate(prefab, transform);
        n.gameObject.SetActive(false);
        return n;
    }

    // Spawn a number at a world position.
    public void Spawn(string text, Vector3 worldPos)
    {
        DamageNumber n = available.Count > 0 ? available.Dequeue() : CreateOne();
        n.gameObject.SetActive(true);
        n.Play(text, worldPos, this);
    }

    // Called by a DamageNumber when its lifetime ends.
    public void Return(DamageNumber n)
    {
        n.gameObject.SetActive(false);
        available.Enqueue(n);
    }
}

Now wire it to the health event. When the enemy takes damage, the same OnHealthChanged (or a dedicated OnDamaged(int amount) event) tells the pool to spawn a number above the enemy:

// On the enemy: turn a damage event into a popup
[SerializeField] DamageNumberPool pool;
[SerializeField] Transform popupAnchor;   // a point above the head

void HandleDamaged(int amount)
{
    pool.Spawn(amount.ToString(), popupAnchor.position);
}

💡 Prewarm to taste. Set prewarm to a bit more than the most numbers you expect on screen at once. If the pool ever runs dry it quietly makes one more (the CreateOne() fallback), so you never break — you just lose the pooling benefit for that spike. Size it so that rarely happens.

The full lifecycle of one pooled damage number:

Figure 2: The damage-number spawn/fade lifecycle. Numbers cycle between the pool and the scene — never destroyed, so no GC churn.

Mini-Project: Assemble the Enemy

Time to put it all together into one reusable enemy. Everything below reuses pieces from this module — nothing new to invent.

1. Enemy base: a capsule or your enemy model with a Health component (Lesson 4.3) exposing OnHealthChanged, and an OnDamaged(int) event.
2. Nameplate prefab: a World Space canvas (scale ~0.01), parented above the head, with a name label + Filled health bar + the Nameplate and Billboard scripts. Call SetName("Goblin Scout") on spawn.
3. Damage pool: one DamageNumberPool in the scene, prewarmed, with a DamageNumber prefab (TMP text, world space, Billboard).
4. Wire the events: the nameplate's bar subscribes to OnHealthChanged; the enemy's HandleDamaged calls pool.Spawn on OnDamaged.
5. Test harness: an Input Action that raycasts from the camera (or just a key) to deal, say, 8 damage to whatever enemy you hit.

Press Play, hit an enemy repeatedly, and you should see: the nameplate always facing you, its bar draining, and a stream of "8" numbers rising and fading above the enemy — all without a single frame hitch, because the numbers are pooled.

Extend It

Summary

🚀 What's Next?

That wraps Module 4 — you can now build menus, a pause system, a live HUD, and world-anchored UI. Next we move from a single scene to many. In Lesson 5.1: Loading Scenes — Single, Async & Loading Screens you'll load levels without freezing the game, show a progress bar while they stream in, and set up the scene flow real games ship with.