本文へスキップ
ゲームUI設計

ダメージ数値を読みやすくするゲームUI設計ガイド

通常攻撃、クリティカル、継続ダメージ、回復量が同時に出る場面でも混乱しない、ダメージ数値の見せ方を整理する実践ガイドです。

公開日: 2026-07-05#Unity#Damage Numbers#UI Design#Combat Feedback#Beginner
+
*
+
ココ先生・喜ぶ
ココ先生
ゲーム開発の案内役
この記事では クリティカル数値演出 を、読んで終わりにせず、CriticalDamageNumberDemo の小さな実装イメージまでつなげて案内します。
+
*
+
はじめちゃん・笑う
はじめちゃん
ゲームエンジン学習中
ダメージ数値を読みやすくするゲームUI設計ガイド を読む前に、まずUnity のどこを見ればよいかを確認したいです。
ココ先生
今日は「クリティカル数値演出」を、まず何が変わるのか、次に画面で何を見せるのか、最後にどの値を確認するのか、という順番で読んでいきます。
はじめちゃん
大きなテーマに見えますが、今日は「CriticalDamageNumberDemo」という小さな練習用の場面だけを作るのですね。何から始めればよいか分かりました。
ココ先生
通常ダメージを表示、Damage Buttonで進める、クリティカルを確認の流れを追えば、記事の内容を自分のプロジェクトへ移しやすくなります。
読みやすいダメージ数値、表示位置、視認性ガイドを描いたヒーロー画像
完成イメージ

クリティカル数値演出の状態を分ける

通常ダメージ、クリティカル、強調表示 を別々の状態として扱い、今どの段階かを画面で確認できるようにします。

特別な一撃かをUIで伝える

Console だけではプレイヤーには見えません。TextMeshPro や Slider に damageValue / criticalRate / popupScale を出して、判断材料を画面へ移します。

最小実装から広げる

まず CriticalDamageNumberDemo を動かし、その後に本物の入力、通信、戦闘、保存処理などへ置き換えると、原因を見失いにくくなります。

導入

数字が重なりすぎないよう、同じ敵へ出るダメージを横へ少しずつずらします。読める場所へ数字を並べる実装です。

作るもの

DamageText Prefab と DamageNumberLayout を敵へ付けます。

最初の実装

[SerializeField] DamageNumber prefab; // 表示する数字のPrefab
int index;
public void Show(int value){var n=Instantiate(prefab,transform.position+Vector3.up*2,Quaternion.identity);n.transform.position+=Vector3.right*(index++%3)*.25f;n.Set(value);}

動きをつなぐ

public void Set(int value){label.text=value.ToString();Destroy(gameObject,.8f);}

完成版

using UnityEngine;using TMPro;public class DamageNumberLayout:MonoBehaviour{[SerializeField]DamageNumber prefab;int index;public void Show(int value){var n=Instantiate(prefab,transform.position+Vector3.up*2,Quaternion.identity);n.transform.position+=Vector3.right*(index++%3)*.25f;n.Set(value);}}public class DamageNumber:MonoBehaviour{[SerializeField]TMP_Text label;public void Set(int value){label.text=value.ToString();Destroy(gameObject,.8f);}}
はじめちゃん
最後に整理すると、クリティカル数値演出でいちばん見失いやすい所はどこですか?
ココ先生
内部処理だけを追って、画面で伝える言葉を後回しにする所です。CriticalDamageNumberDemoでは、まずプレイヤーに見える変化を先に決めます。
はじめちゃん
流れは「通常ダメージを表示」から始めて、「Damage Buttonで進める」で操作を入れる、と覚えればよいですか?
ココ先生
その通りです。その後に「クリティカルを確認」で途中状態を見て、「強調表示で結果を見る」で結果を確認します。順番を固定すると、失敗した場所も見つけやすくなります。
はじめちゃん
つまり、いきなり完成システムにせず、状態名、表示、値の変化を小さくそろえるのですね。
ココ先生
はい。最後は「クリティカル数値演出をわかりやすく考える」の考え方で、難しい処理をプレイヤーに伝わる短い合図へ置き換えられるか確認しましょう。
この記事のまとめを案内するガイドキャラクター

この記事のまとめ

通常攻撃、クリティカル、継続ダメージ、回復量が同時に出る場面でも混乱しない、ダメージ数値の見せ方を整理する実践ガイドです。

大きな違いを生むのは、派手な性能よりも 毎日触れる環境を無理なく整えること です。見やすい画面と使いやすい道具がそろうと、学習や次の一歩を決めやすくなります。