Xbox アクセシビリティ ガイドライン 102: コントラスト

ゴール

この Xbox アクセシビリティ ガイドライン (XAG) の目的は、視覚要素とその背景の間に十分なコントラストを提供し、これらの要素を視覚の弱いゲーマーが解釈できるようにすることです。

概要

世界には約29億人の人びとが視力の低い人がいます。 ゲームの既定の設定では、多くの場合、背景とのコントラストが強くない UI 要素が発生する可能性があるため、視覚障疳のあるプレイヤーや色覚障疵のあるプレイヤーがこれらの要素を認識して使用することが困難になります。

コントラスト比は、要素の前景と背景の輝度値の差です。 コントラストの構成性のサポートは、障のあるゲーマーが背景に対して画面上の要素の可視性を高めるのに役立つツールとして使用できます。 通常、コントラスト比が "強い" と、要素の可視性が高くなります。 コントラストと可視性が低いためにビジュアル要素を認識できないプレイヤーは、その要素を理解または使用する機能を必要とするゲームプレイの側面から除外される可能性があります。 これにより、最終的にゲームプレイから完全に除外される可能性があります。 たとえば、ゲームプレイに不可欠な情報を提供するが、要素とその背景との間に十分なコントラストを持たない画面上のミニマップを考えてみましょう。 次の目的に移動したり、敵やチェックポイントが存在する場所を特定したり、ミニマップから通知されるその他の重要なタスクを実行したりできない可能性があります。

スコーピングの質問

ゲーム内の重要な視覚的要素は背景に対して表示されますか?

• メニュー UI のテキストとその背景色

• ディスプレイ(HUD)の要素の色（体力メーター、テキスト、ミニマップ要素など）とその背景との対比はどうですか？

• 背景に対する主要なゲームプレイ要素 (たとえば、ターゲット アイコンは灰色で、一般的に暗いゲーム環境の背景に対して識別する必要がありますか)

背景情報と基本情報

コントラストとビジョン

視覚要素とその背景の間で強いコントラスト比を維持すると、視覚障穏のあるプレイヤーに対してこれらの要素の可視性が向上します。 テキストの色とコンテキストの背景のコントラスト比の例を次に示します。 さらに、この例では、コントラスト比が低いテキストがどのように読みにくくなるかをシミュレーションします。これは、プレイヤーが明瞭さに影響を与える低視覚の種類を持っている場合や、直射日光の下でプレイする場合、または遠くでプレイするなどの状況で環境の影響を受ける場合に役立ちます。 シャープネスが低下すると、コントラスト比の強いテキストは、弱いコントラスト比のテキストよりもはるかに表示されます。

また、読みにくいなど、認知障褻を持つプレイヤーは、ハイ コントラストのユーザー インターフェイスのテキストを認識しにくい場合があることに注意することも重要です。 ハイ コントラスト エクスペリエンスは少なくともサポートする必要がある一方で、構成可能なコントラストのオプションにより、より多くのゲーマーのニーズを満たすことができます。

アクセシビリティのためのコントラスト比が重要な領域

テキスト要素とビジュアル要素が、ゲーム エクスペリエンスのすべてのコンテキストを通じて背景に対して強力なコントラスト比を維持することが重要です。 評価する主要な領域の提案を次に示します。

テキスト要素

重要なテキスト要素がゲームで頻繁に見られる場所の詳細な概要については、「XAG 101: テキスト表示」を参照してください。

• メニュー UI のテキスト

• アクティブなゲームプレイ中に画面に表示されるテキスト

• パーティー チャット ウィンドウ内のテキスト (入力フィールド テキスト、プレースホルダー テキスト、送受信メッセージ テキスト)

• 字幕とキャプションのテキスト

• 貴重な情報を提供する読み込み画面のテキスト

• エラー メッセージ、トースト メッセージ、またはその他のタイトル固有の通知に関するテキスト

テキスト以外のビジュアル要素

