KobeHoloLens ミートアップ vol.5 での発表資料です。

1. 2022/03/21
福本良介もといホロモン

2. ・HoloLens2でトゥーンシェーダを使う！

3. ・アニメイラストのように影の境界線がはっきりとした見た目で
陰影の表現を行う描画をトゥーンレンダリングという。
・これを実現するのがトゥーンシェーダというプログラム。

4. ・アニメ調の陰影と主線が赤色のこの表現を再現したい！
出典：「デジモンアドベンチャー ぼくらのウォーゲーム！」より
(https://lineup.toei-anim.co.jp/ja/movie/digimon_wargame/)

5. これは「デジモンアドベンチャーぼくらのウォーゲーム」でデジタル
空間を表すために使われていた表現であり、劇中デジタル空間の生き
物や物体は主線が赤色で表示される。一方で現実世界側は主線が黒の
ままの見た目にすることで見ている世界の視点切り替わりを分かりや
すくしている。「ぼくらのウォーゲーム」は東映アニメーション初の
フルデジタル劇場映画で、映像表現で様々な試行錯誤が行われた作品。
その後、同じく細田守監督作品の「サマーウォーズ」でもこの表現が
使われている。子供の頃、解説本を読むまでこのことに気付けず、だ
から見やすいのかと感心した。映画としての完成度も非常に高いので
普通にお奨めである。40分の短編映画なので見やすいよ。ってか「サ
マーウォーズ」見るくらいなら「ぼくらのウォーゲーム」の方見ろ。

6. ・トゥーンレンダリングは一般的に描画負荷が高くなる
色々な後処理が行われるのが一因である
・かつHoloLensは描画性能があまり高くない
・ユニティちゃんトゥーンシェーダを利用してホロモンモデルを
HoloLens で描画したところ、FPSが著しく低下した
実は今回の発表より遥か前から試していたが
描画負荷やエラーで利用を断念していた
2017年5月の記事

7. ・lil(@lil_xyzw)氏が個人で開発しているトゥーンシェーダ
https://lilxyzw.booth.pm/items/3087170
・VRChatなどのアバターを用いるサービス向けに開発されていて
負荷の軽量化も重視されている
・表現に関する機能も豊富にあり
設定からONにした機能に応じて
シェーダが最適化される
・実際 VRChat でも人気らしい

8. ・デフォルトだと全ての機能が無効化された状態になっている
・Inspectorビューから機能ごとにチェックを入れて必要な機能を
有効化して利用する
・設定に合わせて最適化される
例えばファー(毛並み)シェーディングの
機能も含まれているが、有効化すると
描画負荷が重くなる
環境(今回の場合HoloLens2)に合わせて
利用する機能を選択する
今回は陰影と輪郭線の機能を利用した

9. ・同じホロモンモデルに以下のシェーダを設定してFPSを比較した
- MRTK 標準シェーダ(PBR)
- ユニティちゃんトゥーンシェーダ
- lilToon
・MRTKのビジュアルプロファイラーの
更新間隔を長めに設定することで
HoloLens2 上でのFPSを記録した
・ユニティちゃんトゥーンシェーダと
lilToon では輪郭線の機能を利用した

10. ・ホロモンの全体像が見える位置でキャプチャした結果は以下の通り
MRTK 標準シェーダ 60FPS
(HoloLens2の推奨FPSは60FPS)
ユニティちゃんトゥーン
シェーダ 35 ～ 45 FPS
lilToon 45 ～ 55 FPS
・lilToon だと推奨FPSに近い数値でトゥーンレンダリングができた！
・とはいえ、やはり通常のレンダリング(PBR)よりも負荷が高い

11. 出典：「デジモンアドベンチャー ぼくらのウォーゲーム！」より
(https://lineup.toei-anim.co.jp/ja/movie/digimon_wargame/)
「デジモンアドベン
チャーぼくらの
ウォーゲーム」では
主人公のPCに大量の
メールが送られてき
たことでデジモン達
のレスポンスが著し
く悪化してピンチに
陥るシーンがある。
子供の頃の私は「何てリアルなデジタルバトルの応酬なんだ！」
と感動したが今の私がこの作品の人物になれたとしたら「今すぐ
そのトゥーンシェーダを切れ」と言ってやりたい。

12. ・推奨の 60 FPSを目指してホロモンモデル自体の軽量化を行う
・今回はレンダリング負荷を減らす観点からオブジェクトと
マテリアルをできるだけ結合して数を減らしてみた
今回は瞳、尻尾、その他でまとめた
結果マテリアル数は 10 から 3 に減った

13. ・何故オブジェクトとマテリアルの数を減らすと負荷が減る？
・レンダリングは基本的にオブジェクトとマテリアルごとに
行われるので数を減らせばレンダリングの回数が減る
・実際はUnityがビルド時にマテリアルを
最適化したりするのであくまで目安で
ある事に注意が必要
・数が少ないに越したことはないので
見た目そのままに結合できる箇所は
結合しておくのをお勧めします
・Unity の Stats と Frame Debug で
変化を検証できます

15. ・HoloLens2 上でおおよそ 55 FPS で安定するようになる
推奨の 60 FPSに近い形でトゥーンレンダリングできた！

16. ・ユーザが近づいたりホロモンが大きくなったりして描画領域が
広くなるとやはり FPS は低下する
・トゥーンレンダリングの利用は必ず負荷が高くなるので要注意

17. 福本良介（ホロモン） Twitter:@HoloAdventure
・デジモン大好き！
・HoloLens 2 大好き！
・ぼくらのウォーゲームは30回くらい見た
技術ブログ書いてます(MRが楽しい)
https://bluebirdofoz.hatenablog.com/
ホロモンアプリを紹介するYouTubeチャンネル
(ホロモン開発ラボ)
https://www.youtube.com/channel/UCOtzLPAzBsVlsWFhg9eb3EQ

18. ・Holographic Monsters というアプリをリリースしました。
・デジタルなモンスターと
現実世界で遊ぶアプリです
・HoloLens 2 をかぶって
右のQRコードを見ると
インストール画面が出ます
・個人 HoloLens 2 勢の方は
是非遊んでみてください