読者です 読者をやめる 読者になる 読者になる

音の鳴るブログ

鳴らないこともある

ブラウザ音響プログラミング言語 CoffeeCollider v0.1.0 リリース

「CoffeeScript を SuperCollider みたいに処理をしよう ♪♪」をコンセプトに開発していたブラウザ音響プログラミング言語 CoffeeCollider をリリースしました。音響プログラミング言語ということで、とにかく試して聞いてもらうのが手っ取り早い。以下のリンク先で "BOOT" と "RUN" すれば深夜っぽい音が鳴ります。

CoffeeCollider

で、なんなの?

SuperColliderってなんだ?という人には 言語 & ライブラリ & 実行環境 という意味で processing.js の音楽版と言った方が分かり良いかもしれない。とにかく音がでる。音しかでない。とにかく音を出してほしいという気持ちで作った。最初はいい加減な気持ちでやっていたのだけど途中から結構がんばりだして、最終的にはカレーを食べにいく趣味ができました。

CoffeeScript拡張としての特徴

  • 演算子のオーバーロード
  • syncblock (wait できる関数)

演算子の拡張で音の合成などが簡単にできます。あと配列全体にかけ算するとかもできる。

SinOsc.ar(440) + SinOsc.ar(660) # ラ(440Hz) と ミ(660Hz) を合成
[ 1, 2, 3, 4 ] * 10 #=> [ 10, 20, 30, 40 ]

wait できる関数というのはコンテキストを限定しているのだけど以下のコードでゆっくり動く FizzBuzz が書ける。Tasksyncblock という中で wait が呼ばれるとその秒だけ処理が止まります。

Task ->
  count = 0
  Infinity.do syncblock (i)->
    count += 1
    switch 0
      when count % 15 then console.log "#{count} FizzBuzz"
      when count %  5 then console.log "#{count} Buzz"
      when count %  3 then console.log "#{count} Fizz"
      else console.log count
    1.wait()
.start()

以上のような CoffeeScript の拡張は結構原始的な方法で実現していて、実行する前に CoffeeScript を一旦書き換えていて、CoffeeScript -> CoffeeScript -> JavaScript の順で実行コードを生成している。ここで生成されるJavaScriptを実行するために後述のライブラリがあるという感じ。デモページの "JS" ボタンを押せば最終的に処理される JavaScript が表示されるのでどうやっているのかはだいたい分かると思う。

ライブラリとしての特徴

  • 150以上のUGen (音を出すための部品)
  • プロトタイプ拡張

ライブラリ周りは仕組みが整えば簡単に追加できるので、行き詰まったときに書いていたらやたらと量が多くなってしまった。ほとんどが使わない部分だと思うので将来的にはカスタムビルドで不要なコードは除外できるようにしたい。

実行環境としての特徴

  • 色んな環境で動く
  • WebWorkerで処理してる

推奨環境は Web Audio API に対応しているブラウザなんだけど、一応 Audio Data API と IE 用の Flash fallback も用意した。動作は WebWorker の中で行っている。上記ライブラリのプロトタイプの拡張なんかもWebWorker内のことなのでグローバル領域的なものが汚れるみたいなのはない。あと node.js でも実行できる。さっき確認したら iPhone5s では酷い感じだった。たぶん直せるので週末に調整します。

使い方

npm でインストールして node.js で実行

$ npm install -g coffee-collider
$ coffeecollider examples/khoomii.coffee

bower でインストールして ブラウザ で実行

$ bower install coffee-collider
<script src="coffee-script.js"></script>
<script src="coffee-collider.js"></script>
<script>
  var code = "(-> SinOsc.ar(440, 0, 0.5) + SinOsc.ar(442, 0, 0.5) ).play()";
  var cc = new CoffeeCollider();
  cc.execute(code).play()
</script>

課題点

  • 外部インターフェース
    • ブラウザでボタンを押したらメッセージを受信する機能とか必須と思うのだけど面倒でつけなかった。ので、現状はコードを投げてそれを実行するしかできない。
  • パフォーマンス
    • ちょいちょいノイズがのる。今後調性すればましになると思う。JavaScript高速化のベストプラクティスがよく分からん。
  • 便利UGenがない
    • Klank とかサンプルコードで良く見るけど複雑そうだから飛ばした。SuperCollider よく分かっていなくて何が必要なのか把握できてないってのもある。
  • ドキュメント
    • 書かなあかん

CoffeeCollider勉強会

12/20(金) の SC名古屋にて CoffeeScript の勉強会があります。SuperCollider と CoffeeScript が同時に勉強できてお得です!!!!

http://connpass.com/event/4105/

どなたか手伝ってください!!!!!

SuperCollider的な知見から足りない箇所を指摘されたいし、JavaScript的な知見から書き方の悪い箇所を指摘されたい。プルリクエストやマージというのもされて/してみたいし、サンプルコードを充実させたくもある。僕は誰かと共同でプログラム書いたことがないのでそういうのに憧れがあるのかもしれない。とにかく気概のあるかた手伝ってください。叱咤激励とかでも良いです。


最後にカレーの写真でこのエントリを締めたいと思います。

f:id:mohayonao:20131205230157j:plain

これは天満橋(大阪)にある喫茶星霜のトマトクリームカレーです。見ての通りあんまり辛くない。ここはコーヒーも美味しくて豆も売ってる。

喫茶 星霜

食べログ喫茶 星霜