短い効果音で操作を伝える：成功・失敗・選択の音を作り分ける

BGMより先に「1回の操作への音」を考える

ゲームの音には大きく分けて、雰囲気を作る背景音楽（BGM）と、操作の結果を即座に返す効果音（SE）の2種類がある。制作の初期段階でBGMから着手しがちだが、プレイヤーが「ゲームに反応がない」と感じる原因は、ほとんどの場合BGMの欠如ではなくSEの欠如にある。

効果音が操作フィードバックとして機能するために必要な条件は3つある。①操作の直後（理想は16ms以内）に再生が始まること、②結果の種類（成功か失敗か）と音が対応していること、③短く（0.5秒以下を目安に）終わること。長い音は次の操作と重なってノイズになる。まず「短くて意味のある音」を3種類揃えることを優先し、BGMはその後で検討する順序が実用的だ。

成功・失敗・選択：3種類の音を設計する

ゲーム中の操作結果はほぼすべて「成功」「失敗」「中立な選択」の3カテゴリに分類できる。それぞれに異なる音の特徴を割り当てると、プレイヤーは視覚情報を確認する前に結果を把握できるようになる。

成功音：上昇か明るい倍音で「正解」を示す

ピッチが上がるか、明るい倍音を含む短い音が「良いことが起きた」という感覚を生む。ビープ音なら440Hz（A4）→880Hz（A5）へ0.15秒で上昇させるだけでも機能する。音の長さの目安は0.2〜0.4秒。鋭い立ち上がりと、末尾をゆっくりフェードアウトさせると耳障りが減る。

失敗音：下降か濁った波形で「誤り」を示す

ピッチが下がるか、矩形波（square）やのこぎり波（sawtooth）の倍音が強い音が「失敗」と結びつきやすい。300Hz→150Hzへ0.2秒で降下させる単純な設計でも十分伝わる。成功音より少し長め（0.3〜0.5秒）にすると区別しやすい。ただし不快感が強すぎると離脱の原因になるため、音量は成功音と揃えておく。

選択音：短くフラットに「操作を受け付けた」と伝える

メニュー選択やカーソル移動など、結果が成否ではなく「どれを選んだか」という場面には、ピッチ変化を持たない短い音が適している。0.05〜0.1秒のクリック音またはビープ音1発で十分で、繰り返し鳴ることが多いため音量を成功・失敗音より一段低めに設定するとバランスが取りやすい。

音量の絶対値よりも「3種類の相対的なバランス」が重要。選択音＜失敗音≦成功音という順序を意識すると、繰り返し操作でも耳疲れを抑えられる。

Web Audio APIで音を自作する：コード例と手順

ブラウザゲームでは外部ファイルを用意しなくても、Web Audio APIのOscillatorNodeとGainNodeを組み合わせるだけで効果音を生成できる。以下は説明用のコード例であり、動作確認のためのサンプルとして示す。実際のゲームへの組み込みは、ゲームの構造や使用フレームワークに合わせて調整すること。

まず、AudioContextを作成するヘルパーを用意する。ブラウザのポリシーにより、AudioContextはユーザー操作（クリックやキー入力）をきっかけにしないと音声出力が許可されない場合がある。最初のユーザー操作時にContextを生成し、以降は使い回す設計が基本になる。

// AudioContext は一度だけ生成して使い回す
let ctx = null;
function getCtx() {
  if (!ctx) ctx = new AudioContext();
  return ctx;
}

// 汎用の短音生成関数（説明用サンプル）
function playTone({ startHz, endHz, type = 'sine', duration = 0.3, gain = 0.4 }) {
  const ac = getCtx();
  const osc = ac.createOscillator();
  const vol = ac.createGain();

  osc.type = type;
  osc.frequency.setValueAtTime(startHz, ac.currentTime);
  osc.frequency.linearRampToValueAtTime(endHz, ac.currentTime + duration);

  // 末尾フェードアウト（クリックノイズを防ぐ）
  vol.gain.setValueAtTime(gain, ac.currentTime);
  vol.gain.linearRampToValueAtTime(0.0001, ac.currentTime + duration);

  osc.connect(vol).connect(ac.destination);
  osc.start(ac.currentTime);
  osc.stop(ac.currentTime + duration);
}

// 成功音
function playSuccess() { playTone({ startHz: 440, endHz: 880, type: 'sine', duration: 0.25 }); }

// 失敗音
function playFail() { playTone({ startHz: 300, endHz: 150, type: 'square', duration: 0.35, gain: 0.3 }); }

// 選択音
function playSelect() { playTone({ startHz: 660, endHz: 660, type: 'triangle', duration: 0.08, gain: 0.2 }); }

OscillatorNodeはstartとstopを一度しか呼べない仕様のため、再生のたびに新しいインスタンスを生成している。GainNodeのlinearRampToValueAtTimeで末尾を0に近づける処理は、ブラウザによって発生する「プツ」というクリックノイズを防ぐために重要だ（MDNのWeb Audio API基礎ドキュメントに詳しく解説されている）。

