WWDC Quick Look 💓 By SwiftGGTeam
Design for Game Center

Design for Game Center

元の動画を見る

ハイライト

2020 年に、Game Center にゲーム内アクセス ポイント、透明なダッシュボード、収集可能なカードベースの実績、フレンドの優先順位ランキング、マルチプレイヤー ロビーのデザインが追加され、プレイヤーはゲーム エクスペリエンス内で情報、実績、ランキング、招待操作を完了できるようになります。


主要内容

ゲーム内のソーシャル機能は、分散した入り口の束になる可能性が最も高くなります。プレイヤーが自分の情報、実績の進捗状況、フレンドのランキング、またはマルチプレイヤーの招待を確認したい場合、ゲームは多くの場合、メイン メニュー、設定ページ、およびレベル決済ページに一連のボタンとコピーライティングを作成する必要があります。入り口は一貫性がなく、プレイヤーは Game Center の実際にどのエリアに属しているのかを知るのが困難です。

2020 年の Game Center では、これらのポータルが新しいゲーム内エクスペリエンスに組み込まれます。 Access Point は、プレーヤーのアバターを統合された入り口として使用し、単独で表示することも、実績の進行状況やリーダーボードの位置などのハイライトとともに表示することもできます。プレイヤーはそれをクリックしてダッシュボードに入り、ゲームを終了することなく情報、実績、ランキング、および関連情報を表示します。

この設計セッションの焦点は、インターフェイスの構成と資産仕様にありました。プレーヤーが戻った場所にアクセス ポイントが表示される必要があり、ダッシュボードが表示されるときにゲームは背景アニメーションを一時停止または縮小する必要があり、実績とリーダーボードには識別可能な画像アセットが必要であり、マルチプレーヤー ロビーには明確な入り口が必要です。

映画全体で使用されている公式の例は、The Coast です。これは船を岸から遠ざけるよう誘導するインディーズ ゲームです。 Apple はこれを使用して、ゲーム独自のビジュアル スタイルを維持しながら、メイン メニュー、レベル、実績、リーダーボード、およびマルチプレイヤー ポータルを Game Center に統合する方法を実証しました。

詳細

アクセス ポイント: Game Center をメイン メニューに追加

(01:18) アクセス ポイントは、プレイヤーが Game Center に入場するための統一された入り口です。プレイヤーのアバターを使用します。アバターのみを表示することも、ハイライトと組み合わせて、実績の進捗状況やリーダーボードの位置を明らかにすることもできます。 Apple は、可能であれば左上隅に配置することを推奨していますが、ゲーム UI に応じて任意の隅に配置することができます。

キーポイント:

  • アクセス ポイントはメイン メニューに配置するのに適しています。プレイヤーはゲームに参加する前に Game Center のステータスを確認できます。
  • メイン メニューが適切でない場合は、レベル選択や設定など、プレイヤーが繰り返し戻るインターフェイスにメイン メニューを配置できます。
  • 起動プロセスから注意をそらさないように、スプラッシュ スクリーンとオープニング シネマティックが終了した後にアクセス ポイントを表示します。
  • ゲーム開始後はアクセス ポイントを非表示にし、ゲームプレイとキー コントロール用の画面を残す必要があります。
  • カスタム ポータルでは、Apple Design Resources が提供する Game Center アイコンを使用できますが、アイコンの形状は変更できません。

(02:16) この入り口には安全なエリアを予約する必要があります。 iPhone 11 Pro を例にとると、縦画面の最大アクセス ポイント サイズは 62 x 335 ポイントであり、画面の上部または下部から 114 ポイントを予約することをお勧めします。横画面の最大サイズは 62 x 280 ポイントで、91 ポイントを予約することをお勧めします。その他のデバイスの寸法はヒューマン インターフェイス ガイドラインに基づいています。

ダッシュボードとプロファイル: システム インターフェイスをゲームに適合させる

(04:36) [アクセス ポイント] をクリックすると、プレーヤーにはゲーム センター ダッシュボードが表示されます。これはゲームの上に透明に重ねられ、その背後にあるグラフィックスの色が表示されます。 Apple は、ダッシュボードが開いているときにゲームを一時停止するか、少なくとも目を引く背景のアニメーションを減らすことを推奨しています。

キーポイント:

  • ダッシュボードは横向きと縦向きの画面をサポートし、iOS、iPadOS、macOS、tvOS 上で一貫したエクスペリエンスを維持します。
  • tvOS はブランドのアートワークをダッシュ​​ボードにアップロードできるため、Game Center の入り口がゲームの一部のようになります。
  • tvOS アートワークは TIFF または PNG である必要があり、透明な背景をサポートし、1x のサイズは 923 x 150 ピクセル、2x のサイズは 1846 x 300 ピクセルです。
  • アートワークにはアプリのアイコンを直接使用しないでください。ゲームのロゴやワードマークなどに最適です。
  • ゲームに情報ページに直接移動するボタンがある場合、テキストには Game Center Profile を使用し、Game Center という単語をローカライズしないでください。

(06:09) プロファイルは、ダッシュボードの最初の領域です。プレイヤーは友達、友達の提案、ゲーム間の実績の概要を表示できます。フレンドのリーダーボードやマルチプレイヤー プレイに依存するゲームの場合、プロフィールに直接アクセスすると、プレイヤーがソーシャル コネクションを確立するのに役立ちます。

実績: 実績を収集可能なカードにデザインします

(08:02) Game Center の実績インターフェースが収集可能なカード形式に変更されました。実績は完了とロックに分けられ、標準、プログレッシブ、非表示の 3 つのタイプがサポートされています。標準では、条件が満たされた直後にロックが解除されます。プログレッシブは、目標からどれだけ離れているかを示します。 hidden は、ロックを解除する前に詳細を非表示にします。

