[VRChat] Shadowdepth Shader(史上最高のなでなでを追い求めるVRC民に贈る深度影再現シェーダー)の導入

## ⭐️目的

なでなでする時に手や身体をを近づけると影になるようにする


## ⭐️参考

https://wataame89.booth.pm/items/3257870

https://docs.google.com/document/d/1waSVTCqJTdRDpRWOcl9ikhC8srv6wUaENyBBUZOc-TM/edit?tab=t.0#heading=h.5vfappnwh0nh

### ☂️公式

https://wataame89.booth.pm/items/3257870

https://docs.google.com/document/d/1waSVTCqJTdRDpRWOcl9ikhC8srv6wUaENyBBUZOc-TM/edit?tab=t.0#heading=h.5vfappnwh0nh


## ⭐️インストール

https://wataame89.booth.pm/items/3257870

![スクリーンショット 2025-06-08 15.46.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/cc194df8-936f-4c1d-a4fd-1dca0c53f980.png)


- 購入してファイルをクリック


## ⭐️使い方(体全体に反映させる)

:::note warn
着せたい衣装によって身体全体だときれいに反映されないことがあった
:::

shadowdepthの場合 (手の部分だけや身体の一部など部分的に反映させる)

shadowdepth_bodyの場合 (体全体に反映させる)

https://www.youtube.com/watch?v=XYJLr7JKmSs&ab_channel=%E7%B6%BF%E9%A3%B4%E5%B1%8BWataameya

### ☂️機能を設置する

![スクリーンショット 2025-06-08 15.19.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/2fe4cd00-b738-4a1e-85c0-0e8c9b8c8657.png)

- body_baseを選択する(アバターによっては名前が違うの身体が囲まえれてるところを探す)

![スクリーンショット 2025-06-08 16.08.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/9249efe9-f23a-467f-b55d-a2d3f20239ee.png)


- アバターの本体の中のbody_base(アバターによって名前が違う)
- 右上のロックをする(使い終わったら外す)

![スクリーンショット 2025-06-08 15.55.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/8124ca60-07b3-47f7-b532-e4e89678667c.png)

- assetsの画像の部分のフォルダを開く shadowdepth_bodyを選択する
- assetsの中から画像の場所を探してshadowdepth_bodyを次の場所にドラッグアンドドロップする

![スクリーンショット 2025-06-08 16.10.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/4a8fb909-271c-4b0c-8239-3b70498b228a.png)

- body_baseのコンポーネントのskennd mesh renderのmaterialsを開く
- プラスボタンを押して要素1を増やす
- ここにshadowdepthをドラッグアンドドロップする

::: note info
順番によって影響が出るかもしれないから要素の順番は0番以外を入れ替えて動作確認の時に試してみる
:::

### ☂️動作確認

![スクリーンショット 2025-06-08 16.14.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/05f40ed1-f82f-48a9-a6f5-cd63dd2af3f8.png)


![スクリーンショット 2025-06-08 16.14.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/3f37d641-b8c3-45c8-9be3-1b710e58e05c.png)

- 各向きから動作を確認して影ができていれば大丈夫


## ⭐️使い方(手に反映させる方を利用する)

shadowdepthの場合 (手の部分だけや身体の一部など部分的に反映させる)

https://www.youtube.com/watch?v=7rruL2N44b4&ab_channel=%E7%B6%BF%E9%A3%B4%E5%B1%8BWataameya

shadowdepth.prefabの場合 (手に反映させる)

### ☂️機能を設置する


![スクリーンショット 2025-06-08 19.06.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/d485dfe7-fd99-44f6-845d-e1b2e9766e01.png)

- assetsから画像の通りprefabファイルを選択する

![スクリーンショット 2025-06-08 19.12.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/375cce2f-8c2f-414c-866c-f5342f79ae5a.png)

- 画像の場所にドラッグアンドドロップする
- 右左のどちらに使ってるかわかる名前に変える

:::note info
(自分から見てではなくアバターからみて右か左かの名前にする)
:::


![スクリーンショット 2025-06-08 19.18.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/0c9b020f-e706-4d94-b11e-ce938be1c575.png)

- 左上の上から2番目のアイコンを押す
- 矢印で動かせるので右手に持っていく

![スクリーンショット 2025-06-08 19.21.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/30bd597a-f057-49de-8668-5521e250db2d.png)

- 画像のフォルダの用に手があるフォルダを探してそこにドラッグアンドドロップしてshadowdepthを移動する

![スクリーンショット 2025-06-08 19.24.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/13a535e9-e266-4f87-8c5c-0bc2cace6321.png)

- shadowdepthをクリックするとコンポーネントができてる
- materialのコンポーネントがあるから有効範囲を確認モードで黒い球体を透明化する

![スクリーンショット 2025-06-08 19.22.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/610706/87e6635d-8df8-4d1e-9e9b-b416c646eb30.png)

- 左上のハンドマークを押して手に近づけて影ができてるか確認する

:::note info
同様に反対の手にも実装する
:::