s.Sakurai NotesA PERSONAL LEARNING LIBRARY

HUD

画面上の情報は数を減らすだけでなく、見える条件と反応を工夫して操作と世界への理解を助ける。

約3分で読む元動画 3:24
HUDの動画サムネイル
桜井政博のゲーム作るには · 15
▶ 元の動画を見る ↗

動画で語られていること

情報表示にも人物らしさを入れる

小さなキャラクターだけでは伝わりにくい個性を、顔の表示で補っている。観戦する人にも情報を届けるため、数値だけでなく人物の認識も助ける。

HUDはプレイ画面へ重ねる情報で、便利な内容を足すほど画面が混みやすい。人物の顔を出すのは識別だけでなく、遠く小さく映るキャラクターの存在感を補うためでもある。数値を伝える場所を、作品の魅力にも使っている。

邪魔になる状況では表示を調整する

対象と重なれば半透明にする、距離や状態でカーソルを隠すなど、必要性に合わせて出し方を変える。便利な情報でも常時同じ強さで置く必要はない。

画面内で情報が必要になる条件は一定ではない。位置が重なると透明にする、識別しにくい距離でだけ名前を出すなど、状況で強弱を変えれば、情報を失わずに画面の邪魔を減らせる。表示する項目数だけではなく、出し続ける条件も設計の対象になる。

状態変化を表示の反応で知らせる

能力を得たときにメーターが変わるなど、UIにもゲーム内の変化を反映する。数値を読ませるだけでなく、見た目の反応で状況と楽しさを伝えられる。

状態を読むだけの固定メーターでなく、能力や破壊に応じた反応を付けると、見た目でも出来事が分かる。表示の変化が操作の結果と結び付けば、分かりやすさと楽しさを同時に増やせる。

自分の仕事で考えてみる

自分の制作に持ち帰る

このサイトの編集者による応用の問いです。

  • 常時表示している情報を一つ選び、必要になる条件と邪魔になる条件を書き出す。
  • 重要な状態変化が数値以外にも伝わるよう、表示の形や反応で補う案を考える。

動画で確かめる

気になる場面から、元動画を見返せます。

出典動画

出典:HUD
桜井政博のゲーム作るには / 元の再生リスト:UI
日本語字幕を資料に、説明・理由・具体例を独自に整理・再構成しました。公式記事ではありません。正確な内容は元動画で確認してください。
読んで、考えたこと

自分のメモ

メモ・読了・お気に入りは、このブラウザだけに保存されます。