キーポイント:

  • プレイヤーが特定のお土産を獲得できるように、各実績には独自の画像が必要です。
  • 実績画像にテキストを配置しないでください。画像は円形に切り取られ、メインコンテンツは中央に配置されます。
  • 実績画像は JPEG、TIFF、PNG をサポートしており、1x は 512 x 512 ピクセル、2x は 1024 x 1024 ピクセルです。
  • ゲームには最大 100 個の実績を含めることができますが、Apple は本当に必要な数だけを入れて、後続のリリースのための余地を残しておくことをお勧めします。
  • タイトルと説明は短くし、実績カードは切り詰められる前に 2 行のみ表示されます。 Apple では、文字数を 30 文字以下にすることを推奨しています。

(10:53) 達成通知は、アクションが完了した瞬間に表示されるのに適しています。 The Coast の例では、プレイヤーがレベルをクリアした直後に通知を表示し、発生したばかりのゲーム アクションに報酬が関連付けられるようにしています。

リーダーボード: 主要なゲームプレイに基づいてリーダーボードを設計します。

(11:56) ランキングはゲームの中核的な仕組みに対応している必要があります。最長距離、金貨の合計、または The Coast のように地理的エリアごとに分割して記録できます。プレイヤーが特定のランキング リストに参加すると、友達との競争を中心としたランキング体験が表示されます。

キーポイント:

  • 各リーダーボードには独立した目を引くアートワークが必要であり、複数のリーダーボードは組み合わせると一連のアセットのように見える必要があります。
  • 一般的なプラットフォームのランキング画像は JPEG、TIFF、PNG をサポートしており、1x は 512 x 512 ピクセル、2x は 1024 x 1024 ピクセルです。
  • tvOS ランキングは 16:9 で、視差効果を生み出すために 1 ~ 3 層のマルチレイヤー画像をサポートします。
  • リーダーボードのタイトルは最大 2 行まで表示されます。 Apple は、文字数を 30 文字以下にし、初期値に大文字を使用することを推奨しています。
  • ゲームにはレベルの開始前またはレベルの確定後にランキング情報を埋め込むことができるため、プレーヤーは重要な瞬間に自分や友達の位置を確認できます。

マルチプレイヤーと App Store: 招待と発見を同じパスに配置する

(15:51) マルチプレイヤー ゲームでは、マルチプレイヤー ロビーを開くためにクリア ボタンが必要です。ロビーが開いたら、プレーヤーはプレーヤー ピッカーを通じて近くのプレーヤー、友達、最近のプレーヤー、連絡先を追加し、[招待して開始] をクリックします。

キーポイント:

  • ロビーが開いているときは、バックグラウンドでの気が散るアニメーションを一時停止する必要があります。
  • ゲームにすでに独自のマルチプレイヤー UI がある場合は、システム UI を使用せずに、Game Center のマルチプレイヤー機能を独自のプロセスに統合できます。
  • App Store はまた、Game Center 情報を使用して、プレーヤーのプロフィール、実績、友人がプレイしているゲーム、製品ページでプレイしている友人を表示します。
  • ゲームが Game Center に接続された後にのみ、これらの App Store のプレースメントが表示される可能性があります。

重要ポイント

  1. メイン メニューでのプレーヤー ステータスの入力: きれいなメイン メニューを作成し、アクセス ポイントを左上隅に配置し、実績の進行状況またはリーダーボードの位置のハイライトと一致させます。このようにして、プレーヤーがゲームを開始すると、最初にゲーム センターのステータスが表示され、次にレベルに入ります。まず、メイン メニュー、設定ページ、オプション ページの UI を確認し、デバイスの向きに応じてアクセス ポイントの最大サイズを予約します。

  2. 実績コレクション: 特定のエリアの完了、特定量の物資の救出、隠しルートのロック解除など、重要なアクションにはそれぞれ独立した実績カードが割り当てられます。漸進的な達成は長期的な目標に適しており、隠れた達成は探索の目標に適しています。 20 個以下のコア実績のリストから始めて、テキストなしで体中心の 512 x 512 および 1024 x 1024 の画像を実績ごとに準備します。

  3. レベル前後のフレンド競争のヒント: レベル開始前にフレンドリスト内のプレイヤーの現在位置が表示され、決済中にフレンドの最高スコアを超えているかどうかが表示されます。このように、ランキング リストはダッシュボードに存在するだけでなく、プレイヤーがスコアを最も気にする瞬間にも表示されます。最初に、ゲームプレイの核となるものを最もよく表すリーダーボードを選択し、次にレベルのテーマを一目で区別できる画像アセットを準備します。

  4. 低干渉マルチプレイヤー ロビー: メイン メニューまたはモード選択ページに透明なマルチプレイヤー ボタンを配置し、Game Center ロビーを開いた後、背景アニメーションを一時停止します。プレイヤーが近くのプレイヤー、友人、最近のプレイヤー、または連絡先を選択する場合、ゲーム シーンの動的な効果によって邪魔されることはありません。最初に、招待プロセスを非戦闘状態にしてから、システム ロビーを使用するかカスタマイズされたマルチプレイヤー インターフェイスを使用するかを決定します。

  5. tvOS 専用の表示アセット: ゲームが Apple TV をサポートしている場合は、ダッシュボード用に水平ロゴまたはワード マークを、リーダーボード用に 16:9 マルチレイヤー画像を用意します。プレーヤーはテレビの画面から遠く離れており、アセットはシンプルでコントラストがあり、メイン コンテンツは端に近づきすぎないようにする必要があります。まずダッシュボードのアートワークとリーダーボードのアートワークを HIG 寸法で確認し、次にフォーカスと視差のトリミングをテストします。

関連セッション

コメント

GitHub Issues · utterances