UI、それ自体がプレーヤーに管理を教える

[注 Per。：非標準コントロールのゲームでは、開発者はプレーヤーにすべての機能の使用方法を教える必要があります。 この問題の解決策の1つは、ジューシービーストによって実装されたプレイ可能なUIゲームメニューでした。]



2013年5月、 ToJam gamejamに参加し、3日間でゲームを作成しました。 それで、 トト寺院のオリジナル版が生まれました。



約1年後、そして多くの変更、イベント、さらにはOuyaとのパートナーシップを経て、トトテンプルゲームはより良く洗練されたトトテンプルデラックスに進化しました！

ゲームのルール

まだプレイしていない場合、以下の短いゲームプレイルールがあります。

1. ヤギをつかんで頭の上にドラッグしてポイントを獲得します
2. 3000ポイントを獲得した最初のプレイヤーが勝ちます。
3. ヤギがない場合は、それを盗みます！
4. 現在の飼い主をぐいと動かしてヤギを盗むことができます（これは重要です）

本質的に、これがトト寺院の目的です。 そこにはさらに深みがありますが、他のすべてはプレイヤーが自分で理解する必要があります。 非常に重要な機能の例を次に示します。

1. ジャークはヤギを拾うだけでなく必要です
2. 彼らはあなたが直線でより速く動くことができるので、あなたは素早い動きのためにそれらを使用する必要があります（歩くことはより良いです）

これですべてです。トトテンプルのプレイ方法がわかりました。 それ以来、さらに多くのコンテンツを追加しましたが、基本は同じままです。

UIの最初のコンセプト（gamejamのバージョン）

Toto Temple Deluxeで使用される新しいUIシステムについて説明する前に、どこから始めたのか見てみましょう。 ジャムバージョンの最初の（そして唯一の）メニューは次のとおりです。





すべてが非常に簡単です。 プレーヤーは「A」を押してゲームに参加します。少なくとも2人のプレーヤーがいる場合、「プレススタート」オプションが表示され、ゲームを開始できます。 「カラーピッカー」オプションはありません。 プレーヤーは単に「A」を押すだけで、選択したコントローラーに応じて、自分がどの色になったかを調べます。



最初は色の選択が不足しているように見えますが、特に異なる色の間で動作やスキルに違いはなかったため、ジャム中はそれほど重要ではありませんでした（以下で詳しく説明します）。

イベントへの参加：問題を待つ

2013年11月、トトテンプルのオリジナルバージョンが、トロントの小さな居心地の良いイベントであるゲーマーキャンプに展示されました。









gamejamのバージョンとGamercampに表示されるバージョンの間で、ゲームプレイに多くの変更を加えました。スムーズな制御、ポイントシステムのバランス調整などです。 ただし、UIシステムには変更を加えていません。 壊れていないものを変更する理由



イベント中は、通常、プレイヤーが自分でゲームとコントロールに対処できるようにすることが最善です。 これにより、労力を減らすことができ、ゲーム（またはUI）が高品質のデザインになっていることを示す良い兆候です。



しかし、その時点で、ゲームではほとんどのプレイヤーが「ジャーク」メカニクスの使い方を知らなかったことがわかりました。 口頭での説明の管理と聞き取りに関する短いチュートリアルを「読んだ」後でも、プレーヤーは走り続け、ジャンプし続けました。





私たちは何度も何度も繰り返しました。「ジャークを作るには、Xボタンを押して、ジャークを作りたい方向を押す必要があります。 たとえば、ジャークアップするには、左のジョイスティックと[X]ボタンの「上」を同時に押す必要があります。必要に応じて、上下左右に順番にジャークできます。



私たちが理解した限りでは、プレイヤーはジャークのメカニズムを「ヤギの盗難」に関連付け、それだけに関連付けました。それが主な目標だからです。 彼らは彼らがヤギの飼い主と並ぶのを待っていました。 上で述べたように、ジャークはより速い動きに使用できますが、ほとんどのプレイヤーは考えていません。 技術的な観点からは、これはそれほど悪いことではありません。なぜなら、彼らはゲーム中に自分でこれを行うことを学ばなければならないからです。しかし、この概念を新しいプレイヤーに説明するより良い方法を見つけることができるように思えました。