• 視覚的な手掛かり:

  例 (展開可能)

  ターゲット アイコンなどのゲームプレイ内のテキスト以外の視覚要素や、プレイヤーが撮影される場所に関する方向情報をプレイヤーに中継する "halo" 効果も、一般的に強いコントラストなしでは見にくい領域です。

  

  Fenyx Immortals Risingでは、黒い輪郭を持つ白い方向矢印を使用して、着信攻撃と攻撃の方向をプレイヤーに視覚的に通知します。

  注

  アイコンやその他の重要な要素をターゲットにするための赤と緑の使用は、特定の種類の色覚障瞝を持つプレイヤーにとって困難を引き起こす可能性があります。 色覚異常者向けアクセシビリティのベストプラクティスの詳細については、「XAG 103: 視覚・音声の合図のための追加チャンネル」を参照してください。

• 画面上の HUD 要素 (正常性メーター、方向キュー、マップ要素など):

  例 (展開可能)

  ヘルス メーター、ボーナス メーター、画面上の目標も、プレーヤーに重要な情報を提供します。 これらの要素は、コントラストを評価するときにも調べる必要があります。

  

  外側の世界では、明るい赤と紫のメーターの周りの白い輪郭と、HUD要素の不透明な背景に対する明るい黄色のテキストが、可視性を高めます。

• ボタン、スライダー、およびその他のコントロール:

  例 (展開可能)

  多くのゲームには、プレーヤーを支援するために画面の周辺にミニマップがあります。 これらのマップの要素は、多くの場合、視覚的に区別するのが困難であり、要素とその背景の間の強いコントラスト比の恩恵を受けます。 同様に、サイズに関係なく、ゲームプレイ、テキスト シンボル、マップ画面上に表示されるその他の要素の重要な情報を提供するすべてのマップも、強いコントラストを持つ必要があります。

  

  Forza Horizon 4 では、マップ要素が黒いアウトラインと黒いテキストの下に黄色で塗りつぶされており、マップの他の部分に対するこれらの要素のコントラストと可視性が向上しています。

• 記号またはグリフ:

  例 (展開可能)

  プレーヤーにとって、スライダーやボタンをその背景から明確に区別することが重要です。 スライダータイプの要素は、音量やテキストスケールの調整などのアクセシビリティ設定メニューでよく使用されます。

  

  Minecraft では、スライダータブは薄い灰色で、黒い輪郭が濃い灰色の背景に表示されます。 白い "チャット テキストの不透明度: 79%" テキストは、スライダーの全体的な背景とスライダー自体の両方に対して高いコントラスト比を維持します。

  

  Gears Tactics では、円形のスライダー タブは明るく光る白い円で、背景の濃い青から黒のグラデーションに対するハイ コントラストを維持します。

  シンボル、グリフ、または画像が重要な情報をプレイヤーに伝える場合は、これらの要素を背景と簡単に区別することが重要です。

  

  For Honor のこの例では、チーム シールド内のシンボルは、無地の背景上に配置されています。 白い輪郭は、シンボルが暗い背景 (濃い壁に対するオレンジ色の剣のシンボルなど) に対して表示され続けるのに対し、黒い輪郭は(光の城の背景に対する青い城のシンボルのように)明るい背景に対してシンボルが確実に見えるようにします。

• キャラクターとプラットフォーム

  例 (展開可能)

  キャラクターやその他の重要なゲームプレイ要素の輪郭を描くと、背景に対する要素のコントラスト比を高めるのに役立ちます。 アウトラインに使用する色も構成可能であるか、既定で表示されるすべての背景に対して強力なコントラストを提供する必要があります。

  

  イーグル島では、プレイヤーは設定メニューで背景を暗くすることができます。 100% に淡色表示すると、背景はフォレストの設定から黒い背景に変更されます。 さらに、プレイヤーは "アウトライン文字" と "アウトライン プラットフォーム" を使用できます。これにより、これらの要素の周囲に白い輪郭が追加され、コントラストと可視性がさらに向上します。

  

  この例では、ゲームイーグルアイランドが淡色表示されていない場合の背景を示し、"アウトライン文字" と "アウトライン プラットフォーム" を比較することはできません。

• キー情報を含む画像。

コントラストを測定する方法

要素とその背景のコントラストを測定し、コントラスト比が満たされるようにするために使用できるツールは多数あります。

コントラスト測定ツール:

1. Windows 用 Accessibility Insights

2. パシエログループ別カラーコントラストアナライザー

Windows 向けアクセシビリティ インサイト: コントラスト ビデオの測定

コントラストを改善するための一般的なアプローチ

