【画像認識フレーム風シェーダー】DetectionFrameSuper 【VRChat想定】

Detection Frame Superは、VRChatのPCアバター向けに、身体・髪・衣装・アクセサリーへ追従する四角いフレームと接続線を追加するギミックです。

頭や手足など、好きな位置を登録するだけで、対象を検出・解析しているような演出を作れます。接続線は時間とともに一部の接続先を切り替えます。

ロボット、アンドロイド系、または写真家系のアバター表現に良いかなと思います。

NDMFにより自動的に作成されるシェーダーなので、ビルドして表示を確認してください。

アバターと同じアーマチュアを生成し、アーマチュア部分に小さな1ポリゴンのトライアングルを生成し、最後にシェーダーを生成する方式です

対応環境

・Unity 2022.3 で作成

・VRChat Avatars SDK 3.0

・VRChat PC版

パフォーマンスランクへの影響

ポリゴン：登録数と接続線で決まります。（300個登録した場合、約2000ポリゴン）

マテリアル：1

スキンドメッシュレンダー：1

使い方

①zipを展開し、「DetectionFrameSuper.unitypackage」をunityにインポートする

② コンパイル完了後、Hierarchy上のアバターを右クリックして「Detection Frame Super > 作成」を実行します。

③ アバターの子として「Detection Frame Super」が作成されます。同名のコンポーネントがInspectorに表示されます。「Detection Frame Super」のコンポーネントを確認します。

④ 「Tracking Targets」のドラッグ＆ドロップ欄へ、フレームを追従させたいBoneやTransformを登録します。（テストとしてArmature全てを登録する事を推奨します。）

⑤「パラメーターの使い方」を参考にフレームの色、サイズ、動きを調整します。

※シーン上に表示されているのはサンプルのフレームです。実際の表示のされ方はunityの再生にて確認してください。

⑥ unityの再生、またはビルド・アップロード時に、表示用のメッシュとMaterialが自動生成されます。登録したBoneへ直接追従するため、Detection Frame Super自体にMA Bone ProxyやMA Merge Armatureを設定する必要はありません。

⑦ 最終的なフレーム表示と接続線の巡回は、NDMF適用後のPlay Modeで確認してください。

パラメーターの使い方

【1. Tracking Targets：追従対象】

● Target Transform

「HierarchyからTransformをドラッグ＆ドロップ」と書いてあるところにフレームを表示したいオブジェクトやアーマチュアを

ドラッグ＆ドロップしてください。そうすると登録されます。

● Position Offset

対象から表示位置をずらします。

● Target Role

登録した点の役割を選びます。

・通常

線が接続したりしなかったりします。

・近接反応

近接反応または常時接続に登録した対象同士が近づくと線が接続されます。

・常時接続

常に線が接続してくれます。

・フレームのみ（線なし）

フレームだけを表示します。線は接続しません。

● Frame Scale

そのTargetだけのフレーム倍率です。注目させたい部分を大きくするなど、個別の強弱を付けられます。

【2. Frame Display：表示量・サイズ】

● Size Mode

「No Change」は距離によるサイズ変化を抑え、画面上の大きさを維持します。

「Perspective」は近くで大きく、遠くで小さく見える表示です。

● Minimum Pixel／Maximum Pixel（px）

No Change時の最小・最大サイズです。範囲内でTargetごとのサイズにばらつきを付けます。

● Minimum Size／Maximum Size（m）

Perspective時のサイズ範囲です。初期値は0.015〜0.03m。対象やアバターのスケールによっても見え方が変わります。

● Random Seed／Randomize

サイズのばらつきや接続パターンなどの基準値です。同じ配置でもSeedを変えると異なる結果になります。「Randomize」で値を変更できます。

【3. Frame Appearance：色・線幅】

● Base Color

通常時のフレーム・ラベル・接続線の基本色です。

● Thickness（px）

フレームの線幅です。

● Emission Strength

表示色の明るさを調整します。

【4. Frame Animation：フラッシュ】

● Flash Style

「Off」はフラッシュなし、「Color Change」はフレーム色の変化、「Color Change And Fill」はフレーム色の変化と内側の塗りつぶしです。

● Flash Color

フラッシュ時の色です。Alphaでフラッシュや塗りつぶしの濃さを調整します。初期Alphaは150です。

● Flash Frequency

フラッシュの頻度です。大きくすると活発な演出になります。

【5. Pseudo Label：疑似文字】

● Enable

フレーム右上のラベル表示を切り替えます。

● Pseudo Text

有効時は短い線を組み合わせた疑似文字、無効時は1本の横線を表示します。

● Length／Thickness（px）

ラベルの長さと線幅を調整します。

● Offset（px）

フレームに対するラベルの位置を調整します。

【6. Connections：接続線】

● Enable

フレーム同士を接続する線を表示します。

● Line Group Count

接続線の個数を調整できます。

● Short Line Length

接続線の長さを調整できます。

● Long Line Ratio

全グループに占める長い接続線の割合です。Line Group Countの数に合わせて本数が決まります。

「Current Mix」はShort／Longの本数、「Points per Line」は各グループの設定上の点数です。

● Proximity Range（m）

近接接続が反応する最大距離です。範囲内へ入ると距離に応じた確率で線が現れ、近いほど接続しやすくなります。

● Line Thickness（px）

接続線の太さです。

【7. Advanced Settings：詳細設定】

念のための機能なので、あまり使用しないでください。

● Depth Mode

Overlay：身体や壁に遮られず表示

Occluded：手前の物体に隠れる表示（基本的にアバター内にフレームが隠れてしまう）

● Distance Fade

観察者から離れた際に表示を薄くする機能です。

「Fade Start」から薄くなり、「Fade End」で消えます。

● Custom Material／Material

指定したMaterialを使用できます。

DetectionFrameSuper/Material内にあるマテリアルかビルド時に生成されるマテリアルを

登録すると設定をコピーできます。

● Scene Preview

ギズモの見本を表示します。

よくある質問

Q. 写真の可愛いアバター誰？

A. ミルティナちゃんです

https://booth.pm/ja/items/6538026

Q．衣装やアクセサリーにも使えますか？

A．アバター階層内の対象へ使用できます。MA Merge Armature／Bone Proxyを使用した衣装への適用と、同じアバターでの複数配置はできることを確認しました。

が、絶対の保証はありません。

Q．線があまり動かない、接続されない点があります。

A．常時接続が多ければ多いほど動かせる接続線が少なくなり、あまり線が動かない状態になってしまいます。常時接続は5,6個を目安に絶対に線を接続したいものだけにした方が良いです。

Q．unityのシーンでは1,2個しかフレームが表示されない

全部表示すると負荷がとんでもないことになったのでシーン上ではサンプルとしてちょっとだけ表示しています。

実際の見え方を確認する場合はunityの再生ボタンを

押してビルドしてください。

Q．壁には隠れ、アバターの身体には隠れない表示にできますか？

A．その区別には残念ながら対応していません。

Q．ドラッグ＆ドロップしようとするとインスペクターが変わって出来ない

A．インスペクターの枠の右上にあるロックボタンを押すとヒエラルキーで選択してもインスペクターの画面が変わらなくなります。

利用規約

CC0です

https://creativecommons.org/publicdomain/zero/1.0/deed.ja

勝手に同梱したり改造したりしても問題ありません。