search
LoginSignup
7

More than 1 year has passed since last update.

posted at

updated at

STYLY Mobile ARコンテンツ制作で使えるPlayMaker Tips

はじめに

こんにちは。
ARコンテンツの制作が好きな @koyoarai_です。

ARコンテンツ制作のプラットフォームは2020年現在、Instagram ARフィルターのSparkARや、SnapChatのLens Studioなど数多くあり、その中の一つにSTYLY Mobileがあります。STYLY MobileのARコンテンツ制作はUnityのPlayMakerで実装を行います。

今回、STYLY Mobile ARプラットフォームで1つ作品をつくりました。
そこでこちらでは制作に用いたPlayMaker Tipsを紹介します。

※ STYLY MobileについてはSTYLY公式のこちらのブログが参考になります。

環境

  • Unity 2019.3.6f1
  • Unity Plugin for STYLY 1.1.4
  • PlayMaker 1.9.0.p21

注意) Unity Plugin for STYLYやPlayMakerの更新によってこちらの情報が古くなることがあります。上記バージョンと異なる場合、公式から最新の情報のご確認をお願いします。

1. カメラの取得

STYLY Mobile上とUnityEditor上で動作するように、[GameObject is Null]によって2つの処理を切り分けられるようにしています。カメラを取得した後の処理は、state以降に追加するとわかりやすいです。

image.png

参考 : 【Unity/Playmaker】カメラの取得とカメラを使ったインタラクションの実装方法

2. Post-processing Stack v1の追加

STYLY Mobileでは2020年12月現在、Post-Processing Stack v1に対応しています。(v2は非対応)
Unity-Technologies/PostProcessingのv1ブランチからDLし、下記のPlayMakerを追加します。

image.png

VariablesのタブからPost Processing ProfileのInspectorにチェックを付け、PlayMakerFSMコンポーネントのControls→Post Processing Profileに設定したいProfileをアタッチします。

image.png

参考 : STYLYでPost-Processing Stackを使う

3. デバイスの向きを取得する

Device Prientation Eventで向き一つずつの処理を追加します。
今回は、Left, Right, Portraitを取得したかったので、その他はNoneに設定しています。

image.png

各stateに追加したい処理を記述します。

image.png

4. オブジェクトをカメラに追従させる (親オブジェクトをカメラにする)

親オブジェクトをカメラ(BackgroundPlane)にすることにより、オブジェクトをカメラに追従させることができます。

image.png

5. オーディオリアクティブ

PlayMaker 【Unity/Playmaker】オーディオビジュアライザの作り方の記事をそのまま参考にしました。

6. AR空間のカメラ映像の取得

Unity Plugin for STYLY 1.1.4ではいくつかPlayMakerのカスタムアクションが利用でき、その中にAR空間のカメラ映像の取得できる[Get AR Camera Image]と[Set Projection Texture Mapping]の2つのアクションが含まれていました。

Get AR Camera Imageでは、Textureに保存できるため自身のマテリアルのテクスチャに適用しています。

image.png

Set Projection Texture Mappingでは、マテリアルを直接指定する必要があります。

image.png

7. (おまけ) PlayMakerのテンプレート化

PlayMakerを右クリック→Save templateでテンプレート化することができます。テンプレート化されたPlayMakerはPaste Templateから呼び出すことができます。基本的に上記のようないくつかの場面で使えそうな機能はテンプレート化するのがおすすめです。
Pasted_Image_2020_12_29_15_07.jpg

Pasted_Image_2020_12_29_15_08.jpg

おわりに

以上、STYLY Mobile ARコンテンツ制作で使えるPlayMaker Tipsでした。
私はSTYLY Mobileでの制作で詰まった際、FacebookグループのSTYLY助け合い所さんに投稿しSTYLYの運営のみなさまに助言をいただく機会がありました。STYLY Mobileでの制作を行う場合、こちらへの参加もお勧めします。

STYLY Mobileは2020年6月にARコンテンツ制作が行えるようになったばかりなので、今後のアップデートにも期待したいです。

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
What you can do with signing up
7