できるだけ多くのプレイヤーがテキストにアクセスできるようにするための最善のアプローチは、プレイヤーのニーズに最適な UI を構成するための選択肢をプレイヤーに提供することです。

多くの場合、ゲームプレイ環境は一定の視覚的な流れであり、テキスト、シンボル、視覚的な手掛かりなどの画面要素では、すべてのゲームプレイ シナリオで常にコントラスト比を満たしていません。

コントラストを高めるのに役立つ一般的なアプローチをいくつか次に示します。

• プレイヤーに、画面上のテキストの背後にしっかりした背景を置く、またはその背景の不透明度を調整するオプションを提供します。

• 画面上のテキストと要素の色オプションを提供して、最も見やすい色を選択できるようにします。

• ゲームのさまざまな側面でハイ コントラスト モードをサポートします。

• テキストまたは要素の周囲に罫線を追加します。

テキスト チャットの背景の不透明度ビデオ

Minecraft では、プレイヤーはテキスト チャットの背景の不透明度を調整できます。

フォールアウト:ニューベガスでは、プレイヤーがHUDの色を変更することができます。

実装ガイドライン

より多くのプレイヤーのアクセシビリティニーズを満たすために、ゲームがコントラスト設定の最小構成性を確実に提供するためのガイドラインをいくつか示します。

• 大きなテキストおよび大きなな視覚要素は、背景に対して 3:1 の最小コントラストを満たす必要があります。

  • コンソールでは、大きなテキストは次のように定義されます。

    • 1080p で 52 px

    • 4K で 104 px

  • PC/VR では、大きなテキストは次のように定義されます。

    • 1080p で 36 px

    • 4K で 72 px

  • モバイル/Xbox ゲーム ストリーミングでは、大きなテキストは次のように定義されます。

    • 100 DPI で 36 ピクセル

    • 200 DPI で 72 px

    • 400 DPI で 144 px

    • DPI の増加に応じて直線的にスケーリングする

• ゲームプレイの重要な情報またはコンテキストを提供する標準サイズのテキストおよび視覚要素 (大規模とは見なされないもの) は、背景に対してのコントラスト比が少なくとも 4.5:1 である必要があります。

• 非アクティブな要素のテキストは、背景に対して 3:1 の最小コントラスト比を満たす必要があります。

  • 非アクティブな要素には、シンボル、グリフ、または UI 内に表示されるその他のビジュアル要素内のテキストを含めることができますが、次のようなシナリオのために対話することはできません。
    • プレイヤーがまだ非アクティブな要素に関連付けられているゲーム領域、アイテム、またはオプションのロックを解除していない
    • プレーヤーのソフトウェアまたはハードウェアの技術仕様と非アクティブなオプションの要件との間の互換性がないため、オプションまたはビジュアル要素が無効になっています
    • そのプレイヤー固有の状況により、UI 内に存在するビジュアル要素を操作できないその他のシナリオ
  例 (展開可能)

  

  これは非アクティブなテキストの例ではありませんが、Fenyx Immortals Rising では、ロックが解除されていないゲーム内の要素は、その上にロック アイコンが付いた明るい赤色で表示され、ゲーム環境内で視覚的に目立ちます。

  

  ビデオのリンク: 非アクティブな要素の説明

  Sea of Thieves ストアでは、プレイヤーが個別に購入できないアイテムにフォーカスを移動すると、アイテムの上に "バンドルのみ" という単語が重ねて表示されます。 "バンドルのみ" テキストは、最小の 3:1 コントラスト比を満たしています。

• プレースホルダー テキスト、または入力フィールドに入力されたテキストは、入力フィールドの背景に対する最小コントラスト比 4.5:1 (大きなテキストの場合は 3:1) を満たす必要があります。

  例 (展開可能)

  

  ドラゴンクエストXI 過ぎ去りし時を求めて S では、キャラクター名が何文字にできるかをプレイヤーに知らせるプレースホルダーのスターアイコンが、4.5:1 のコントラスト比に適合しています。

• ハイ コントラスト モード (明るい、暗い、またはその両方のいずれか) を指定する必要があります。 有効化された場合、UI 要素の背景へのコントラスト比は 7:1 以上にする必要があります。

  例 (展開可能)

  

  ゲーム Hyperdot は、暗いモードと明るいハイ コントラスト モードの両方を備えています。 このモードを有効にすると、表示されるすべての視覚要素の背景に対するコントラスト比が 7:1 になります。

