BiquadFilter でフィルタを使いこなす

Web Audio API の BiquadFilterNode は、音色を加工する基本ツールです。「ローパス」「ハイパス」「バンドパス」など、シンセサイザーやエフェクター制作で必須のフィルタタイプを1つのノードで扱えます。この記事では、それぞれのフィルタタイプの効果と、レゾナンス（Q値）の使い方を中心に解説します。

BiquadFilterNode の基本

BiquadFilter は「二次フィルタ」とも呼ばれ、IIR（無限インパルス応答）型のフィルタです。Web Audio では以下のように作ります。

const filter = audioCtx.createBiquadFilter();
filter.type = 'lowpass';            // フィルタタイプ
filter.frequency.value = 1000;       // カットオフ周波数 (Hz)
filter.Q.value = 1;                  // レゾナンス
filter.gain.value = 0;               // ゲイン (peaking/shelving のみ)

音源 → フィルタ → 出力の流れで接続します。

osc.connect(filter).connect(audioCtx.destination);

主要フィルタタイプ8種

1. lowpass — 高域カット

カットオフ周波数より高い成分を弱める。最もよく使われるフィルタ。

用途: シンセベース、暖かい音色を作る、不快な高域ノイズを除去
音色イメージ: 明るい音を「丸める」

2. highpass — 低域カット

カットオフ周波数より低い成分を弱める。

用途: モコモコ感を取る、サブベースの音量整理、ハイハットを「シャッ」とさせる
音色イメージ: 音を「軽く」「シャープに」

3. bandpass — 帯域通過

指定した周波数帯だけ通す。両端を切り落とす。

用途: 電話風エフェクト、特定楽器の存在感調整、スネアドラム合成
音色イメージ: 「ボックスに入れた音」「コンパクトな音」

4. lowshelf — 低域のレベル調整

カットオフ周波数より低い成分を gain dB 分だけブースト/カット。

用途: 低音域のイコライザ、暖かさの追加
典型値: cutoff 100Hz, gain +3〜+6dB

5. highshelf — 高域のレベル調整

highpass の「カット量を調整可能版」。lowshelf の高域版。

6. peaking — ピーク型イコライザ

指定周波数を中心に山型/谷型のブースト/カット。最も柔軟な EQ タイプ。

用途: ボーカルの抜けを良くする、楽器ごとの帯域整理

7. notch — 帯域阻止

指定周波数だけを大きく削る。バンドパスの逆。

用途: 50Hz/60Hz の電源ハム除去、不快な共鳴の除去

8. allpass — 位相だけ変える

振幅は変わらないが、位相だけが変化。フェイザーやコーラスの実装に使う。

Q 値 — フィルタの「鳴き」

BiquadFilter で最も「音色のキャラクター」を左右するのが Q 値（レゾナンス）です。

Q 値	効果
0.5 〜 1	緩やかなカーブ、自然
1 〜 5	カットオフ付近が少し強調される
5 〜 15	「キュッ」とした鳴き、シンセ的
15 以上	自己発振寸前、TB-303 アシッド系

典型的な「アシッドベース」のサウンドは Q=8〜12 のローパスで作れます。

filter.type = 'lowpass';
filter.frequency.value = 400;
filter.Q.value = 10; // 強いレゾナンス

フィルタエンベロープ — TB-303 風のサウンド

フィルタは固定値で使うより、エンベロープで時間変化させたほうが圧倒的にカッコ良くなります。

const filter = audioCtx.createBiquadFilter();
filter.type = 'lowpass';
filter.Q.value = 10;

function triggerFilter(audioCtx, filter) {
  const now = audioCtx.currentTime;
  filter.frequency.cancelScheduledValues(now);
  filter.frequency.setValueAtTime(2000, now);                    // Attack高さ
  filter.frequency.exponentialRampToValueAtTime(200, now + 0.4); // Sustain低さ
}

これだけで「ニュッ」と鳴くアシッドベースが完成します。

LFO で揺らす — ワブルベース

フィルタの cutoff を LFO（低周波オシレータ）で揺らすと、ダブステップ系の「ワブルベース」になります。

// LFO 用のオシレータ
const lfo = audioCtx.createOscillator();
lfo.frequency.value = 4; // 4Hz の揺らぎ
const lfoGain = audioCtx.createGain();
lfoGain.gain.value = 800;       // 揺れ幅 (Hz)

// メインフィルタ
const filter = audioCtx.createBiquadFilter();
filter.type = 'lowpass';
filter.frequency.value = 600;
filter.Q.value = 12;

// LFO → filter.frequency
lfo.connect(lfoGain).connect(filter.frequency);
lfo.start();

このパターンは「audio rate signal を AudioParam に接続する」というWeb Audio の重要な機能で、シンセ実装の幅が一気に広がります。

複数フィルタの直列・並列接続

直列: カーブを急峻に

BiquadFilter1つだけだと -12dB/oct（オクターブごとに-12dB減衰）の傾きですが、2つ直列で -24dB/oct になります。

osc.connect(filter1).connect(filter2).connect(audioCtx.destination);

並列: 周波数別のミックス

lowpass と highpass を並列に通せば、「低域は丸めて高域はシャープ」など、独自のEQが作れます。

計算量の目安

BiquadFilter は IIR 型で計算量が少なく、1ノードあたり数フロップで処理できます。複数並列して使ってもCPUへの影響はほぼ無視できる程度です。

使い分けクイックガイド

シンセベース → lowpass + Q=6〜10 + cutoff エンベロープ

ストリングス系 → lowshelf で低域少し追加 + highshelf で高域少し追加

電話風エフェクト → bandpass (400Hz, Q=2)

ハム除去 → notch (50 or 60Hz, Q=高め)

ハイハットを際立たせる → highpass (7kHz, Q=0.7)

ボーカル抜き出し → peaking (2kHz, gain +3dB)

まとめ

BiquadFilter は Web Audio で最も活用範囲の広いノードのひとつです。波形（Oscillator）で「素材」を作り、フィルタで「形状」を整えるという考え方ができれば、シンセ音作りの大半は理解できたと言えます。Q 値の魔法、エンベロープの動き、LFO による揺らぎ — この3つを組み合わせることで、ブラウザだけで本格的なシンセサウンドが作れます。