SparkAR 時間制御と3Dモデル切り替え
SparkAR中級者向けの記事です。(大体の記事はタップしてなにかするレベルなのでたぶんです)
「Question Person」というInstagramのARフィルターをツクりました。
写真や動画など、誰なのかあてるクイズに使えるフィルターです。実況でゲストがだれかあてるものにも使えます。
その過程での技術的なメモです。
ARフィルターの内容は、10秒間顔をマスクで隠します。その間マスクの「?」は点滅してます。
そして10秒後はマスクが消えて、誰だかわかります!
誰がしゃべっているかゲストを当てるクイズ、最後にどんな顔をしてるでしょう?といった使い方ができるお楽しみフィルターです。日本などの顔を隠す文化へのカウンターカルチャーでもあります。
ARはこちらからぜひ使ってみてください。
>>>>リンク入れる予定
さて。
私のビジュアルプログラミングの流れ
①まず、やりたいことをメモ書きしました。
chatGPTに頼むような箇条書きです。
・10秒間マスクを点滅させる
・マスクの点滅とは?付きマスクの表示・非表示を繰り返す
・10秒経過したらマスクは一切非表示になる
まあ、プログラミングするとややこしくなるけどやりたいことはシンプルですね。
15秒間のInstagramのリールやストーリーズで使いやすい時間設定をしました。
②3Dモデルの準備
Blenderで2種類用意しました。?とマスクで分けても良かったのですが、容量に余裕があったので「白マスク」と「?付き白マスク」でツクりました。
blenderで?の文字をマスクに吸着したのですが、FBXだと荒れていたので今回はglbファイルで書き出しました。
③PatchEditor
まず、SparkARのテンプレートでFace decorationを選びます。青い眼鏡のやつです。
で、できあがったPatchの構成がこちら。ややこしいですね。
録画を開始したらRuntimeを0リセット。
Runtimeが10秒以内はLoop AnimationでmaskOn(?付き白マスク)を点滅。Notをつかって最終的に非表示にしてます。
Runtimeが10秒以上はMaskOFF(白マスク)を非表示にするだけです。3Dモデルのvisibleはboolean型なのでPulseやSwitchで数字から変換してますね。
少し調整
動かしてみて、気になったところを調整します。
ちなみに時間制御でARの動きを再確認するには一番左端のバーにRestartボタンがあります。
気になったところ①?の点滅をもう少し早くしたい
気になったところ②いきなりマスクが外れるので外れる前に白マスクの色を変えたい
①は点滅の間隔を早くするだけなので、該当のLoop AnimationのDurationを1→0.5にしました。
秒数の関係で最終的にマスクがついたままになったので、NotのPatchを削除。
②は経過秒数によってマテリアルを変えることでできました。
Patchはこちらの下部です。
5秒を超えたらGreater Than でIf Then Elseをパッチの歯車でColor型にします。間にPulseやらSwitchはつなごうとすると自動で補完されます。5秒を超えたらマスクを薄い赤、それまでは白にします。
マスクは2つ重ねていたので、assetの各3DモデルのマテリアルからプロパティのTextureから矢印アイコンからPatchをツクります。オレンジの2つですね。
無事調整OK!
最後に
なんとか動く形にできました!
SparkARであがっている基本的なレクチャー動画は多いけど、少し専門的にやりたいことがあると調べるのが大変ですね。chatGPTもまだまだ執筆時点ではイマイチ。
そんなわけで、もしお役に立ったらBraveBrowzerやARフィルターをシェアしてくださいね。
InstagramのARフィルターの「Question Person」はこちらから
商用でのご利用は本サイトの問い合わせよりご相談ください。
【お知らせ】
SnapChatでも同じQuestionPersonのARフィルターを作る予定です!
また、NFTのPRにも使えるARフィルターを2023年6月中に公開予定です。
SNSのフォローやサイトのブクマで応援よろしくお願いします〜!
目を引く個性的な最新デザイン・クリエイティブを発信中。
【3D/AR/AI/メタバース/イラスト】 生活をより良く、よい体験を作ります。