コントラスト比サマリー チャート

• 単色ではない背景の上にテキストが表示される場合は、テキスト コントラスト比率は、テキストと背景の最もコントラストの低い領域で計測します。

  例 (展開可能)

  

  Sea of Thieves には、テキストの背後に明るい色と濃いターコイズのパッチがあります。 コントラスト測定を行う場合は、背景色に 2 つのターコイズ色の明るい色を使用する必要があります。

• 使用可能な場合は、プラットフォームで提供されるコントラスト設定を読んで、ゲーム起動時にハイ コントラスト モードを既定でオンまたはオフにするかどうかを判断し、それに応じてゲーム UI を調整します。

  例 (展開可能)

  ゲームがシステムのプラットフォーム設定を読み取ることができる場合は、ゲームの初回起動時に自動的に適用されます。 プレイヤーがシステムレベルまたはプラットフォームレベルでハイコントラストモードを有効にしていて、ゲームもハイコントラストモードを提供している場合は、プレイヤーがゲーム設定を再構成するまでゲーム起動時に有効にする必要があります。 この例では、プレイヤーのシステム設定でハイ コントラスト モードが有効になっています。 Microsoft ソリティアを開くと、ゲームのハイ コントラスト バージョンも開きます。

  標準ゲーム モード

  

  ハイ コントラスト モード

  

• 前景と背景のテキストの色は、プレーヤーによって構成/設定できます。

• 情報を伝えるために色だけに頼らないようにしてください。 これが不可能な場合は、プレイヤーに主要なゲーム要素の色を選択するオプションを提供します。

  例 (展開可能)

  

  「Battlefield 2042」の「アクセシビリティ」メニューには、HUDアイコンの色をカスタマイズするための色分けオプションがあります。 オプションは、2 次近視、三極近視、プロタ近視、カスタム用です。 カスタム オプションを使用すると、プレイヤーはニーズに最も合わせて特定の色と色合いを選択できます。 ゲーム内のプレイヤーが選択した色をシャドウ、ミッドトーン、明るいゲーム環境で表示するプレビューも提供されます。

• ロゴタイプを除き、画像にテキストを含めることはできません。

  例 (展開可能)

  画像ファイルにはテキストを含めないでください。静止画像ファイル内にある場合、テキストとその背景をコントラスト比を満たすように調整できないためです。

  

  Gears 5 のこの例では、背景イメージの一部ではなく、"Versus" テキストと下の文記述子はテキスト要素です。 テキストは、画像の上にオーバーレイできる独自の UI 要素である必要があります。理想的には、テキストの背後に半不透明な背景から不透明な背景を配置してコントラスト比を高めることができます。 テキストは画像自体の一部にすることはできません。 これは、画面ナレーションの互換性を確保するのに役立ちます。

• ロゴまたはブランド名の一部であるテキストまたはビジュアル要素には、コントラストの最小要件はありません。

  例 (展開可能)

  メニュー画面のゲーム タイトルのロゴなどのロゴタイプは、コントラスト比をテストする必要はありません。

  

  Age of Empires II のこの例では、メニューの上部にある "Age of Empires II" テキストは、ゲームのロゴの一部であるため、コントラスト要件を満たすことはできません。

• 純粋な装飾、誰にも表示されない、または重要な他のビジュアル コンテンツを含む画像の一部であるテキストまたはビジュアル要素には、コントラストの要件はありません。

  例 (展開可能)

  純粋に装飾的であり、プレイヤーに重要な情報を提供しない画像や要素については、コントラスト比をテストする必要はありません。

  

  この Gears 5 Versus メニュー画面では、強調表示された要素は純粋に装飾されています。 ページへの彼らの唯一の貢献は純粋に美的です。 したがって、コントラスト ガイドラインの対象になりません。

  注

  この画像は、画面の右上に緑色の四角形のインジケーターを含むように編集され、画面の下部中央に 2 つの矢印が表示され、この例で参照されている装飾的な画像が強調表示されています。 これらの緑色の要素は Gears 5 UI の一部ではありません。

プレイヤーへの影響の可能性

この XAG のガイドラインは、次のプレイヤーの障壁を減らすのに役立ちます。

リソースとツール