WebGL + three.js + Web Audio API をいじる - 簡易シーケンサーを作る

公開:2013-09-17 21:58
更新:2017-07-29 13:17
カテゴリ:webgl,three.js,web audio api,javascript,html5,audio,web 2d shooting game

簡易シーケンサーを作る

なんとなくナムコ風の波形メモリ音源を作ってみている。8音同時発音できるようになったところで、MMLっぽいシーケンサーを作って鳴らしてみた。かなりいい加減なつくりだが、まあまあいい音が鳴るように思う。4ビットで32サンプルというものながら、デチューンとかショートディレイを使うと結構いい音がなるのだ。これはPSGをいい音にする昔ながらのテクニックである。若干プチっているが。。Web Audio APIの機能を使っているので下のテスト画面はChromeでないと動作しない。

タイミング制御はWeb Audio APIの仕組みを使っている。これを使わないとたぶんjavascriptタイマーの精度ではリズムが揺れ揺れになってしまうだろう。「A Tale of Two Clocks - Scheduling Web Audio with Precision」の記事がとても役に立った。ただAudioParamなプロパティは正確なタイミング制御ができるんだけれども、AudioParamでないものについては自前でタイミングを取らないといけない。これをどうするかが課題である。またバックグラウンドだとなんか音がおかしくなるんだよねぇ。フォアグラウンドに戻すと直る。なんでだろうか。。それらを解決・妥協・あきらめて、フロー制御できるようにしたりすればゲーム用としてはいいかなと思っている。

BGMはこれで鳴らすとして、効果音をどのように鳴らそうか。昔のナムコのゲームって効果音も譜面があったんだよね。べーマガの付録についてて、PSGのPLAY文で鳴らすことができた。速いフレーズで音階を上下するとほんと効果音になるんだよね。あとは爆発音やリズム用にノイズ・ジェネレーターを付けるかな。