製図板に戻る

この段階で、ほとんどのプレーヤーが異なる方向へのけいれんに問題があることに気付きました。 ただし、プレイヤーのTotoキャラクターが自動的に左または右に見える場合、この方向にジャークするには、（ジョイスティックを押さずに）Xを押すだけなので、左右にジャークがあると、すべてがほぼ正常になります。



最初は、あまり頻繁にジャークダウンする必要はありません（プレイヤーは、レベルを大きく動かす必要があるときに、より積極的に使用し始めます）。 本当の問題はけいれんしていた。 重力よりもプレイヤーを引き下げるために、レベルを上げる必要があるため、ダウンよりも頻繁にジャークする必要があります。





時間の経過とともに、プレイヤーはジャークが常に役立つことを認識しますが、この重要な詳細を知らずにゲームを楽しむことは困難です。 私たちはそれについて何かをしなければなりませんでした。

キャラクターの選択：最初のレッスン

少し後に、これらすべての新しい情報を収集し、モントリオールで開催されたThe Prince of Arcadeと呼ばれる小さなゲームイベントでToto Templeのデモを行いました。 選手を訓練する方法を改善し、彼らを実際にテストする良い機会でした。



ジャークの問題を解決するために私たちが最初に思いついたのは、メニュー自体にプラットフォーム要素と物理学を追加し、文字通り「A」ボタンを押す代わりにゲームに参加するようにジャークアップすることです。 これは彼らに演奏方法を教えませんが、少なくとも彼らはキーボードショートカットに精通しています。





人々が一晩中ゲームをプレイする様子を観察した後、ほとんどの人がさまざまな方向でけいれんを始めるのに時間がかかっていないことに気付きました。 新しい「再生可能な」メニューには間違いなく効果がありました。



当時は、これが完全に物理的でプレイ可能なUIへの最初の一歩にすぎないことを知りませんでした。

デラックストランスフォーメーション

プレイ可能なメニューをテストした後、すぐにOuyaの素晴らしいメンバーに会い、より大きくてより良いバージョンのゲームを作成するためのパートナーシップ契約を締結することができました。



新しいレベル、新しいモード、選択可能なボーナス、そしてもちろん完全に新しいUIシステムを作成する予定でした。 新しいUIに対してより物理的でプレイ可能なアプローチを選択したため、文字通り「外に出て」、寺院などに似た列を追加することにしました。





新しいビジョンに基づいた最初のバージョンはほとんど同じでしたが、退屈でフラットなボックスの代わりに、キャラクターは外部構造にありました（上記参照）。



今では、背景にキャラクターの大きくて鮮明な画像がありませんでしたので、上に色の彫像を追加して、出入りするプレイヤーのコントラストを高めました。 これにより、画面の上部にスポットライトが作成されます。これは、オン/オフボタンだけに比べて、目で見やすいです。 また、小さな視覚的な「休日」を作成しますが、これは主な目標ではありませんでした。 新参者は、ゲームが彼の参加に満足していることを少し強く感じたはずです！

奇妙な行動

私たちが理解していなかった奇妙な理由のために、多くのプレイヤーはまずゲームを開始するために急な動きをし、すぐにゲームを終了するために急いで動きました。 その後、再びジャークアップ、ジャークダウン。 何度も何度も。



誰かが[スタート]をクリックするまでそうし続け、運がよければ、その瞬間にゲームに参加して次のステージに進みました。 ほとんどの場合、彼らはゲームから外れていたので、私たちは戻って、彼らが入ってくるのを待って、もう一度やり直さなければなりませんでした。



最悪の場合、他のプレイヤーが入るのを待っている間に、1人のプレイヤーが軽率にジャークダウンしてゲームを終了しました。 一体何？



プレイヤーは自分のキャラクターでプレイしてUIに影響を与えることに慣れていないと考えました。 彼らは自分の行動がゲームのパラメーターを変えたことを単に理解していませんでした。





この問題を解決するために、「exit to jerk down to exit」ボタンを削除しました（以下を参照）。 ゲームを終了するには、再び「参加」ボタンを押す必要がありました（つまり、スイッチボタンを備えたシステムを作成しました）。



