ゲームルームの設計に関するベスト プラクティス

以下の設計に関するベスト プラクティスは、さまざまなデバイスやプラットフォームで YouTube 上のゲームをプレイするユーザーに最適なエクスペリエンスを提供するために役立ちます。

オペレーティング システムのコンポーネントを除き、ゲームルームのエクスペリエンスは主に次の 3 つのコンポーネントで構成されています。

  • ゲームルームのアクション
  • ゲーム キャンバス
  • メニューとダイアログ

3 つのコンポーネントの位置を示すスクリーン ビュー

ゲーム設計に関する以下のベスト プラクティスは、ゲーム キャンバス用のゲームを構築する方法に関する推奨事項を提供します。

ゲームのサイズ変更

以下のプラクティスを考慮して、ゲームがさまざまな画面サイズや向きに適切に対応できるようにします。

ゲームのサイズを変更し、キャンバスのサイズとアスペクト比に合わせて UI を調整します。

ゲームが全画面表示されない

ゲームがゲーム キャンバスのサイズとアスペクト比に完全に対応できない場合は、ピラーボックスまたはレターボックスを使用します。

スクロールバーをトリガーする

スクロール バーが表示されないようにします。スクロール バーは、ゲームプレイと一般的な操作の両方に悪影響を及ぼします。キャンバス内でゲームをスクロール可能にすることなく、キャンバスを埋めます。スクロール バーは、意図的なスクロール(ゲーム UI 内の長い縦方向のリストをスクロールする場合など)には適しています。理想的には、ゲームはビューポートに完全に対応している必要があります。

ゲームのスケーリング

さまざまな画面解像度で鮮明にレンダリングします(ぼやけたり、ピクセル化されたり、引き伸ばされたりしないようにします)。

低解像度画面(360x800 のモバイル デバイスなど)と高解像度画面(3840x2560 のデスクトップ モニターなど)の両方でレンダリングしたときに、ゲーム UI(テキスト、アイコン)が適切にスケーリングされるようにします。

鮮明なトロフィー アイコンとぼやけたトロフィー アイコンの対照比較

大きな画面に拡大したときにぼやけて見える、低解像度のラスタライズされたアセットを使用することは避けてください。

タイポグラフィ

デバイスや画面サイズに関係なく判読できるようにします。

ボタン、メニュー、吹き出しなど、ゲーム内に表示されるテキストは、さまざまなデバイスや画面サイズで判読できる必要があります。これは、テキストを自動的にスケーリングして調整するか、フォントサイズを調整する設定をユーザーに提供することで実現できます。

テキストが 18 pt より小さい場合、またはテキストが太字で 14 pt より小さい場合は、色のコントラスト比を 4.5:1 以上に設定します。

それ以外のテキストの場合は、色のコントラスト比を 3:1 以上に設定します。

一般的な参考資料については、WCAG2.1 をご覧ください。

判読できるように、十分な太さとコントラストの大きなフォントサイズを使用します。 この例では、コントラスト比は 4.48:1 です。 小さいフォントサイズとコントラストの低い色は避けてください。この例では、 コントラスト比は 3.07:1 です。

インタラクション

このセクションでは、ユーザー インタラクションと関連要素に関するベスト プラクティスについて説明します。

タップ ターゲット

操作しやすくするために、タップ ターゲットを十分な大きさにします。

操作しやすくするために、タップ ターゲットは 48x48 dp 以上とし、ターゲット間に 8 dp 以上のスペースを設けます(マテリアル デザイン ガイドラインを参照)。

この例では、視覚的にレンダリングされたボタンは 24 dp ですが、非表示のタップ ターゲットにはアイコンの周囲に 12 dp が含まれており、48x48 dp のタップ ターゲットを実現しています。

レンダリングされたボタンのサイズを表示します

アイコンとボタンの周囲にパディングを追加して、タップ ターゲットのサイズを大きくします。

ボタン

ボタンの状態ごとに固有のスタイルを使用します。

  • 有効
  • 無効
  • ホバー(タップ以外の入力デバイスの場合)
  • フォーカス
  • 押下状態