上記のtype・startHz・endHz・durationの4パラメーターを変えるだけで、同じ関数から様々な質感の効果音が作れる。たとえばtype:'sawtooth'にすると昭和のゲームセンター風のブザー音になり、type:'triangle'にすると柔らかいチャイム風になる。

CC0素材を使う場合の権利確認の手順

自作が難しい場合やより高品質な音が必要な場合は、フリー素材サイトの音源を使う選択肢がある。ただしライセンスの種類によって使用条件が異なるため、ダウンロード前に必ず個々のファイルのライセンスを確認する必要がある。

Freesound（freesound.org）はCC0・CC BY・CC BY-NCの3種類のライセンスで音源を提供している。Freesound自身のFAQによると、CC0は作者がすべての権利を放棄したもので帰属表示が不要、CC BYは使用時に元の制作者のクレジット表記が必要、CC BY-NCはクレジット表記に加えて商用利用が不可とされている（Freesound自身は法的アドバイスではないと明記している）。

実際の作業手順は以下のとおりだ。

1. 検索フィルターで「Creative Commons 0」を選択してからキーワード検索する（例：「button click」「coin」「error beep」）。
2. ダウンロードページでライセンス表示を再確認する。検索フィルター後でも個別ファイルのページ記載を必ず読む。
3. CC0以外の素材を使う場合はゲーム内のクレジット画面などに作者名・素材名・ライセンス名を記載する。
4. 使用した素材のURLと確認日をプロジェクト内のメモに残す。ライセンスが変更された場合に備えた記録になる。

権利関係の最終判断は各自で確認すること。この記事はFreesoundのFAQを参照しているが、法的なアドバイスではない。商業利用や大規模配布を予定する場合は専門家に相談することを勧める。

消音でプレイする人への視覚的な代替表現

スマートフォンのマナーモード、公共の場でのプレイ、聴覚に配慮した環境など、効果音が届かない状況は多い。音だけに依存した操作フィードバックはアクセシビリティの観点からも不十分で、音を消した状態でゲームが成立するかを確認することは制作の基本的なチェック項目の一つだ。

視覚的なフィードバックとして使いやすいものを挙げる。

• 色の変化：成功時はボタンや対象要素を一瞬緑や明るい色に変え、失敗時は赤や暗い色に変える。0.2〜0.4秒でもとに戻すアニメーションをつけると「光った」感が出る。
• スケールアニメーション：成功時は要素が一瞬大きくなり元に戻る（1.0→1.1→1.0）。失敗時は左右にわずかに振れる（シェイクアニメーション）。CSSのanimationで実装できる。
• テキスト表示：「+10」「ミス」「OK」などの短い文字を操作位置に一瞬表示して消す。ポイント獲得や残機の変化を伝えるのに向いている。
• パーティクルや光の演出：小さな粒子が散るエフェクトは成功の快感を視覚的に強調する。ただし多用すると重くなるため、特に重要な場面に絞る。

音と視覚の両方を用意する際は「どちらか一方だけでも操作の結果が伝わるか」を基準にする。音を消した状態で自分のゲームを通しプレイし、どこで手応えを見失うかを確認するのが最も確実な検証方法だ。

また、ゲーム内に音量のオン・オフを切り替えるボタンを設置しておくと、プレイヤーが自分の環境に合わせて調整できる。HTMLのcheckbox要素とJavaScriptのglobalMuteフラグを組み合わせるだけで実装できる。

音を組み込む前のチェックと次の一歩

効果音の実装で詰まりやすい点を整理する。

• AudioContextはページ表示時ではなくユーザー操作の中で初期化する。クリック前に再生しようとするとブラウザに無視される。
• 同じ音が短い間隔で複数回鳴る可能性がある場合、前の音が終わらないうちに次を鳴らしても重ならないよう設計する。OscillatorNodeは毎回新しいインスタンスを作るため、自然に重なる（重ねたくなければGainNodeで管理する）。
• スマートフォンのブラウザではWeb Audio APIの挙動がデスクトップと異なる場合がある。実機で動作を確認する。
• 外部の音声ファイルを使う場合はHTMLのaudio要素かAudioBufferSourceNodeで読み込む。AudioBufferSourceNodeは読み込んだデータをメモリに保持するため、短い効果音を繰り返す用途に向いている。

設計の出発点としては、まず「成功音1つ」だけを実装してゲームに組み込み、プレイの感触がどう変わるかを確かめることを勧める。音1つでフィードバックが大幅に改善されることも多く、そこから失敗音・選択音と順番に追加していく方が、過剰な音設計を避けやすい。

「こだまの森」は光と音のこだまを使ったフィードバック設計が体験できる作品だ。効果音の実装を検討しながら、実際に動いているゲームの音の返し方を確認してみると参考になる。

この記事はClaude（Anthropic）が執筆した。掲載のコード例は動作の説明を目的としたサンプルであり、特定の環境での動作検証を経たものではない。Web Audio APIの仕様はMDN Web Docsの公式ドキュメントで確認すること。