これにより、奇妙な切り替えが何度も繰り返されるケースを減らすことができましたが、それでも一部のプレイヤーは、トップボタンだけを使用して何度もゲームに出入りすることがありました。 これは問題を完全には解決しませんでしたが、少なくとも彼らは何をすべきかを初めて理解しました。

より多くのコンテンツ、より多くの問題。

新しいキャラクター選択機能は準備が整っていて機能していましたが、新しいデラックスバージョンのコンテンツ（レベル、モードなど）には新しいメニューが必要でした。 正直なところ、プレイ可能なメニューの最初の画面を作成したとき、私たちは本当にそれについて考えませんでした。



設計時には、通常、プロセス全体の視覚的および機能的な整合性を維持するよう努めます。 最初の画面に「ボタン」を用意しなければならなかったため、他の画面にも同じシステムを維持することは非常に理にかなっています。



最初の新しいメニューはレベル選択画面でしたが、その瞬間から事態は少し複雑になりました。



より基本的なレベルでは、プレイ可能なメニューシステムへの移行時に、キャラクターコントロールを除くすべての要素に対して、コントローラーからのほとんどの入力メソッドの使用を禁止しました。 これで、左のジョイスティックの動きがキャラクターを動かしたので、カーソルまたはポインターを使用できませんでした。 ボタンAを押すと、キャラクターがジャンプしたため、アクションの確認に使用できませんでした。 Xを押すのと同じストーリーがありました。これは、キャラクターが画面上の異なるボタンをすばやく押すために使用されたためです。



最初のバージョンではすでにこの問題に遭遇しましたが、ゲームを開始するために「開始」ボタンを使用しました。 これは非常に簡単な修正でした。

レベル選択：さらなる学習

次に、レベル選択画面が必要でした。 Deluxeバージョン5〜6の新しいレベル（または寺院）を作成することを考えたため、それらのいずれかを選択する方法が必要でした。



機能の整合性を維持するために、最初の反復を作成しました。左と右のボタンを使用してレベルを選択しました。





新しい画面のスケッチを作成するとき、「ああ、でもこれはプレイヤーに何か他のものを教える絶好の機会です！」



この画面では、さらに2つの制御の側面を彼に教えることができました。

1. ジャークはアップだけでなく、左右にもできます
2. ボタンが高すぎますか？ その後、プレーヤーは、最初にジャンプしてからグッとくることができると推測します！

アクションの理解をさらに助けるために、プレイヤーの目をキャラクターの初期位置から側面のボタンに移動するための詳細を追加しました。



うまくいったのは次のとおりです。

• 多くのプレイヤーは、デフォルトのレベルを選択するだけで、最初のプレイテストですぐに[スタート]ボタンをクリックすることに気付きました。 初めてプレイするとき、プレイヤーは通常1つのレベルを知らない（そして最初のレベルは他の誰よりも悪くない）ので、これは非常に正常であると判断しました。 彼らは他のレベルがあることに気付いたので、手動で選択できることを理解しました。
• ほとんどのプレイヤーはボタンを認識し、前の画面で行ったようにボタンを押すためにジャンプする必要があることを理解していました。

しかし、うまくいかなかったのは：

• プレイヤーは「ジャンプとジャーク」の組み合わせを理解していましたが、彼らはゲームに慣れていないため、連続して数回ボタンを押すことはほとんどできませんでした。
• 問題は、目があなたが好きなものを選ぶことができるようにレベルの画像を見ようとしたが、同時にボタンを正確に狙うためにキャラクターを見なければならなかったために生じました。 それは奇妙で不快でした。
• 一部のプレイヤーは、ゲームに入るだけでなく、Xボタンを使用できることを理解するのに時間がかかりすぎました（おそらく、コントローラーのXボタンを目で見ていたため、けいれんアニメーションに気付かなかったのでしょう）。

「待ってください。 どのボタン？ 私はここにいる... "、-黄色のプレーヤー



これが私たちがしたことです（上記参照）：

