Quick Start
Start with a tiny working version
The first job of a cooldown UI is not to look advanced. It is to answer a simple question fast: can I press this now or not.
Build it in small code pieces
1. 値を用意する
Inspectorで変更できる値と表示先を置きます。
csharp
[SerializeField] private TextMeshProUGUI statusText;
[SerializeField] private float cooldownSeconds = 1f;
[SerializeField] private float remainingSeconds = 2f;
[SerializeField] private float hotbarSlot = 3f;2. 状態を変える
ボタンを押した時に、1つだけ状態を進めます。
csharp
public void NextStep()
{
step = (step + 1) % 3;
var label = step == 0 ? "スキル使用" : step == 1 ? "残り時間表示" : "再使用可能";
if (statusText != null)
{
statusText.text = $"{label}\ncooldownSeconds={cooldownSeconds:0.##}\nremainingSeconds={remainingSeconds:0.##}\nhotbarSlot={hotbarSlot:0.##}";
}3. 画面に表示する
変わった結果を画面に出して確認します。
csharp
if (statusText != null)
{
statusText.text = $"{label}\ncooldownSeconds={cooldownSeconds:0.##}\nremainingSeconds={remainingSeconds:0.##}\nhotbarSlot={hotbarSlot:0.##}";
}
Debug.Log($"クールダウンとホットバー: {label}");Complete script
csharp
using UnityEngine;
using TMPro;
public class CooldownHotbarTutorial : MonoBehaviour
{
[SerializeField] private TextMeshProUGUI statusText;
[SerializeField] private float cooldownSeconds = 1f;
[SerializeField] private float remainingSeconds = 2f;
[SerializeField] private float hotbarSlot = 3f;
private int step;
public void NextStep()
{
step = (step + 1) % 3;
var label = step == 0 ? "スキル使用" : step == 1 ? "残り時間表示" : "再使用可能";
if (statusText != null)
{
statusText.text = $"{label}\ncooldownSeconds={cooldownSeconds:0.##}\nremainingSeconds={remainingSeconds:0.##}\nhotbarSlot={hotbarSlot:0.##}";
}
Debug.Log($"クールダウンとホットバー: {label}");
}
}Inspector
Connect the UI reference in the Inspector, then use the button to confirm each value changes.
Summary
What to take away
A beginner-friendly guide to cooldown readability, hotbar layout, and making skill availability obvious without overloading the screen.
The page is designed to help you move from reading to a small practical decision. Use the checklist above before jumping into the next related article.
Read next
ARTBrowse English articlesReturn to the English article index and choose the next topic by engine, tag, or workflow.CMPCompare game enginesCheck Unity, Unreal Engine, Godot, and Roblox from a beginner-friendly English comparison view.HOMEEnglish learning homeGo back to the English top page for tutorials, glossary entries, news, and learning routes.
Related guides
SYSThreat indicator and aggro readability design guideA practical guide to showing who enemies are targeting and where immediate danger is pointing without flooding the screen.MAPCapture point, overtime, and score visibility design guideA practical guide to making ownership, progress, score flow, and overtime rules easy to read in control-based game modes.