非デザイナーが軽率に始めるセルルック表現

Transcript

1. 非デザイナーが 軽率に始める セルルック表現 にー兄さん(@ninisan_drumath) VRoidLT#1 in cluster

2. にー兄さん(@ninisan_drumath) 筑波大学 情報科学類 新3年 Humanoid制御, モーションキャプチャ, xR, 3DCG, Web, 言語処理系

   好きなことを好きな時に開発しています 最近VRoid熱が再加熱したタイミングでこのイベントを発見 →clusterにハマってしまい、引きこもりが加速している

3. こちらのスライドは公開します (たぶんSpeakerDeck)

4. スライドや資料動画など SNSへの投稿はOKです (むしろ共有・コメントなどして頂けると泣いて喜びます )

5. 初心者が作った資料です アドバイス等お待ちしております

6. agenda ❖ セルルックはお好きですか？ ❖ VRoid Studioでセルルック ❖ 3DCGレンダラー”Unity”について

7. セルルックは好きですか？

8. 私は好きです。うｎ あえて情報を欠落させることで生まれる”安心感” フォトリアルとはまた違った”味” 3Dキャラクターに宿った一種の”温もり” それ全部同じ事...

9. そもそもセルルックとは セル画のような質感を実現する表現方法の一つ NPRシェーダを使うことでパキッとした影を演出⇄PBR フル3Dアニメやゲームなどで用いられる ゼルダの伝説ブレスオブザワイルド 3rdトレーラーより 宝石の国より HELLO WORLDより 東雲めぐTwitterより

10. 今トゥーンシェーダがアツい[要出典] Uniteでセルルックやアニメ風レンダリングに関する講演が多数行 われている (きっと2020でもたくさん見られるだろうなぁ(願望))

11. セルルックを作るには？ トゥーンシェーダで作られたマテリアルを作る必要がある 主要なトゥーンシェーダは • MToon←VRMで標準的に使われる • UTS2.0(Unity-chan Toon Shader) もちろん自作もできる

12. セルとトゥーンとNPR(時間があったら解説) 厳密な定義はなさそう 1種の解釈の手助けとなれば NPR　　　：PBRとは違い、非現実的な表現をするための考え方 トゥーン　：NPRとほぼ同義で使われる？ セルルック：トゥーンの中でさらにセル画に寄せた表現

13. VRoid Studioでセルルック

14. セルルックを構成する要素 主に以下の3つ • 陰影 • アウトライン • リムライト

15. シェーダに関するアップデートによって、 VRoidだけでMToonの設定がほぼ完結するように VRoid Studio v0.7系からv0.8系の変更 VRoid Studioリリースノートより引用

16. シンプルに衣装はワンピースを選択 デフォルトのキャラをセルルックに作りこむ

17. [共通設定]＞[アウトライン]から 髪、顔、体の3つのマテリアルのアウトライン幅を設定 アウトラインの色は設定できないらしい [共通設定]＞[リムライト]から 髪、顔、体の3つのマテリアルのリムライトを設定 ライトの輝度、フレネルの強さなど設定不可 陰影、アウトライン、リムライトを設定

18. [共通設定]＞[陰影]から 髪、顔、体の3つのマテリアルの影入りの幅と影の硬さを設定 [影の硬さ]が1.0に近いほど 影がパキパキになってセルルックっぽくなる 影色の指定は各種テクスチャ設定からできる 陰影、アウトライン、リムライトを設定

19. 目指している表現とはちょっと違う気が... VRoidっぽさが残っている セルルックに設定したけど...。

20. デフォルトは色々書きこまれている(影や服のシワなど) →VRoidのいい所でもある →VRoidっぽさを増幅させる点でもある 解決策：テクスチャを変える

21. 肌、服、髪を塗りつぶしてみる(絵が描けないので塗りつぶす) テクスチャ変更１

22. テクスチャ変更１ ちょっと印象変わった気がする

23. 目の周りのテクスチャを変更 (特に日本人)目はキャラクターの印象を決定する重要な要素 アイラインや眉毛は カットアウトをかけることで階調を減らす まつ毛は最悪なくていいかも[要出典] テクスチャ変更２

