Web Audio API

2011/11/18

GDD 2011 では Web Audio API の反響が良かったですね。

ドラムサンプル

基調講演ででもしてたサンプル WebAudio Drum HTML5 で作るっていう点ではかなり注目でした。 テンポも変えられるし、何よりデザインがかっこいい!

リアルタイムセッション

Plink by Dinahmoe (Web Audio API) YAMAHA でもネットワークセッションのネタが話題になりましたが、これも結構凄いと思いました。 DAW やってる人ならわかるかと思いますが、レイテンシーって凄くシビアなんですよね。 それをネットワークでやるってのは想像以上に大変そう。 プロユースには難しいかと思いますが、ユーザのコミュニティには十分かと思いました。

ピアノサンプル

Sound Toy 楽器アプリも簡単に!? というか、各楽器の音を波形を自ら作ってるんですかこれ?

Chordlead でサンプリング方式で再生機能をつけてますが、FM音源方式はちょっと大変そう。。。

ちょっとだけ、ソースを見てみたけど、オーディオバッファや音程等は webkitAudioContext で全て管理してるようです。


SoundToy.prototype.noteOn = function( note )
{
    var id = this.mId;

    note += this.mOctave*12;

    this.mId = (this.mId+1) % 8;

    // copy data
    var dbuf = this.mBuffer[id].getChannelData(0);
    var num = this.mSLen;
    var sbuf = this.mSamples[note];
    for( i=0; i

MIDI シーケンサーは自作っぽいです。 ライブラリとかあるんですかね?

音声認識サンプル

inputタグに「x-webkit-speech」をつけると音声を認識します。 webkitspeechchangeイベントリスナーで、音声認識の結果を出力しています。

マイクボタンを押して話しかけて下さい。

ソース




          document.getElementById("speech-input-textbox").addEventListener("webkitspeechchange", function(event) {
            var speechresults = document.getElementById('speech-results');
            speechresults.innerHTML = '';
            for (var res in event.results) {
              speechresults.innerHTML += 'Utterance: ' + event.results[res]['utterance'] + '
Confidence: ' + event.results[res]['confidence'] + '

'; } }, false);

HTML5 オフライン機能

資料