二郎愛を可視化するアプリケーションを作ってみた #ジロッカソン

こんにちは。

先日ジロッカソンに参加し、二郎愛を可視化する「二郎のブタ」というアプリケーションを作成しました。 せっかく作ったし・・誰かに見せたくてうずうずしているので、こうしてブログに書き残すことにしました。

f:id:hiiiiiiihikaru:20170629125628p:plain

ジロッカソンとは?

サポーターズが主催する、ジロリアンによるジロリアンのための二郎に捧げるハッカソンイベントです。

f:id:hiiiiiiihikaru:20170629134815p:plain

2017年6月3日、ジロリアンエンジニアが渋谷に集まり、 二郎への愛を語りながらアプリケーションを開発していました。 私は、デザイナー1人、開発2人の、3人チームで参加しました。

何を作ったか?

自分が注文したトッピングを、リアルタイムに画面上のブタが食べます。

これだけ見たら「だから何?w」って感じなんですけど。 どういう場面で使うものかを見せるとイメージがつくかもしれません。

f:id:hiiiiiiihikaru:20170605182243p:plain ※設置イメージ

二郎店舗の壁にディスプレイ、カウンターにマイクを設置します。 お客さんがトッピングを注文するたびに、音声を認識してブタが同じトッピングを食べます。そして成長します。 店舗に置くことで、二郎のお客さん全員でブタを育てていくことができます。

「あ、俺が注文したトッピングを食べてる・・」

「!?ブタが成長したぞ」

「ブタの成長を見に二郎食べに行こうかな」

「俺のホームをブタをもっと成長させたい・・・!」

そう、このアプリケーションで、二郎愛を可視化できるのです。

どうやって作ったか?

f:id:hiiiiiiihikaru:20170629141549j:plain

言語はRubyを選択し、音声認識の部分は、オープンソースの日本製音声認識ソフトを利用しました。

julius.osdn.jp

juliusのgemも存在していたので、簡単に実装することができました。

julius | RubyGems.org | your community gem host

作ったソースコードgithubに上げています。

github.com github.com

ちなみに、手元で動かすことができます。macOS Sierraでしか挙動確認していませんが。 その手順を一応載せておきます。

# 手元のどこかにリポジトリをクローンしてくる
$ git clone https://github.com/soe-j/buta-web.git
$ git clone https://github.com/hmaruyama/HelloJiro.git

# buta-webリポジトリがあるディレクトリに移動して諸々作業
$ cd path/to/buta-web
$ brew install yarn
$ brew install postgresql
$ brew services start postgresql
$ bundle install
$ bin/rails yarn:install
$ bin/rails db:create
$ bin/rails db:migrate
$ bin/rails db:seed
$ bin/rails s

# HelloJiroリポジトリがあるディレクトリに移動して諸々作業
$ cd path/to/HelloJiro
$ bundle install
$ ./julius_server.sh
$ bundle exec ruby app.rb

ブラウザにて http://localhost:3000/pigs/kabuki にアクセスし、準備完了です。 最後のbundle exec ruby app.rbを実行した後に、コンソール上に呪文を唱えてくださいと現れたら、macの内臓マイクに向かって「にんにく」と発言してみてください。

...ok!
呪文を唱えてください。
次の方トッピングなにしますか〜? : ニンニク

ブラウザで開いているページで、ブタがニンニクを食べたら成功です。

まとめ

ジロッカソンで、二郎愛を可視化するアプリを作ってみたという話でした。 ハッカソンは、API技術提供では何度かお邪魔したことがあるのですが、参加者としては今回が初めてでした。 自分で手を動かして作って、最後に成果物を発表できたのは、かなりエキサイティングな経験でした。 面白かったので、これからも機会があればハッカソンに出ようと思った次第です。ではでは。