24. 瞳テクスチャ描けない...いったいどうすれば... →無理せずBOOTHで買う アニメ風テクスチャは結構売ってる 無料配布も多数 →依頼する 絵が描ける人が周りにいると優勝できる テクスチャ変更３

25. 制服衣装で作っている人は MuRoさんの「アニメ風テクスチャ」がおすすめ テクスチャ変更３’

26. テクスチャ変更 ＋ちょっと髪を生やしてみる ＋ポストプロセッシング 欲しい画になってきた 結果

27. 紹介したセオリーを踏んで 作ってみたうちの子、”Sphyr” 瞳は友人に頼んで描いてもらい、 アイラインはBOOTHで購入したものを使用 現在v1.2 時間があれば ”うちの子”自慢

28. 最初に作ったものと見比べ 時間があれば ”うちの子”自慢

29. 3DCGレンダラー"Unity"について

30. 言わずと知れた”リアルタイム・3DCGレンダラー” 映像作品やVRアプリなど、様々なインタラクティブ・コンテンツの作成 が可能 なんと最近はゲームも作れる！（） Unityとは(哲学)

31. UniVRMによってインポートが楽にできる VRoid Studioではできない設定ができたり、 アニメーションさせたりゲームにしてみたり、、、 Unityによって可能性が広がる リアルタイムプレビューができる →画作りが捗る Unityをレンダラとして使っちゃおう！ 冗談はさておき...

32. ということで Unity＋VRoidで セルルック表現を実装する

33. 各種バージョンを以下に示す Unity：2019.3.1 UniVRM：0.55.0 VRoid Studio：0.8.3(warningが出るけど一応動く) UniVRMのバージョンによって Avatarアセットの取り扱い方(子プレハブか外部参照か)が変わってく るので注意 作業環境

34. • カラースペースをLinearにする • Directional Lightの色を白色にする • カメラのFoVを下げる ◦ モデル単体だと15くらいが可愛く映る ◦

    背景込みだと30くらい？(場合による) 肌の色や陰影を確認する上で重要 Unityで画作りをするうえでやっておくこと

35. Bias値を上げると良い陰が落ちることがある →乱用に注意 有識者の方、よかったらご教示いただきたいです... LightのBiasについて bias:0.05 bias:0.2

36. VRoid Studioではできない設定ができる！ →そもそもMToonの強力な機能群を備えている →各種マップの設定やMatCap、UV操作などができる マテリアルをさらに調整していく

37. 陰は形状を表現する→立体感 キャラクターに落ちる陰 円筒形を表現 ふくらみを表現 丸みを表現

38. インタラクティブコンテンツ →細心の注意が必要 下手に忠実な陰が落ちると 印象を悪くすることがある • ShadingShiftと ShadowReceiveを下げる • 影色をメインと同じにする cluster用アバターもそうしてます

    顔に落ちる陰

39. ちょっと髪の陰がコッテリしてる(個人の意見) →NormalMapを無効にする 髪に落ちる陰 髪に設定してあるNormalMap

40. Post-Processing stack v2によるポスプロ

41. Post-Processing stack v2によるポスプロ

42. 色々方法はある... なるべく無料でやりたい • Tポーズ＋AnimationRiggingで 四肢のIK制御と視線制御 • とりすーぷさん謹製FingerController で指制御 • BlendShapeProxyで表情制御

    Unityでポーズをつけて撮影したい(時間があれば話す)

43. ただうちの子が散歩するだけ 使用アセット一覧 • AnimationRigging • Cinemachine • Post-Processing stack v2

    • UniVRM • Anime Girl Idle Animations Free • RPG Poly Pack Lite • Fantasy Skybox FREE • Aura2 デモ動画

44. 終わりに

45. VRoid Studioだけでセルルックなキャラクターが作れた →実際すごい感動している Unityと併用→真価を発揮 ホントはUTSとかSRPの話もしたかった...(電池切れ 終わりに

46. 軽率に VRoidを使っていこう

47. ご清聴 ありがとう ございました にー兄さん Twitter: @ninisan_drumath GitHub: @drumath2237