はじめに
2019/12/14-15に開催された、ヤフー株式会社様主催のハッカソン「Hack Day 2019」に3人(@iaoiui、もう一人)で参加しました。エンジニアとして非常に刺激になったので、是非この時の記憶を残しておきたいと思い、記事を書かせていただきます。この記事を見て、少しでもハッカソンの辛さ楽しさが伝われば幸いです。
成果物
作成したものは「ARであそぼ」というAR×工作×パズルのアプリです。
文字の書かれた「パーツ」を組み合わせて、実際に存在する単語を作ると、それをマーカとして認識し、AR空間に「ほんもの」として出てくるアプリです。ただし、時間の都合上、実際には4文字を全て別個で認識したらオブジェクトが出てしまう感じになりました。
ワクワクさんリスペクトで、↓のように紙皿で「パーツ」を作っていきました。
「ロ」「ボ」「ッ」「ト」のパーツを集めると、




こんな感じでロボットのARオブジェクトが出ます。ロボット自体は、Polyで見つけた物です。
発表はネタに全振りしましたが笑、実際は子供の知育玩具としてのビジネス価値もあるのではないかと思っています。今回はそこまでできていませんが、
- 写真をアップロードしてマーカーとして登録する機能
- 任意の文字列(例:ロボット)に対して表示するオブジェクトを登録する機能
まで合わせて作成し、子供が自分で作った文字パズルでARが出せるよ!という製品を想定しています。
使用技術
キー技術としては、ARCoreを使用しています。元々は、メンバーの技術スタックを考えてAR.jsを使用しようと思っていましたが、できることが少なかったため、ARCoreもしくはARKitが選択肢となりました。しかし、ARKitのビルドに必要なMacを一人しか持っていなかったため、ARCoreを採用しました。
ARCoreのAugmentedImageで、予め登録しておいた「パーツ」を認識してARオブジェクトを表示させています。
途中、three.ar.js、WebARonARkit、WebARonARCore、ARToolkit、ARToolkitXも検討しましたが、ドキュメントが少なかったり、メンテがされていなかったりしたため不採用となりました。
「ARであそぼ」に至るまでに出たアイディア
ハッカソン参加に当たって、一番時間を使うのは「何を作るか」というところだと思います。最初は得意領域のAIを活用しようと考えていましたが、最終的に「映えるんじゃね?」ってことでARを使うことにしました。最後の方は時間がなくなってきたため、如何に簡単な技術で見栄えの良い物を作るか、という方向性にシフトしていきました。
3人でざっと100程度はアイディアを出しました。以下はその一部です。
- 水槽に水を入れたらセンサーが反応して画面の中の木が育つアプリ
- VRでアクアリウムができるアプリ
- 頭の形と髪質から実現可能な髪型をレコメンドしてくれる
- Adversarial Examplesで何か面白いことやる
- ARリアル脱出ゲーム
もうあった:https://nazoxnazo.com/shibuya_pp/ - 次世代広告システムとしてのAR。広告を載せたい人は、座標あるいはマーカーをマーカーの場所を申請。ユーザがその場所に行ったり、マーカーにかざしたりすると広告が表示される。設置コストがほぼ0なところがポイント。
- 次世代SNSとしてのAR。自分の今いる場所に時間付きでメッセージを残せる。この店美味しいよ!とか、の情報共有もありだし絵馬に書くノリで何か書いてもよし。サイバー空間上だから誰かに迷惑をかけることもなし
もうあった:https://jp.techcrunch.com/2017/11/03/graffity-releases-their-first-app-formally-and-raised-30-mil-yen/ - 三次元ウォーリーをさがせ
- Just a Line✕ピクトセンス。その場にいてマルチプレイができる。
- ARヘンゼルとグレーテル。パンをちぎってAR空間に置いておけるだけのアプリ。
- トランプウノ。トランプカード一枚一枚がマーカになっておりAR上ではウノとして遊べる。重ねると別のマーカとして認識したり。
- ARクロスワードパズル
→技術的にできそうということで、最終的にこれをベースにアイディアが固まっていった。
レポ
2日間、ほぼ寝ずに作業し続けていました。以下は覚えている限りの二日間の軌跡です。
- [10:45] 会場につく。一人寝坊してまだこない。
- [11:30] 3人集まる。
- [11:50] 参加者に配布されたレストラン1000円クーポンを握り締めて、早速昼ご飯(海鮮丼)を食べに行く。
- [12:40] 食べ終わった。
- [12:50] ARCoreでできることについて調べる。Andorid Studioを使おうと思っていたが、Unityの方がいいんじゃね?となる。
- [13:30] ARCoreのサンプルがAndroid Studioで動いた。Unityはやっぱりやめることにする。
- [14:00] それぞれAndroid Studioで分担して開発する。が、エミュレータがうまく動かない。しかもARの動く実機端末は一個しかない。PCと接続するケーブル(USB3.0 to USB Type-C)もない。
- [14:30] ARで巨人を置いて遊ぶ。




反省点
準備不足、それにつきます。事前に環境構築と技術確認(ARCoreで実際どこまでできるか?)は最低限済ませておくべきでした。エミュレータがうまく動かず、ARCore対応の実機が一台しかないため、ハッカソン通して@iaoiuiが全てのコーディングを担当することになってしまいました。
その上、全員ARもネイティブアプリ開発もほぼ未経験のため、開発現場は凄惨を極めました。
また、これまで同じメンバーでハッカソンは何回か参加しているので、「まあなんとかなるんじゃね?」という気持ちがどこかにあったせいもあると思います。
最終的に、発表では見せたい物を100%見せることはできませんでしたが、本物のワクワクさんにコメントを頂けたのでよしとします笑
おわりに
楽しかった!!それにつきます。若くて優秀なエンジニアや百戦錬磨のシニアエンジニアがこれほど集まる機会は他にはないのではないでしょうか。
来年も機会があれば是非参加させていただこうと思います。次こそは入賞を・・・!