HTML5の音声合成でコンピューターが話している感じの音声を実現してみる

10159 ワード
Say HTML5 WebAudioAPI HTML5 テキストリンク

デモページ

実際の出力はデモページで試すことができます。
http://garoo.jp/demo/ffcc/

やりたかったこと

ナビゲーションの音声を作りたくて、どうせならクライシスコアファイナルファンタジーVIIの戦闘のナビゲーションのようなコンピューターっぽい音声にしてみたかったので調べてみたが、HTML5でできそうだったので試してみた。

やったこと

Macのsayコマンドで音声データを作成

Macのコンソールで下記コマンドを叩く。
say -o Modulating_Phase -v Samantha "Modulating Phase"
aiffファイルで出力されるので、iTunesでmp3に変換
参考サイト：Mac　Text To Speechでしゃべらせた内容をAIFFで保存

html5で実装

  • 音声ファイルとインパルス応答用のファイルを読み込む。
  • 音声ファイルにインパルス応答用のファイルを合成する。
  • 出力する。
sound.js
var files = [
    "sounds/spreader50-65ms.wav",
    "sounds/Modulating_Phase.mp3",
    "sounds/Activating_Combat_Mode.mp3",
    "sounds/Conflict_Resolved.mp3",
];

if(typeof(webkitAudioContext)!=="undefined")
    var audioctx = new webkitAudioContext();
else if(typeof(AudioContext)!=="undefined")
    var audioctx = new AudioContext();

var source = null;

var convolver = audioctx.createConvolver();
var revlevel = audioctx.createGain();
revlevel.gain.value = 6;
convolver.connect(revlevel);
revlevel.connect(audioctx.destination);

var compressor = audioctx.createDynamicsCompressor();
var volume = audioctx.createGain();

var buffers = [];
var loadidx = 0;
var req = new XMLHttpRequest();

function LoadBuffers() {
    req.open("GET", files[loadidx], true);
    req.responseType = "arraybuffer";
    req.onload = function() {
        if(req.response) {
            audioctx.decodeAudioData(req.response,function(b){
                buffers[loadidx]=b;
                if(++loadidx < files.length)
                    LoadBuffers();
            },function(){});
        }
        else
            buffers[loadidx] = audioctx.createBuffer(VBArray(req.responseBody).toArray(), false);
    };
    req.send();
}
function Play(number) {
    source = audioctx.createBufferSource();

    source.buffer = buffers[number];
    convolver.buffer = buffers[0];

    source.connect(volume);
    volume.gain.value = 1;
    volume.connect(compressor);

    compressor.connect(convolver);
    compressor.connect(audioctx.destination);

    source.start(0);
}

参考サイト：Web Audio API を使用したゲーム用音声の開発

やれなかったこと

完成した音声ファイルの出力