ゲームのルール説明の作り方｜チュートリアルと画面の具体例

面白いルールを作ったのに、最初の画面で「何をすればいいの？」と止まってしまう。ゲームを作ると、遊びの面白さと、その入口を伝える難しさが別にあると気づきます。

ルール説明を考えるときは、目的、今する操作、その結果を一組にしてみましょう。この記事では、Takeru Itoが制作しているゲームの公開画面を材料に、説明の設計例を紹介します。

最初に、遊ぶ人が知りたい三つをそろえる

「条件を満たす対象を選択してください」だけだと、対象も条件も画面で探し直す必要があります。最初の場面では、「猫」「数字」「上下左右」「タップ」と、実際に見えている物と動作を結び付けます。

画像はApp Storeの公開紹介画像です。基本ルールと、戻す・やり直す機能は、画面付きの遊び方で詳しく紹介しています。

説明画面の案として、次の短い文章を考えます。

猫の下の数字を見てみよう。
上下左右の猫が、その数字と同じ数になったらタップ。
眠った猫がいなくなると、残りの猫が動くよ。

これはこの記事で考えた文案です。実際のアプリの表示文を引用したものではありません。

最初の盤面を一手で進められる形にして、操作した後の変化を見せる。その後で複数の選択肢を出すと、「押せる猫」と「先に押したい猫」の違いを考える流れを作れます。

最初から例外の猫や、数える方向の違いまで一度に出すと、どのルールが今必要かを選ぶ負担が増えます。新しい条件が初めて必要になる場面で、一つずつ紹介する設計を試してみましょう。

『その場で大喜利』は、お題への回答を出し、ベスト回答を選ぶゲームです。こうした遊びでは、自分の操作だけでなく、今誰の操作を待っているかも関わります。

画像はApp Storeの公開紹介画像です。オンラインで集まる手順や進行は、その場で大喜利の遊び方をご覧ください。

説明を設計するなら、「回答を送った後に何が起きるか」「次へ進めるのは誰か」「まだ入力中の人がいるときはどう見えるか」を、画面の状態ごとに書き出します。ボタンの説明だけでは伝わらない待ち時間も、遊びの流れの一部です。

条件が合わない猫をタップしたとき、ただ反応がなければ、押せなかったのか、タップが届かなかったのか判断しにくくなります。

設計案では、「今、上下左右にいる猫は1匹。数字の2とはまだ合っていないよ」のように、現在の状態と必要な条件を対応させる方法があります。答えの順番そのものを教えるかどうかは、ヒントとは別に決めます。

取り消しや、やり直しの方法も、試す前から見つけられるようにしたいところです。状態を伝えること、操作から戻れること、必要な説明を使う場面に置くことは、Jakob Nielsenのユーザビリティ原則にも関連します。

確認を頼むときは、手順を口頭で先に教えず、最初の画面から触ってもらいます。「分かりましたか？」だけでなく、次の場面を見てみましょう。

止まった場所では、「今、何をしようと思いましたか」と尋ねると、想定と違った読み方が分かります。作り手には当たり前の数字やアイコンでも、初めて見る人には別の意味に見えるかもしれません。

ボタン名、説明文、配置を一度に全部変えると、どれが理解に関わったかを追いにくくなります。まずは一つの迷いに対して、言葉を変える、目印を足す、最初の盤面を変えるなど、修正案を絞ります。

説明を短くすることだけが目的ではありません。初めて遊ぶ人が、次の一手を選ぶために必要な情報を、その場で使える形にすることが目的です。

答えを明かしすぎず助ける設計は、謎解きの3段階ヒントへ。画面全体の構成を考えたい方は、Unityで謎解きアプリを設計する記事もどうぞ。