本文へスキップ
UI Design

A beginner guide to objective markers and minimaps

How to use objective markers, minimaps, and guidance UI without removing exploration or overwhelming beginners.

公開日: 2026-06-27#Objective Markers#Minimap#Guidance#Beginner

Quick Start

Start with a tiny working version

Good guidance UI does not dump more information onto the screen. It helps the player understand one next step.

Build it in small code pieces

1. 値を用意する

Inspectorで変更できる値と表示先を置きます。

ObjectiveMarkerTutorial.cs
csharp
    [SerializeField] private TextMeshProUGUI statusText;
    [SerializeField] private float targetDistance = 1f;
    [SerializeField] private float markerAngle = 2f;
    [SerializeField] private float minimapZoom = 3f;

2. 状態を変える

ボタンを押した時に、1つだけ状態を進めます。

ObjectiveMarkerTutorial.cs
csharp
    public void NextStep()
    {
        step = (step + 1) % 3;
        var label = step == 0 ? "目的地を登録" : step == 1 ? "画面端に示す" : "ミニマップへ出す";
        if (statusText != null)
        {
            statusText.text = $"{label}\ntargetDistance={targetDistance:0.##}\nmarkerAngle={markerAngle:0.##}\nminimapZoom={minimapZoom:0.##}";
        }

3. 画面に表示する

変わった結果を画面に出して確認します。

ObjectiveMarkerTutorial.cs
csharp
        if (statusText != null)
        {
            statusText.text = $"{label}\ntargetDistance={targetDistance:0.##}\nmarkerAngle={markerAngle:0.##}\nminimapZoom={minimapZoom:0.##}";
        }
        Debug.Log($"目標表示とミニマップ: {label}");

Complete script

ObjectiveMarkerTutorial.cs
csharp
using UnityEngine;
using TMPro;

public class ObjectiveMarkerTutorial : MonoBehaviour
{
    [SerializeField] private TextMeshProUGUI statusText;
    [SerializeField] private float targetDistance = 1f;
    [SerializeField] private float markerAngle = 2f;
    [SerializeField] private float minimapZoom = 3f;

    private int step;

    public void NextStep()
    {
        step = (step + 1) % 3;
        var label = step == 0 ? "目的地を登録" : step == 1 ? "画面端に示す" : "ミニマップへ出す";
        if (statusText != null)
        {
            statusText.text = $"{label}\ntargetDistance={targetDistance:0.##}\nmarkerAngle={markerAngle:0.##}\nminimapZoom={minimapZoom: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

How to use objective markers, minimaps, and guidance UI without removing exploration or overwhelming beginners.

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.

Related guides

SYSNPC Interaction Prompt Design BasicsA beginner-friendly guide to talk prompts, inspect prompts, and interaction readability that helps exploration stay clear without turning the screen into icon noise.MAPThreat indicator and aggro readability design guideA practical guide to showing who enemies are targeting and where immediate danger is pointing without flooding the screen.