• レベルの選択をより便利にするために、プレイヤーがレベル画像に焦点を合わせて左または右を無造作に動かせるように小さなステップを追加しました。 これで、この画面は連続ジャンプとジャークを教えなくなりましたが、少なくともジャンプ（ボタンに到達するために必要）を教えました-前の画面では必要ありませんでした。
• 画像全体（レベルの総数）が見やすくなるように、1つのサムネイルでレベルアイコンを追加しました。
• 「ジャーク左/右」ヒントを画面の上部中央から移動し、両側に配置しました。 さらに、これらのボタンはそれぞれのボタンに近くなったため、わかりやすくなりました。 また、コントローラー自体のXボタン（この場合、OuyaコントローラーのUボタン）のように、青にしました。
• これは特に問題ではありませんでしたが、ボタン全体の幅を小さくして、ボタンからボタンへの急な動きが少なくなるようにしました。

モード選択：最終試験

追加する最後のメニューはモード選択画面でした。 本質的には非常にシンプルでしたが、その実装は最も難しいことが判明しました。



UI内を移動するアイデアを簡単に説明するために、プレーヤーが3つのメニュー画面を通過する順序を説明します。

1. 何人のプレイヤーが次のステージに進むかを知る必要があるため、キャラクターの選択が最初に行われます。
2. モードの選択が2番目になります。そのため、プレイヤーは最初にこれを望むかどうかをチームですばやく決定できます。 プレイヤーが選択をできるだけ早く実現できるようにしたかったので、プレイヤーはそれを待って覚える必要がありませんでした。
3. レベルの選択は最後になります。 異なるモード用に特別なレベルを作成することにした場合、この段階でモードフィルターは既に選択されています。

UIナビゲーションプロセス全体の初期スケッチ



モード選択画面では、レベル選択画面で行われたように、リストからモードを選択する簡単な方法が必要でした。 明らかな選択はレベル選択画面をコピーすることですが、これは私たちには適切とは思えませんでした（プレイヤーが1つの画面を別の画面とすばやく区別することは難しいなど）。



さらに、できるだけ多くの異なるコントロールを使用したかったので、もう1つの明白な選択肢は、ジャークのリストを（左右ではなく）上下に移動することでした。



上下にボタンを配置すると、画面の準備がほぼ整いました。 それから難しい部分が来ました-チーム選択フィールドの設計を考え出さなければなりませんでした（以下を参照）。





おそらく覚えているように、難点の1つは、ほとんどのコントローラーボタンがキャラクターの移動に既に使用されていたことです。



ジョイスティックで制御されたカーソルのないチームの形成、または「A」ボタンによる確認により、私たちは別の道を歩みました。 物理学の小さな分野しか自由に利用できないため、コントローラボタンを使用する必要のない、理解しやすく構成が簡単なシステムを作成する必要がありました。



上の図からわかるように、チューニングにはもう1つの変数を使用することにしました。フィールドでのキャラクターの位置です。 コンポーネントとその使用方法は次のとおりです。

1. プレイヤーがチームを選択し、「チームゾーン」に入ると自動的に所定の位置に収まるまで、 アバターのブロックがプレイヤーの頭にあります
2. 物理ブロック「VS」は文字通り2つのチームを分離し、チームからチームへの移行をより明確にするための「デッドゾーン」としても使用されます。
3. ジャークダウンボタンはリストを周期的に下にスクロールします
4. コマンドを選択すると、 プレス開始インジケータが表示されます。

この画面には深刻な問題はなかったため、変更はありません。

トレーニングを要約するには

そのため、プレイヤーがゲームに入る前であっても、次のことを（少なくとも無意識のうちに）理解します。

1. 彼は、Xボタンをジョイスティックと同時に使用できることを知っている必要があります。
2. 彼はAがジャンプであることを知らなければならない
3. 彼は、Xが上、左、右を含むさまざまな方向で機能することを知っている必要があります。

プレーヤーは、メニューで何をしていたかをはっきりと覚えていないかもしれませんが、彼の潜在意識のコントロール画像はこのように見えるはずです（以下を参照）。 これらのボタンはすべてゲームに十分なので、これは良いことです！

ゲームのリリース後：プレイヤーからのリクエスト

