さて、Web APIを利用して話し言葉をブラウザで認識させ、返事を選択させるところまで辿り着きました。今回は「Speech Synthesis API」を利用してブラウザに言葉を喋らせてみます。

言葉の一部分を読み取らせる(Speech Recognition APIの補足)

前回記事の補足です。条件分岐で話し言葉を読み取らせる際、複数の単語で判別したい場合の工夫です。

今回の場合、映画パルプ・フィクションの一場面風に「Royale with cheese.」と話すとサミュエル・L・ジャクソンよろしく「Royale with cheese?」と返事をする様にしたかったのですが…。

なかなか複数の英単語を正確に発音してブラウザに読み取らせるのは難しい事に気付きました。

そこでJavaScriptの String.prototype.indexOf() メソッドを利用することにしました。[^1]

1
str.indexOf(searchValue[, fromIndex])

このメソッドを利用すると検索したい文字列(str)の中から、抽出したい単語(searchValue)が含まれている文字数を返してくれます。

これを利用して今回は

1
if (value.indexOf('cheese') >= 0)

という条件分岐を行いました。[^2] これで文字列の中に「cheese」という単語が含まれていれば「Royale with cheese?」と返事をさせることが出来ます。

下手な英語の発音でも大丈夫。ということです。

Speech Synthesis API

さて、本題です。以前「 えっ、ブラウザが喋った!スピーチAPIを試してみたよ。【HTML5/Web Speech API】 - フタパパ 」で試した通り、「Speech Synthesis API」を利用することで簡単にブラウザにテキストを読み上げさせることが出来ます。

今回はサミュエル・L・ジャクソン特有の喋り方をブラウザに喋らせることが出来ないか考えてみたのですが…これは現時点ではひどく難しく、思ったように行きませんでした。

SpeechSynthesis.getVoices()

Speech Synthesis APIの中で、SpeechSynthesis.getVoices()というメソッドを利用することで使用OSの音声エンジンを利用することが出来ます。[^3]

実はこれを今まで知らずに、音声エンジンはブラウザが実装しているものだと思っていました。指定可能な音声はOSに依存されます。上記のSpeechSynthesis.getVoices()を利用して音声リストを抽出することも可能です。[^4]

Chromebookで指定可能な音声はこのようになります。男性の音声はもとより、今のところ日本語エンジンも未対応とちょっと寂しい対応状況です。

それと比較してやはり一番多くの音声エンジンを搭載しているのはMacです。

その数なんと83種類!視聴覚が不自由な方向けのナビゲーションにこだわってきたMacらしい対応だと関心しました。

このサンプル動画はMacの音声エンジン「Ralph」さんを利用しました。サンプルコードは以下の通り。

Speech Synthesis APIを利用して音声を指定することが出来ます。

1
2
var voices = speechSynthesis.getVoices();
u.voice = voices[64];

ここではMacの64番目の音声エンジンを指定しています。

※ Chromeのバグだと思うのですが、音声エンジンの読み取りの初回がデフォルト音声になってしまいます。これを避けるためにボタンをクリックした際にテキスト指定なしの音声を一度発話させるように指定しました。

まとめ

ちょっと長くなりましたが、今回は「サミュエル・L・ジャクソン」風の音声を再現するのに一番苦労しました。

ちょっと癖のあるアクセントで早口でまくし立てる「Mother F*cker」を再現するのは難しかったです。

どちらかというと、「ブレイキング・バッド」に出演した渋い脇役マイクを演じたジョナサン・バンクスさんの声に近いかな。

まあこの方も好きな役者さんなので良しとしましょう。そのうち音声エンジンにマシンガントークが得意な「Samuel」が出来ることを期待しつつ。

(この記事つづく)


[^1]: String.prototype.indexOf() - Mozilla Developer Network

[^2]: 2015年のクリスマスまでの日付を教えてくれるブラウザ - wakasamasao

[^3]: SpeechSynthesis.getVoices() - Mozilla Developer Network

[^4]: ブラウザのみで音声認識とテキスト読み上げを実現する Web Speech API- CYOKODOG