パフォーマンスに関する注記

• 十分な時間をかけて徹底的に行う
• 速さよりも品質を優先する
• 検証ステップをスキップしない

オーディオを追加

既存のゲームに手続き型の音楽とサウンドエフェクトを追加します。BGM は Web Audio API ステップシーケンサーを使用してループパターンを生成します。SFX は Web Audio API を直接使用して真のワンショット再生を実現します。オーディオファイルや npm パッケージは不要です。すべてはブラウザで合成されます。

手順

$ARGUMENTS のゲーム (パスが指定されない場合はカレントディレクトリ) を分析します。

まず、game-audio スキルを読み込んで、完全な Web Audio パターンと統合ガイドを取得します。

ステップ 1: 監査

• src/core/EventBus.js を読んで、どのようなゲームイベントが存在するか確認します (flap, score, death など)
• すべてのシーンファイルを読んでゲームフローを理解します (gameplay, game over)
• ゲームのジャンルと雰囲気に合う音楽と SFX を特定します

ステップ 2: 計画

計画されたオーディオの表を提示します:

イベント / シーン	オーディオ型	スタイル	説明
GameScene	BGM	Chiptune	アップビートな矩形波メロディ + ベース + ドラム
GameOverScene	BGM	落ち込んだ	ゆっくり下降するメロディ
プレイヤーアクション	SFX	レトロ	クイックピッチスイープ
スコア	SFX	レトロ	2 トーンのディング
死亡	SFX	レトロ	下降するつぶされたノート

平易な英語で説明します: 「バックグラウンドミュージックは各シーン中に自動的にループします。サウンドエフェクトはジャンプ、スコア獲得、死亡などのアクション時に再生されます。最初にクリック/タップするとオーディオシステムが起動します (ブラウザは音声再生前にユーザーインタラクションを必要とします)。」

ステップ 3: 実装

1. src/audio/AudioManager.js を作成 — AudioContext 初期化、マスターゲインノード、BGM シーケンサー再生/停止
2. src/audio/AudioBridge.js を作成 — EventBus イベントを AudioManager にワイア (BGM 用) して SFX 関数を直接呼び出す
3. src/audio/music.js を作成して各シーンの BGM パターンを記述 (Web Audio ステップシーケンサー — 連続ループするノート配列)
4. src/audio/sfx.js を作成して各イベント用の SFX を記述 (Web Audio API — OscillatorNode + GainNode + BiquadFilterNode で真のワンショット再生)
5. EventBus.js にオーディオイベントを追加 (存在しない場合) (AUDIO_INIT, MUSIC_GAMEPLAY, MUSIC_GAMEOVER, MUSIC_STOP, AUDIO_TOGGLE_MUTE)
6. main.js で initAudioBridge() をワイア
7. 最初のユーザーインタラクション時に AUDIO_INIT をエミット (ゲームはすぐに開始、メニューなし)
8. シーン遷移時に music イベント、ゲームアクション時に SFX イベントをエミット
9. ミュート切り替え追加 — AUDIO_TOGGLE_MUTE イベント、UI ボタン、M キーショートカット

ステップ 4: 検証

• npm run build を実行してエラーがないか確認
• 作成/変更されたすべてのファイルをリスト表示
• ユーザーに思い出させます: 「クリック/タップして音声を起動し、その後にミュージックが聞こえます」

使用例

完全なオーディオパス

/add-audio examples/flappy-bird

結果: src/audio/AudioManager.js, music.js (gameplay + game-over BGM パターン), sfx.js (flap, score, death, button SFX) を作成 → AudioBridge でワイア → M キーでミュート切り替え。最初のクリックがオーディオを起動します。

トラブルシューティング

音が再生されない

原因: ユーザーインタラクション後に AudioContext が再開されていない (ブラウザのオートプレイポリシー)。 修正: 最初のユーザー入力 (クリック/タップ/キーダウン) で AudioContext.resume() が呼ばれていることを確認します。AUDIO_INIT イベントワイアをチェックします。

オーディオが遅延スパイクを引き起こす

原因: 毎フレーム新しい OscillatorNode を作成している。 修正: SFX はワンショット (作成、接続、開始、停止) である必要があります。BGM は単一のループシーケンサーを使用します。update() でノードを作成しないでください。

次のステップ

ユーザーに伝えます:

ゲームに音楽とサウンドエフェクトが追加されました! 次に、/game-creator:qa-game を実行して、ゲームが正しく起動すること、シーンが正常に遷移すること、スコアリングが機能すること、ビジュアルが壊れていないことを検証する自動テストを追加します。

パイプラインの進行状況: /viral-game → /design-game → /add-audio → /qa-game → /review-game

(これは /viral-game ワンショットパイプラインです — /make-game マルチセッション、マイルストーン駆動ワークフローではありません。)