122014.07
コトバツナギ 公開しました
マルチユーザーコトバアソビ「コトバツナギ」を公開しました。
https://kotoba.tsukuenoue.com/
ゲーム概要
コトバツナギは、声に出して声で遊ぶマルチユーザーコトバアソビです。
PCサイトを開いて、スマートフォンを皆で持って集まってお楽しみください。
スマートフォンの代わりにマイク機能付きのノートPCでも可です。
シリトリとレンソウゲームが遊べます。
コトバはイメージでも表示され、目で耳で、コトバのつながりを感じてもらえるように作りました。
PC・スマホともにChromeブラウザのみ対応(iOSは不可)。
一応一人でも遊べます。
技術仕様
通信とカメラ・マイク入力にwebRTCを使ってます。
webRTCはpeerjsを使っていて、peerサーバーもさくらVPSで動かしてます。
主な技術をまとめると、
webRTC(カメラ・マイク) + webRTC(peerjs) + speechRecognition + speechSynthesis + Web Audio + テキスト解析 + 画像検索
でできてます。
そのため、今の時点ではchromeブラウザでしか動作しません。
iPhone・iPadで遊べないのが無念ですが、仕様なので仕方ないです。
音声認識がうまくいかないことも多々あると思いますが、音声認識はChrome側の機能でこちらで制御できないのでご容赦を。
ゆっくりはっきりしゃべると認識しやすくなります。
マイクのインプットレベルを上げられる場合はある程度上げておいた方が良いです。
余談
peerjsを使ってみたかったのと、HTML5 Japan Cupに応募したくて作りました。
本当は以前に作った「JYANKEN SQUEEZE」をそのまま応募しようと思っていたけど、応募ルールが開催期間中に作った作品ということだったので、思い切って新規作成することにしました。
マイクとカメラ入力を扱うgetUserMediaとwebkitSpeechRecognitionがhttpだと毎回使用許可確認の表示が出てしまいます。
SSL使用のhttpsだと最初の一度しか出ないので、なんとかサーバーでSSLを使えるようにしました。
SSLは普通に契約すると結構高いのですがStartSSLというのを使うと無料でなんとかなったので、StartSSLに感謝感謝です。(無料は個人利用のみ)
コトバを言う度に表示される画像は毎回webから取ってくるので、何が表示されるかは作った本人もわかりません。
思わぬ画像が出てきたりして、結構面白いです。
宜しくない画像が表示される場合もあるので、宜しくないコトバは避けるが吉です。
デザイン面では、JYANKEN SQUEEZEの時に円をベースにしたデザインにしたので、今回は四角をベースにしたデザインにしようと思って作りました。
結局ところどころ円を使ってますが。
図形に頼らないデザインもできるようになりたいところ。
あと、あまり大したものではないですが、サウンドも自作です。
複数人でも一人でも遊べるので、良かったら遊んでみてください。
■コトバツナギ
https://kotoba.tsukuenoue.com/
コメントはまだありません。