1 本機の説明
インフルエンザになってしまいどこにもいけないので、家庭で余っていたラズベリーパイを使ってチャージマン研！目覚まし時計（音声認識付き）を作ってみました。
2 主な機能とデモ
【音声認識（ボタン押下）】
-
1 「チャージゴー(Charge Go)」と声高らかに叫ぶと主題歌を再生。
-
2「ボルガ博士」と呼びかけると博士が飛行機から放り出されて爆破されるシーンを再生。
-
3「ウェイ」と呼びかけるとウェイの星くんのェエエーーーーイイを再生。
-
4それ以外はわかりません。
【目覚まし時計】
・ 指定した時間にYoutube上のチャージマン研！のストーリーのどれかをランダムに再生今回は12:20分
3 主要ハードウェアとその構成
・ Raspberry Pi 2 Model B(家にあったやつ)
・ I-O DATA Wi-Fi 無線LAN 子機 11n/g/b 300Mbps アンテナ型 WN-G300UA
・ 集音マイク
・ ELECROW 7インチ モニター
・ Kuman 7インチ Raspberry Pi 用ディスプレイ ブラケットケース SC7B-1
4 コンテンツと技術の説明
Rails/Web Speech Api/Javascript/YouTube
-
RailsのDB構成
Youtubeの動画IDが欲しいので、それを登録だけできる仕組みにしました。
Postの中にtitleとbodyのある単純なものです。 -
Kioskモード
Chronium をキオスクモードで起動するには、ターミナルで以下のコマンドを実行。これを起動時に仕込んでおけば自動起動しますね。
$ chromium-browser --kiosk http://localhost
- 時間になったら再生する処理：
今回は以下のサイトを参考にさせていただき、実装しました。コードは抜粋です。
http://www.anieto2k.com/2009/01/05/jscron-portando-cron-a-javascript/
// Rails のデータベースからランダムでidをもらってくる。
function mEffect() {
{ window.location.href = "/posts/<%=@randpost.id%>" ; };
}
// 目覚まし時間になったら、mEffect(目覚まし)を実行。
jsCron.set("11 17 * * * mEffect()");
- 音声認識WebSpeechApi：
音声認識にはWeb Speech Apiを利用しました。非常に簡単に実装できてすごく便利です。
（良記事）https://qiita.com/GalapagosOf/items/b0df73a0a53a29b40388
（デモ）https://www.google.com/chrome/demos/speech.html
実装にあたっては、Jsに
//音声認識APIの使用
var speech = new webkitSpeechRecognition();
//言語を日本語に設定
speech.lang = "ja";
なんと以上で基本できてしまいます。簡単ですね。
そしてマイク起動後呼びかけられ時にする処理は、１：ボタン押す＝＞２：音声認識した結果をもらう＝＞３：認識した言葉によって指定した処理（今回はYoutubeのURLを開く）を実行。
btn.addEventListener( 'click' , function() {
// ➀ボタンをクリックした時の処理
} );
speech.addEventListener( 'result' , function( e ) {
// ➁音声認識した結果を得る処理
} );
btn.addEventListener( 'click' , function() {
// 音声認識をスタート
speech.start();
} );
speech.addEventListener('result', function( e ) {
var text = e.results[0][0].transcript;
// 認識された「言葉(text)」を、表示用のdivタグに代入する
moji.textContent = text;
});
speech.addEventListener( 'result', function( e ) {
var text = e.results[0][0].transcript;
// 認識されたら指定の関数を実行
if( text === "Charge Go" ) getVideo();
else if (text=="ボルガ博士") gotVideo();
else if (text=="ウェイ") weiVideo();
else wakaran();
}
);
function getVideo() {
var URL = '<iframe width="560" height="315" src="https://www.youtube.com/embed/of9DiKKlBWA?autoplay=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
content.innerHTML = URL;
}
//~~以下略
- 呼びかけられてわからない時にする処理：
「ボルガ博士」、「Charge GO」 、「ウェイ」以外の言葉の場合はひとまず、OpenJtalkで作った「すいませんわかりません。」音声を再生することにしました。
speech.addEventListener( 'result', function( e ) {
var text = e.results[0][0].transcript;
// 認識されたら指定の関数を実行
if( text === "Charge Go" ) getVideo();
else if (text=="ボルガ博士") gotVideo();
else if (text=="ウェイ") weiVideo();
else wakaran();
}
);
// 〜 中略 〜
function wakaran() {
var URL ='<%= audio_tag("/suman.wav", :autoplay => true, :controls => false) %>';
content.innerHTML = URL;
}
5 参考にさせていただいたサイト
https://www.youtube.com/watch?v=Y-8lK7on0c4&list=PL5F60F0F37F02B624
（チャージマン研関連）
https://dekiru.net/article/15155/
(Youtubeパラメータ関連)
https://liginc.co.jp/261317
(ラズパイのセットアップ関連)
https://qiita.com/GalapagosOf/items/b0df73a0a53a29b40388
(Web Speech Apiについて)
https://qiita.com/t_oginogin/items/f0ba9d2eb622c05558f4
（音声認識）
https://qiita.com/zk_phi/items/8a24b8ad9d1eabd364aa
下の方を流れているアイコンに使わせていただきました。ありがとうございます。
https://qiita.com/YumaInaura/items/0d8427bfe2d7be476d0d
なんとなくタイトルはご紹介のジェネレータで作成させていただきました。
6 作ってみて思ったこと
ソフト側
・ インフルエンザで休みだったので作りましたが、こんなものでも１０年ほど前に見積もれと言われたら１００円以上で見積もっていた可能性もあり、つくづく技術の進歩はすごいなあと思いました。思いついたことを、既存の技術のつなぎ合わせで簡単に作れるということは、やはりこれからはより良いアイデアを思いついたら即実行するスピード感が重要だと感じました。
ハードウェア側
・ ラズパイ自体のこともありますが、やはり集音マイクや、音響も含め安い機材ではそれなりのパフォーマンスしか出せず、つくづく大手メーカーが出している製品は良い部品の集合体なのだと思いました。
特に地味にマイクは当初は３００円程度の安いものを購入し使用していましたが、感度が大変悪く、自宅で大声で「チャージ〜ゴーーーー」＝＞「すみません。わかりません（怒）」コンボは致命傷となりました。最終的には３６０度集音（それでも１０００円くらい。。）できるタイプのものにしました。
ある程度、システム側でパフォーマンスを落としながら調整することも可能ではありますが、ハードの力はそれでも偉大です。
一方で、筐体（今回はラミネートしたチャー研と安いディスプレイフレームで臨みましたが）については、IT技術とは別の芸術性のあるもの例えば、人形や陶器、絵画などとコラボレーションすることでもっと相乗効果が出るかもしれないと感じました。
また思いついたことがあれば追記します。読んでいただきありがとうございます。しかし私は一体何をやっているのでしょう？？？