こんにちわ、WP-Eイクラ @se_inoです。皆様3連休をいかがお過ごしになられましたか？
私は3日ともすべてハッカソン等のイベントに参加していました！非リア充でも寂しくないよやったー！！＼(^o^)／
どれも楽しいイベントだったのですが、その中でも特に楽しんだVincleのハッカソンについて書きたい思います。

Vincle（ウィンクル）とは？

世界一ロマンチックなスマホアクセサリーと銘打たれたイヤホンジャック装着型アプセサリーで、
離れているVincle同士を向かい合わせると、お互いのVincleが光るというものです。
離れた場所にいる恋人同士も、Vincleを使うことによって、パートナーとのつながりを感じることができます。

あっ、Vincleはひとりでも使えるので非リア充の方も安心ですよ！

詳しいコンセプトについては、CanpfireのVincleページをご覧ください。
プロダクトのページはこちら（http://vinclu.me/）から。

Vincleハッカソンとは？？

そんな素敵なVincleを操作できるライブラリを@t_furuさんが作成してくれたので、みんなでVincleハックしてなにか作ろうぜ！というハッカソンです。

各参加者に1つずつVincleが配られ、イベント時間中にアイデア出し〜プロダクトの完成までを行います！

今回は、11人の参加者が2~3名構成の4チームに分かれてチーム対抗で作業する形となりました。

ちなみに、@se_inoがカメラ本体は持っていったもののバッテリーを持っていくのを忘れるという失態を犯したため、
この記事の写真は写真は@t_furuさんが撮って共有してくれたものを使用させていただいています。色々とお世話になりっぱなし！(^q^)

まずはアイデア出し＆ブレスト

まずは、ハッカソンの勝敗の9割がここで決まるといっても過言ではないアイデア出し。
基本的にハックの方向は「何らかのトリガーでVincleを発光させる」という感じとなり、
方向を検知して宝探し？上司が近くにきたら光る？みんなで上に掲げたら光る元気玉？魚群の探知？（！！？）と、色々アイデアが出ましたが、今回は
ハモると光るというプロダクトを作ることにしました。
近くの人はもちろん、遠くの人ともハモって光る、ライブなどでアーティストや周りの人とハモって光る、という事ができればいいなと思いました。

ハック開始！・・・でも、出来るのか？！

Vincleのハック用ライブラリはブラウザベースのものとiOSネイティブのものの2つがあり、今回はブラウザベースのものを使用させてもらうことにしました。

今回のメンバー構成は2人組で、@se_inoがメインで動作プログラム作らせてもらって、もうお一方には調査サポートと動作したときの画面を作ってもらいました。
が、実は自分は音を扱う系のプログラムを全く書いたことがなく、出来るとは思うんだけど、できるかなぁ？みたいなフンワリした状況で作業開始、まずはやれるかどうかの調査からはじまりました。

すごいぞHTML5 すごいぞWebAudioAPI

ここからは少し技術の話。でもほんの少しです。なぜなら自分もまだよく知らないからです。
navigatorオブジェクトのgetUserMediaというメソッドを用いて、AudioStreamの監視を行い、入力された音声をUint8Arrayを使って配列に変換し、配列内の要素を調べることによって、やりたいことが実現できそうということがわかりました。
また、Node.jsを使って入力された音声のヘルツ数と自己のIDをブロードキャストします。受け取った音のヘルツ数と今マイクで入力されている音のヘルツ数と和音になるかを判断します。
はい、技術の話ここまでです。しかも書き方がややふんわりしていますね。なぜなら自分もまだよく知らないからです（2回目）

で、マイクから入力された音声を短めの一定間隔で監視して”音声入力があれば点滅して光る”、”複数の箇所からの音声入力があり、かつその音声がハーモニーであればまばゆく光る”という実装をしました。

6時間のうちに、なんとか形になりました

すげー短いですが、デモ用動画はこちら。声が認識されると光ります。

複数人数でやればちゃんとまばゆく光ります。が、ハーモニーの部分はめっちゃイカサマしていて、ヘルツ数が近ければ和音とみなすという形になってます。
急ごしらえで作ったもののため、ちょっと恥ずかしいので、ソースコードの場所はまだ内緒にしてブラッシュアップします・・・(*ﾉｪﾉ)

他のチームのアイディア＆実装が凄い＆面白いぞ！

注目なのは他のチームのアイディアです。

早打ちアプリ

銃(iPhone)を構え、お互いに向かい合って、３…，２…，１！！で銃を抜く動作をする早打ちアプリ！
勝った方のVincleは光って、負けた方のVincleは点滅するという動きになり、早打ちガンマンごっこを公正に行えるというものです。
ちなみに、向かい合わせた方向があってないと成功しないようになっています。
単純なのに、楽しい！

道案内

GoogleMapの道順検索と連動して、正しい道順の方向を指している時に光るというアプリ！
青い鳥が導いてくれる見た目と相まってオシャレ。
スマホをもって地図を見ながらくるくるするのも、これがあれば楽しく分かりやすい！すぐ使いたいなと思ったアプリでした。

連動サイネージ

加速度センサーを使って、誰かがVincleを付けてiPhoneを振ると、他のVincleも連動して光るというもの。
ライブ等でタイミングを合わせて振ると凄く楽しそう！！みんなで部屋の電気を落として振ってみましたが、テンション上がりますよ！

光るだけなのに面白い

自分はWebやシステムの開発をずっとしてきたエンジニアだったので、画面の外にあるものが光るというだけで相当テンションが上がりました。
画面からはみ出す is 新世界！！！

アイデアを形にするのは、楽しい。ハッカソン最高だよ！

何か（今回の場合はVincle）に＋αをして、こうしたら面白いんじゃないか？というのは、みんなよく考えることだと思うのですが
「よし、作ろうぜ！」っていうところまで一気にやってしまうハッカソンは、本当にやりごたえも楽しみもすごく大きいです。妄想の具現化たーのーしーーー！！

ちょっと何か作ることの出来るエンジニアの方なら、参加して損はないはず！

最後に

楽しい時間を提供してくれた、主催者もといウィンクル開発者の武地さんをはじめ、ライブラリを提供してくれた@t_furuさん、あわせ、他の参加者のみなさん、ありがとうございましたヽ(=´▽`=)ﾉ

会場とコワーキングスペースの紹介

・ハッカソン会場
このハッカソンは六本木のbreaqさんという喫茶店を貸しきりにして会場として使わせて頂きました。
こちらの喫茶店、超オシャレ＆可愛い、そして何よりカレーがメッチャメチャ美味しい！！ので、一発でファンになりました。
また行きたい！！！

・コワーキングスペース
お台場のテレコムセンタービルにあるMONOさんというコワーキングスペースで、Vincleの開発が日々すすめられているようです。
こちらのコワーキング、３Dプリンタやレーザーカッター等の充実の設備が用意されていて、個人で用意することが難しい道具も
レンタルして利用させていただくことができます（使用するための注意やルールはきちんと守ってください）。
電子工作をするかたには、かなり嬉しい場所ですね！

東京以外にも、北海道札幌のSHAREさんも３Dプリンタ等の設備があるコワーキングで、ハンズオンやワークショップなども高い頻度で行われているようです。
ご興味のある方は是非。

以上　連休を満喫したWP-Eイクラからのレポートでした。