ITエンジニア/デザイナ向けにオープンソースを毎日紹介

ABC.jsはWeb上で楽譜を表示し、演奏するJavaScriptライブラリ。

ABC.jsはHTML5/JavaScript製のオープンソース・ソフトウェア。HTML5によってWeb上の表現力は高まっている。SVGでベクター画像を描いたり、WebGLによって3Dオブジェクトを描き出すこともできる。Canvasを使うプロジェクトも多い。


きれいな楽譜表示

これまではFlashを使ったり、画像を使わなければならなかった表現もHTMLだけでできるようになる。その一つ、楽譜を描き出して音まで鳴らせるのがABC.jsだ。

ABC.jsは特定の記法に沿って記述することでWebブラウザ上に楽譜を書くライブラリだ。JavaScriptを使っているので、その場で手直ししてレンダリングし直すこともできる。楽譜共有サイトのようなものを作ることさえできるだろう。


Firefoxなら演奏とダウンロードも

そして描いた楽譜からMIDIを生成し、音を鳴らすこともできる(QuickTimeの場合はライブラリが必要。Firefoxであればプラグイン不要)。もちろんdata URIで出力し、ダウンロードすることもできる。その音楽すら動的だ。これまでは面倒だった楽譜の公開も、ぐっと簡単なものになるだろう。


MOONGIFTはこう見る

画像で出力するだけでは単なるバイナリデータであって再利用性がとても低い。Flashを使う場合は恐らくXMLなどで楽譜データを出力し、それをFlashでレンダリングする形になるだろう。JavaScriptで操作することもAPI次第でできるが、柔軟とは言いがたい。

HTML5およびCanvasタグを使って描き出せれば、自由度は非常に高い。Webブラウザ上で音楽を作り、奏で、さらにそれをダウンロードできるというのはとても以前のWebでは考えられなかった。HTML5を知ることで新しいサービス開発のきっかけにもなるだろう。

デモ1

デモ2

デモ3

abcjs - ABC parser, renderer and editor in javascript - Google Project Hosting

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2