game-playtest

ゲームプレイテスト

概要

このスキルでは、プレイヤーが体験するのと同じように、起動、入力、シーン遷移、HUD の視認性、表示状態の変化を通じてブラウザーゲームをテストします。プロジェクトが対応している場合は、ブラウザー自動化とスクリーンショットの確認を優先してください。

推奨ワークフロー

1. ゲームを起動し、最初に操作できる画面を確認します。
2. 主な操作を試します。
3. 代表的な状態のスクリーンショットを撮影します。
4. UI レイヤーとレンダリングレイヤーを個別に確認します。
5. 再現手順を添えて、重大度の高い順に所見を報告します。

ツールの活用指針

• リポジトリですでに利用可能な Playwright または同等のブラウザー自動化ツールを優先します。
• ゲームが Canvas または WebGL を多用する場合、DOM のアサーションだけでは視覚的なリグレッションを見落とすため、スクリーンショットの撮影は必須です。
• テキストやレイアウトの正しさだけでなく、プレイフィールドの遮られ方や HUD の占有感を判断するためにスクリーンショットを使います。
• 決定論的な自動化が現実的でない場合は、構造化された手動テストを行い、証拠を記録します。
• 3D レンダリングのバグや原因不明のフレームコストについては、コードだけから推測せず、SpectorJS とブラウザーのパフォーマンスツールを使います。

一般的な確認項目

2D の確認項目

• スプライトの位置合わせとベースラインの一貫性
• 被弾またはダメージアニメーションの視認性
• HUD がプレイフィールドに重なっていないか
• コマンドメニューの状態変化
• タイルやプラットフォームの視認性
• 入力状態のフィードバックとターン状態の明確さ

3D の確認項目

• 初回ロード時にプレイ可能か、ダッシュボードのような表示が目立ちすぎないか
• 常時表示されるオーバーレイの占有感と、プレイフィールドの見やすさ
• カメラ操作とカメラリセットの動作
• メニューやオーバーレイを開いた際のポインターロックまたはドラッグによる視点操作の遷移
• 奥行きの見やすさとシルエットの明瞭さ
• 通常プレイ中にセカンダリパネルを折りたたみ、または閉じられるか
• リサイズ時の動作
• WebGL コンテキスト喪失時やレンダラーのフォールバック時の動作
• マテリアルやライティングのリグレッション
• GLB またはテクスチャのストリーミング停滞
• コリジョンプロキシと物理演算の不一致
• ポストプロセスまたはアセットの読み込みに起因するパフォーマンスの急激な低下

レスポンシブ対応とブラウザーの確認項目

• デスクトップとモバイルのビューポートで問題がないか
• 該当する場合はセーフエリアやノッチの問題
• UI 遷移時の視差効果を減らす設定への対応
• キーボード、ポインター、一時停止状態の処理
• React Three Fiber を使用するプロジェクトでの React の状態とシーンの状態の同期

報告基準

所見から書き始めます。各所見は具体的に記述します。

• ユーザーに何が見えるか
• どのように再現するか
• なぜ重要なのか
• 原因として考えられるサブシステム

参考資料

• 共通アーキテクチャ：../web-game-foundations/SKILL.md
• フロントエンドレビューの確認ポイント：../game-ui-frontend/SKILL.md
• 3D デバッグのメモ：../../references/webgl-debugging-and-performance.md
• 完全なチェックリスト：../../references/playtest-checklist.md