和田憲幸のブログ

世界広し、野原ひろしと言えどメールフォームに音声ガイダンス機能が付いているのは「メールフォームプロ」だけだと自負しております。そして誰もそれを望んでいないことは百も承知の上。しかし、やりたかったからパワーアップして音声ガイダンスアドオンを付けてみた。アドオン開発すげー楽しい。

音声ガイダンスのためにイベントを増やした

前回ご紹介したものの他に
error・・・送信ボタン押下時に入力エラーがある際に発生
confirm・・・確認画面表示時に発生
send・・・送信プロセス時に発生
cancel・・・確認画面からキャンセルを押された際に発生

上記のイベントを追加した。そしてさすがに音声ガイダンスを標準実装するわけにもいかないので、アドオンとしてWadaVoice.jsというアドオンを作ってみた。各エレメントにフォーカスがあたった場合や、確認画面を表示した場合、確認画面でキャンセルを押された場合に和田が音声でしゃべります。誰得ここに極まれり。

無論今回はFlashを使わずにAudioタグを利用しているため、oggとmp3の2つのファイルを用意する必要があるわけで、実際に使う人がいないことはわかっているけど、例えばボタンクリック時のクリック音だとか、エラー時の警告音など、実用的な使い方は全然あると思う。使い方は皆さんの工夫次第ですよね！

また、レスポンシブWebもアドオンで実装した。標準実装してしまうとモバイル判定をmfp側で決めなくてはならないので、色々と面倒だなと思ったので。ようやくたどり着きたかった場所にたどり着いた感じ。

しかし、思った以上にアドオン開発がオモシロイので定期的にアドオンを作っては公開するかもしれない。サクッと作れるわりに意外と楽しいもんですね。今回は本当にナイスなデザイン（設計）だと自分を褒めてやりたい。

と、いうことで新音声ガイダンス機能はデモページよりお試し下さい。
※音量にはご注意ください。