6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

STYLYAdvent Calendar 2024

Day 2

STYLY Mobileの平面検知、実は天井でも使えます。

Last updated at Posted at 2024-12-01

はじめに

STYLY Mobile皆さんは使ってますか?最近はイベントタブが増えて、STYLY Mobileを利用したイベントも開催されてますね。今回の記事はSTYLY Mobileのお話なので、お手元のスマホにまだインストールされてない方は、ぜひお手元でアプリを起動しながらご覧ください。
STYLY Mobileのインストール方法
AppStore
GooglePlay

本題ですが、STYLYでARを初めて作る方はきっとSTYLY Studio標準のAR Templateをベースに作るはずです。STYLYの標準のAR体験は、任意の床面にARを登場させるものになります。任意の床面に登場させるために平面検知するわけですが、平面を認識するとその位置にアイコンが出ます。こんな感じ。

では、そのまま天井にスマホを向けるとどうなるでしょうか。

ご覧の通り、天井でもばっちり認識してますね。いつから私たちはSTYLY MobileでのARは床にしか出せないと誤解していたのでしょうか。

ぜひ、これを機に皆さんも天井AR作ってみてください。
<完>

ここで終わってもよかったですが、折角なのでもう少し天井ARについて考えてみます。

STYLY Studioで天井ARを作る

普通にSTYLY Studioで作るときは、原点より高い位置に置きます。これにより、床に置いてあるように見せているわけです。
image.png

天井ARをする場合は逆に、原点より低い位置に置きます。これにより、天井にぶら下がっているように見えるわけですね。
image.png

上記シーンを公開しました。実際に動かしてみます。
床面ARすると、床より下に配置したゴリラが見えませんね。
IMG_5023.PNG
逆に天井ARすると、天井より上に配置したゴリラが見えません。
IMG_5024.PNG
これはSTYLY StudioのEnable AR Occulusionアセットを配置していることで、現実のモノに合わせて奥行き表現してくれてるわけです。
image.png
この機能のおかげで、1つのARコンテンツを作るだけで床面も天井も両対応でどこにでもゴリラを登場させられるコンテンツを作ることができましたね。

それ以外の天井AR利用方法で思いつく使い方として、天井を突き抜けて空が見える、といった表現でしょうか。
STYLY Studioの注意点で、Skyboxで空を配置するとVRコンテンツと認識される点に注意して作ってみてください。代わりに空の画像などを配置するイメージですね。また、天井より奥に配置したものは、前述のEnable AR Occulusionにより見えなくなってしまいます。これを回避するためにEnable AR Occulusionを削除してください。
これだと天井を突き抜けた感が出しにくいので、任意の形状のオブジェクトを使ってOcullusionさせることができます。STYLY Studioで3D Object->PrimitiveからBoxなど配置し、ModifierでAR Occulusion Maskを追加するだけです。Modifierをご存じない方はマニュアルをご覧ください。
image.png
さて、この機能を使って適当に1つ作ってみました。最近のアニメでダンダダン見てるんですが、妖怪などいきなり出会っちゃった感しますかね。しますね。してます。
IMG_5027.GIF

おわりに

そろそろ皆さん、天井ARの可能性に気付いてきたのではないでしょうか。
STYLYのARはほかにもImmersalなどVPSを利用したものが主流になりつつありますが、たまにはユーザーに天を仰がせてやりましょう。

6
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?