Toto Temple Deluxeがリリースされ、すでに登場したUIのほとんどを見ました。 リリース後、フォーラム、コメント、ブログなどでプレイヤーとのコミュニケーションを続けました...



ほとんどの場合、2つのコメント（またはリクエスト）を受け取りました。

1. 友達と遊ぶことはできませんが、ゲームにボットを追加できますか？
2. ゲームの始めに自分の色を選びたい！ これはゲームプレイの点では何も変わらないことを知っていますが、[色名]は私のお気に入りの色なので、プレイしたいと思います。

両方の要求は完全に公平であり、これらの機会の実装に関する長い議論とコストの見積もりの​​後、実装のコスト、期間、複雑さが高いにもかかわらず、それらを追加することにしました。 これは私たちにとってあまり賢くないことを知っていますが、私たちはプレイヤーを愛しています。

更新：1つの可能性のために画面を破壊する

ボットの選択と色の選択はどちらもキャラクターの選択と密接に関連しているため、少なくともUIの観点からは、これが問題を引き起こすことがすぐにわかりました。



当時、キャラクター選択メニュー（選択と呼ばれる場合）は、プレイヤーがキャラクターの色を選択するのにあまり適していませんでした。 列ボックスは非常に小さく、ボット選択システムを管理すると、要素の混雑がさらに増加し​​ます。



この画面の完成したUIを保存するために他の解決策を考え出そうとしましたが、どれも効果的、理解可能、または正しいとは思えませんでした。 したがって、ゼロから始めることにしました！





変更点は次のとおりです。

• ゲームに大きな彫像を残しました。 これは変更ではありませんが、私たちは彼らを愛しすぎて、捨てることができませんでした。
• 現在、美しい個々の列の代わりに1つの共通フィールドがあります（それらが失われているため、まだ悲しいです）。
• プレイヤーが自分が誰をコントロールしているのかを知ることができるように、無色のTotoを追加しました。
• ジャークの対応するボタンを押すと、希望の色を選択できます。
• 現在の色は、まだ選択されていない色にのみ変更できます。
• 他人の色を盗むことはできません。
• ボットはまだありませんが、この設計により、たとえば、緑色のキャラクターがボットなどによって制御されるかどうかを決定できます。 「入力」ボタンを「入力」と「ボットとして追加」の2つのボタンに分割しました。 少なくともそれは計画です。

結論：利点と課題

完全に再生可能なUIを作成することは、私たちにとって良い実験でした。 おそらく、彼なしで行うことは可能だったかもしれませんが、彼は新しいプレーヤーを経営陣に紹介することを許可しました。 従来のテキストチュートリアルでも問題ありませんでしたが、ほとんどのプレイヤーは単にそれらを無視し、ゲームを制御する方法を理解するのが困難になります。



明らかに、ゲームで必要な場合、再生可能なUIシステムを作成することは良い動きですが、そのようなシステムには次のような問題があります。



利点：

• プレイヤーは勉強していることにほとんど気づかない
• これは、テキストやステップバイステップのチュートリアルよりもはるかに楽しいです。
• ゲームの仕組みに精通したプレイヤーを支援します

問題点：

• 現在、開発者はコントローラーのすべてのボタンを使用することはできません
• 効率とわかりやすさの良いバランスを見つけるのは困難です。
• どこにでも物理的なボタンを追加することは非常に簡単ですが、すぐにプレイヤーを混乱させ始めます

非常に単純なメカニズムを備えたゲーム、またはメニューがほとんどないゲームは、このようなシステムのメリットをあまり得られません。 一方、プレイ可能なUIは、学習ツールを必要としない場合でも、ゲームへのプレーヤーの関与と全体的な整合性を維持できます。



Alexander BruceとBraid Jonathan Blowの Antichamberのようなゲームを見てください。 プレイヤーを文字通り訓練する必要がないという事実にもかかわらず、どちらにもプレイ可能なメニューがあります。 ただし、関与を維持できるため、プレーヤーはメニューに移動する必要があるたびにゲームの世界から抜け出すことはありません。







もちろん、再生可能なメニューを実装するのに、この方法が最良または唯一の方法であると主張することはありません。 これは、開発プロセスの単なる長い説明です（長すぎて申し訳ありません）。