実装 - morita-graduation-thesis

実装

気合ボタンの仕様では、今回利用した基本的な技術を挙げ、その後根幹となる気合いボタンの実装については以下で解説していく。

言語や環境について

気合ボタン実装に仕様した技術か以下の通りである。

table:言語や環境

JavaScript webサイトに動きを与えるためのプログラミング言語

HTML webページ買う初のための基本言語

CSS webページのスタイルを指定するための言語

Chrome拡張機能 Googleが提供するWebブラウザGoogle Chromeに機能を追加するプログラムファイル

web spech API 音声データをウェブアプリに組み入れることを可能にするAPI

web audio API Web上で音声を扱うための強力で多機能なシステムを提供するAPI

気合ボタン実装機能

気合ボタンの実体はGoogleが提供するWebブラウザGoogle Chromeに機能を追加するプログラムのChrome拡張機能である。拡張機能の設定ファイルであるmanifest.jsonの"content_script"内にgmailのURLである"https://mail.google.com/*" と記述することで、拡張機能はGmailのページでのみ機能する。

気合ボタンはchrome拡張機能を用いてメール作成画面にある送信ボタンを検索してその親要素に気合いボタンを生成、挿入するとともに送信ボタンを非表示にして、気合ボタンを押して気合を入れないとメールを送信できないという機能を有する。

メール送信ボタンは「送信」という文字列がaria-labelに存在しているため、をquerySelector('div aria-label*="送信)" ');)でページ内から検索できる。そしてparentNode.appendで送信ボタンの親要素に気合ボタンを挿入している。

宣誓文章と音量の認識機能

メール作成に関しての気合を出させるための機能は、気合ボタンを押した際にユーザーに気合を入れるアクションをさせるためのHTMLを表示する。

宣誓文の正誤認識機能を作成するために利用したweb speech APIのSpeechRecognition機能は、Webページ上で音声認識、音声合成を利用することができるJavascriptのAPIのうち、マイクによって入力された音声の認識を可能とする。気合ボタンではユーザーの宣誓している文章をリアルタイムで表示している。

WebAudioAPI は高度な音声処理や音声合成を行える JavaScriptAPI であり本論文では音量評価機能を可能としている。実装では音量バーが黄色部分まで表示されるほどの音量を出すことができれば大きな声を出して宣誓した→気合いが入っているとして音量に関する課題をクリアしたとして判定するものとした。

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

以下メモ・コメント