# 意味を隠さずに不要な動きを減らす

> モーションを減らした設定を使用すると、重要なゲーム情報とわかりやすいフィードバックを維持しながら、より穏やかなプレゼンテーションを提供できます。

- URL: https://oneshotgems.ai/ja/topics/reduced-motion-in-games
- カテゴリ: ゲーム開発者向け
- 種類: ガイド
- 更新日: 2026年10月5日

ブラウザ ゲームには、カメラの動き、画面の揺れ、視差、繰り返しのスケーリング、装飾的なパーティクルが含まれる場合があります。一部のモーションはゲームの重要な状態を伝えますが、他のモーションはプレゼンテーションです。モーションの軽減に関するプレーヤーのオペレーティング システムの設定を尊重し、ヒット、スコアの変更、または方向の手がかりを不明瞭にすることなく、どのエフェクトをトーンダウン、置き換え、または削除できるかを決定します。

## フィードバックと装飾的な演出を分ける

CSSではメディア機能 prefers-reduced-motion を使ってユーザーの設定を検出し、必要に応じてスクリプトで動かす演出にも同じ設定を適用します。たとえば、背景のズームを繰り返す演出は削除しつつ、成功を知らせる短い色やテキストの合図は残します。モーションを減らした結果、必要な情報まで気づかないうちに失われないようにします。プレイヤーが何が変わったか、次に何をすればよいかを理解できるようにしてください。

すべてのアニメーションを機械的に削除しないでください。移動するターゲットはゲームプレイである可能性がありますが、衝突後のカメラの揺れは装飾的な場合があります。位置やタイミングに必要な動きを保持し、可能な場合は別の明確な信号を提供します。 MDN は、この設定では不要な動きを減らすか置き換えることを要求していると説明しています。

## トランジションと反復エフェクトをテストする

メニュー、読み込み、カメラの切り替え、勝敗の表示、長いプレイ中に繰り返す効果まで、体験全体の動きを確認します。CSSアニメーションをひとつ無効にするだけでは、JavaScriptやcanvasで描く動きを制御できない場合があります。すべての描画方法で設定を統一し、プレイ中にシステム設定が変わっても急激な切り替わりを避けてください。

OSのモーション軽減設定を有効にし、プレイヤーが引き続きターゲットの位置を把握し、ヒットを認識し、状態の切り替わりを理解できるか確認します。CSS、スクリプト、canvasの演出をまとめてテストします。MDNはこのメディア機能と、設定が有効な場合に代替スタイルを指定する方法を説明しています。

## よくある質問

**モーションを減らすと、ゲーム内のすべての動きを停止する必要がありますか?** いいえ、プレイしたり状態を伝えたりするには、ある程度の動きが不可欠です。不要なエフェクトを削減または置き換えて、タイミング、場所、フィードバックを理解するための明確な方法を維持します。

**ページはどのように設定を検出するのでしょうか?** CSS は、prefers-reduced-motion メディア機能を使用できます。スクリプトまたはキャンバスの効果には、視覚的なプレゼンテーションの一貫性を保つために、同等の環境設定パスが必要です。

## 気になることを、もっと

- [色だけに頼らず、ゲームの状態を見分けやすくする](https://oneshotgems.ai/ja/topics/accessible-game-colors): コントラストと複数の視覚的な手がかりを組み合わせ、色が似て見える人や色を識別しにくい状況でも、ゲームの状態を区別できるようにします。
- [ブラウザ ゲームに便利なオーディオ コントロールを設計する](https://oneshotgems.ai/ja/topics/game-audio-controls): プレイヤーは明確なミュートとボリュームの動作でゲーム サウンドを制御でき、ゲームの音による合図を妨げずにブラウザの自動再生制限に対処できます。

## 関連情報

- [MDN: prefers-reduced-motion](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/%40media/prefers-reduced-motion)
- [MDN: アクセシビリティのためのメディア クエリ](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Media_queries/Using_for_accessibility)

---
正規ページ: https://oneshotgems.ai/ja/topics/reduced-motion-in-games
