これは、プリッカソン Advent Calendar 2019 9日目の記事です。
「プリッカソン」については主催者のなかひこくんが１日目の記事で紹介しているので、そちらをご覧ください。
プリッカソンに私は#8で初めて参加し、#9にも参加しました。そのときに「まりあのかわいいシールを貼れるARアプリ」を作っていたので、この記事ではそれを紹介しようと思います。
「まりあのかわいいシール」とは
「キラッとプリ☆チャン」シーズン2で、金森まりあちゃんがかわいいものにシールをペタペタとたくさん貼るシーンが度々あります。
最初は「頭おかしい奴（褒め言葉）が出てきたぞ」と思いました。しかし、まりあの「かわいい」は、ただかわいいものが好きとかそういうものではなく、全てを肯定し受け入れて、それを「かわいい」という言葉で表現しているということが次第にわかってきます。実はとんでもなく凄い子でした。
その「まりあのかわいいシール」はプリズムストーン店舗/WEB SHOPで購入1 2できるのですが、たくさん貼ろうとするとお金がいくらあっても足りません。
そんなわけで「まりあのかわいいシールを貼れるARアプリ」を作ろうと思い立ちました。
ハンドトラッキング
作中でまりあがやっているのと同じように指先で貼れるようにするには、ハンドトラッキングが必要です。結論から言うと、ハンドトラッキングは今のところあまりうまくいっていません。作り始めた当初もうまくいくとは思っていませんでしたが、「やってみなくちゃわからない、わからなかったらやってみよう」3の精神でやってみました。
プリッカソン#8,#9では、次の2つのやり方を試しています。
- ARKit3のPeople Occlusionを使う
- MediaPipeのハンドトラッキングを使う
ARKit3のPeople Occlusionを使う
ARKit3のPeople Occlusionは、iPhoneのカメラの前に手だけかざしてもわりとしっかり手の内側と外側を分けてくれるので、これを使えばある程度手の動きを認識することができるのではないか、と考えました。
結果はこんな感じでした。
— らくさん (@rakusan) December 8, 2019
これは、親指と人差し指で輪を作ったことを認識しています。正確には「People Occlusionで認識した領域内に穴があり、その面積が一定の範囲内かどうか」を検出しています。
この方式だと、一応手の動きに合わせてシールを貼ることはできますが、指先を認識することは難しそうです。
MediaPipeのハンドトラッキングを使う
Googleが公開しているMediaPipeというフレームワークがあり、これには顔検出や物体検出、ハンドトラッキングなどの機能が含まれています。これを使えば指先の認識ができそうです。
結果はこんな感じに。
プリッカソンで途中までしかできなかったやつの続き。 pic.twitter.com/uP2sa3npMG
— らくさん (@rakusan) October 20, 2019
指先の認識は一応できていますが、いくつか問題がありました。
- まだ非常に不安定：わりとすぐクラッシュします。メモリリークも激しいです。
- 重い：MediaPipe単体で使えばそれなりに動きますが、ARKitと組み合わせると結構重くなってしまいました。
- デプスが手首からの相対値？：3Dモードで動かすとデプス値らしきものを取れるのですが、その値をよく見てみるとどうやら手首？からの相対値のようでした。これでは指先を認識できてもシールの奥行き方向の位置を指先に合わせるのが難しいです。上の動画では指先のデプスは適当な固定値にしています。
ハンドトラッキングは一旦諦める
どうやらこのままハンドトラッキングに拘っていてもなかなか先に進みそうもありません。萌黄えもちゃんの曲「えもめきピッカーン」には次の一節があります。
失敗したっていいんだよ「うぇい！」
問題点を見つけよう「うぇい！」
次のすごいプラン話したい
ということで、一旦ハンドトラッキングは諦めて別の方法を試してみます。
画像トラッキング
かわいいシールの実物をトラッキング用の画像として使います。これならわりと簡単にできそうです。当然これはこのアプリを作ろうと思い立ったとき最初に考えましたが、指先を認識したいという気持ちが強すぎました。
— らくさん (@rakusan) December 1, 2019
やってることは、ARKitのサンプルコードの Detecting Images in an AR Experience を少し改造してるだけです。ARKitに詳しい人なら簡単だと思うので詳細は省きますが、次のことをしています。
- かわいいシールの画像をトラッキング用の画像として事前に登録しておく
- シールの実物をトラッキング
- トラッキングしたシールのワールド座標を起点とし、シールが向いている方向にレイキャスト
- レイが交差した点までの距離が3cm以内ならARシールを貼る
今後の予定
一旦、画像トラッキング方式で開発を進めます。とりあえず次の機能を実装したいです。
- 貼ったシールを他の端末と共有する。これは同じローカルネットワークに接続している端末間であれば、ARKit3の機能だけでわりと簡単にできますが、モバイルネットワークを通して共有したり貼ったシールを永続化するところまでやりたいです。
最終的には、ライブ会場とかプリズムストーンショップとかをかわいいシールだらけにしたい。また、街中でふとアプリを起動してカメラ越しに見たらかわいいシールが貼られてた、ってなったらとっても楽しかわいいですよね。4