Tone.jsでシンセサイザーの音作りができるシンセジェネレーターを作りました。シンセサイザーの音の作り方を理解したい&Tone.jsでシンセサイザーの音作りがどこまでできるのかを検証する目的です。当初思い描いていたものは一通り実現できました！
【目次】
作ったもの
- VCO（3OSC + Noise）、VCF、VCA、3EG、3LFO、Effectorのシンセサイザー
- Tone.jsのシンセ機能でブラウザのみでシンセ音を出すことができる
- パラメーターをどのように変えたらどういう音が出るかを調べることができる
コード
リポジトリ
- Tone.js（Web Audio API）の情報は少なく、Tone.jsのドキュメントは体系的ではなく網羅的で結構難産だった
- ChatGPTにもいろいろ質問しながら進めた。解決やヒントになった回答も多いが間違った回答も結構あった
- EG、LFOなおを個別に設定するためにSynthではなくOscilatorを大元の音源にした
- そこからアナログシンセサイザーの仕組みを再現するためにFilter、Gain、Envelope、LFOなどに接続した
- 接続に重要なのはconnectでconnectの流れ&繋ぎ方を理解することが重要とわかった
- そして一番最後に音を出したい箇所でtoDestination()を実行するとそこでの結果を聞くことができる
- 最終的にシンセサイザーの音をTone.jsだけでも実現することができた
検討したこと、手こずったこと ※イシュー：Issues · ryo-i/synth-generator · GitHub
今回の経験を元に来年以降、電子音も凝ったコンテンツを作っていく所存です！
参考文献
昔、電子音楽をやろうとして買ってみた本、今回の経験で当時よりも理解が進みました♪
- シンセサイザー入門 音作りが分かるシンセの教科書（松前公高, 2007）
- エンジニア直伝！エフェクト・テクニック基礎講座（2004）