階層ごとにボタンを区別することを目指します。たとえば、プライマリ アクション ボタンと セカンダリ アクション ボタン(ボタンに関するGoogle マテリアル 2 デザイン ガイドラインを参照)などです。

さまざまな状態のスタイル ビューを表示する

ボタンの状態ごとに区別される固有のスタイル

キーボード入力

デバイスやユーザーに関係なくゲームのユーザー補助機能を向上させるため、タップ入力とマウス入力に加えて、すべてのゲームプレイ コントロールと画面操作でキーボード入力をサポートします。

キーボード入力をサポートするゲームでは、ユーザーはゲーム内のメニュー とダイアログをEscキーを使用して閉じることができます。これは、視覚的な閉じるボタン(画面の隅にある X アイコンなど)に加えて行われます。モーダルまたはダイアログの一般的な例としては、[設定] メニュー、[一時停止] メニュー、エラー メッセージ、[ヘルプ] 情報のポップアップなどがあります。

デスクトップ ウェブブラウザで全画面モードを終了するために使用されるため、Esc キーの長押しにアクションをマッピングすることは避けてください。

キー押下リスナーが登録されているゲームでは、preventDefault() Esc キーイベントで使用しないでください。Safari で全画面表示にすると、全画面表示を終了せずに、キー押下イベントがゲームによって使用されます。

ハプティクス

必要に応じて、触覚フィードバック(バイブレーション)を使用して、ゲームをより楽しく、没入感のあるものにすることをおすすめします。

ゲームの重要な瞬間

このセクションでは、プレーヤーに優れたエクスペリエンスを提供するゲームの重要な瞬間について説明します。

チュートリアル

新しいプレーヤーを支援するために、簡単なチュートリアルまたはオンボーディング レベルを含めます。

オンボーディングにより、ユーザーはゲームを進めて楽しむための基本的なゲームプレイとゲームの基本を学ぶことができます。

ゲームルームは、ユーザーがすぐにプレイを開始できるように、迅速かつ親しみやすいものにすることを目的としているため、オンボーディングはできるだけ最小限に抑えることを目指します。すべてのゲームにチュートリアルが必要なわけではありませんが、ほとんどのゲームはオンボーディングの形式でメリットが得られます。ゲームを正常にプレイして楽しむためにプレーヤーが知っておくべき重要なメカニズム、ルール、スキルを検討してください。

チュートリアルは次の形式で提供できます。

  • ゲームの開始時の画面セット(または、必要に応じてゲーム全体でコンテキストに応じて表示されるのが理想的です)
  • ユーザーがプレイする実際のチュートリアル レベル

一時停止

ゲームの状態をユーザーに明確に伝えます。

ゲームが一時停止していることと、ゲームを再開する方法をユーザーに明確に伝えます。ゲームがフリーズまたはクラッシュしたと思われるような状況は避けてください。

一時停止ボタンと再開ボタンを表示する

ゲームの状態を「一時停止」と明確にラベル付けし、ゲームを再開するための明確なアクション(ボタン)を提供します。

試合終了

最後のレベルを完了したこと、またはゲームを終了したことをユーザーに伝えます。

ゲームに明確な終了がある場合(レベル数が有限である場合など)、その事実をユーザーに明確に伝えます。これにより、ゲームが壊れている、またはフリーズしていると思われるような状況を回避できます。理想的には、ゲームをクリアしたプレーヤーを祝福し、お祝いします。

音声

ゲームには、効果音、音声、BGM の音量を個別に調整できるコントロールを含めることができます。コントロールは、音量を調整するスライダー、または各音量または両方の音量をミュートする切り替えスイッチで構成できます。

バックグラウンド、SFX、ダイアログの音声設定

ユーザー補助

設計にユーザー補助を組み込むことで、さまざまな能力を持つユーザーがゲームをプレイして楽しむことができます。

ウェブやソフトウェアの設計とは異なり、ゲーム設計に関する業界標準のユーザー補助ガイドラインは存在しません。包括的なゲーム設計に関する追加のガイドラインが記載されている優れたリソースについては、ゲームのユーザー補助ガイドラインをご覧ください。これらのガイドラインをゲームのデザインに適用する方法を検討することをおすすめします。