Web楽器のプラグイン規格を作りました

Web Music Developers JPのアドベントカレンダー 13日目の記事です。

現在Web上でDAWを作ろうとするといくつか壁がありますが、まずはVSTのような規格が欲しいですよね。そこで試しにWeb楽器向けのプラグイン規格をつくってWebWorker上で動かしてみたらうまくいったので、規格の仕様と実験ページを公開します。

規格はAudio Script Interface(以下ASI)と呼ぶことにして話を進めます。

どんな規格?

ASIはJavascript上ならどこでも動作すること、ホスト側でGUIやAudioAPIのインターフェースを吸収することを目的としています。今回はWebWorker上で動作させていますが、ASI規格自体はWebWorkerのインターフェースに依存させないように配慮しています。

規格があると

  • 開発者は音源を合成するエンジンの開発に集中できる
  • 利用者はASI規格の楽器を組み合わせて使うことが容易になる
  • Javascriptが動けばどこでも動かせる

などなど便利なことが多々あります。将来的にはnode.js上で音源データを作成したり、Windows8のMetroアプリ上で楽器の演奏がたらいいなぁ、とか思っています。

逆にデメリットはというと、

  • 思い通りのGUIコントロールパネルが作れない
  • ホストがないと動かない

そのうち問題はいっぱい出てくると思いますが、今はこんなところでしょうか。

実験サイト

規格考えましたっていうだけじゃ面白くないので、ConnectSynth という実験サイトを作りました。Web Audio API対応ブラウザ(ChromeSafari)を推奨しますが、Audio Data APIにも対応してあります。

何はともあれデモです。ソースコードこちら

このサイトで以下のようなことが出来ます。

  • プラグインのファイルをサーバーにアップして起動
  • プリセットの保存
  • ソースコードの編集
  • 人が公開したプラグインを自分の作業領域にコピーして編集(Fork)
  • WebMidiLink に対応

Twitterアカウントでログインすれば、テストや公開も可能なので良かったら試してみてください。仕様はサイトにまとめてあります。ただし説明書がありません(汗)。なんとなく使えると思いますが、、作っておきます。

プラグインがどうやって動作しているのかも簡単にまとめました。

  • ホストの動作
    • プラグインをWebWorker上でimportScripts(“main.js”)する
    • プラグインから取得したGUI情報を元にコントロールパネルを描画する
    • ボタンが押されたりしたら、プラグインにそのイベントを送信する
    • キーボードを描画し、MIDIイベントをプラグインに送信
    • プラグインから取得した音波形データをAudioAPIに送って音を鳴らす
  • プラグインの動作
    • ボタンの配置情報などをホストに送信
    • MIDIイベントの受信
    • ボタンなどを通じてパラメータの変更イベントの受信
    • 音波形データ(Float32Array)をホストに送信

今後

ConnectSynthはHeroku + S3で作ったんですが、米東海岸にサーバーがあるので結構遅いです。あんまり不便なようなら国内サーバーに移すか、ローカルでASIプラグインをデバグできるSDKみたいなものを作るかします。エフェクトの仕様やMIDIと連携させたシーケンサー辺りまで手が広がれば、ちょっとした打ち込み曲が作れるようになりそうでワクワクしますね。

現状は概念を説明するのに必要な仕様しかありません。ご指摘や要望、アドバイスなどがあれば是非WebMusicDevelopersJP に参加してポストしてみてください。では。