CGBoxの一部の記事にはアフィリエイト広告が含まれております。
【Unity】トゥーンシェーダーの使い方・自作方法解説
こんにちは！Unityでアニメ風のキャラクターを表現したい！という方は多いと思います。
そんな時に活躍するのがトゥーンシェーダーです。
本記事ではトゥーンシェーダーの使い方・自作方法について紹介します！
目次
トゥーンシェーダーとは
トゥーンシェーダーとは、３Dモデルをアニメ風に描画する手法のことです。
輪郭線やはっきりした陰影をつけることで、アニメの印象に近い表現を実現しています。
Unity内ではマテリアルにシェーダーをセットし、影がかかる部分とかからない部分の色を
調整することでトゥーンシェーダーを実現することができます。
URPには対応している？
トゥーンシェーダーはURPにも対応しています。
他にもBuilt-in Render Pipeline、HDRP などすべてのレンダーパイプライン用にシェーダの設定項目が
用意されているので、適切なシェーダーを選択することでトゥーンシェーダーが利用できます。
トゥーンシェーダーの使い方
ここからはトゥーンシェーダーの使い方を解説していきます。
以下のような順番で設定項目を進めていきます。
- トゥーンシェーダーアセットをインポートする
- マテリアルにトゥーンシェーダーを適用する
- 3つのカラーを設定する
- パラメータを調整する
- アウトラインを設定する
トゥーンシェーダーアセットをインポートする
今回はユニティちゃんのトゥーンシェーダーのアセットを使用して解説していきます。
下のサイトからアセットをダウンロードしましょう。
ライセンスに同意し、データをダウンロードするボタンを押します。
下の青文字のユニティちゃんトゥーンシェーダー2.0をクリックします。
DOWNLOADボタンからだと３Dモデルの入っていないバージョンがダウンロードされてしまいます
下の黄色のリンクをコピーアンドペーストでgithubのサイトにアクセスします。
CodeボタンからDownloadZIPボタンでダウンロードできます。
ダウンロードできたらZIPファイルを解凍しましょう。
解凍されてできたフォルダをUnityプロジェクト内にドラッグアンドドロップします。
インポート時コンソールにエラーが出ますが、トゥーンシェーダーの設定は問題なく進めることができます。
これでトゥーンシェーダーのアセットがUnityプロジェクト内にインポートできました。
マテリアルにトゥーンシェーダーを適用する
続いて、マテリアルにトゥーンシェーダーを適用していきます。
まずはユニティちゃんの3Dモデルをシーンに配置しましょう。
下のようにUnityChanフォルダ→Assets→UnityChan→Modelsの中に3Dモデルがあります。
これをヒエラルキーにドラッグアンドドロップします。
ユニティちゃんが配置できました。
このモデルのマテリアルを変更していきます。
このモデルのマテリアルには、ユニティちゃんの3Dモデルが入っていたフォルダ内
Materialsフォルダの中のdef_matが適用されています。
def_matのインスペクターを開きます。
Shader項目をクリック→UnityChanToonShader→Toon_DoubleShadeWithFeatherを選択します。
ここまで設定できると、モデルが少し黄色くなったかと思います。
これはDirectional Lightの色が反映されているので、ライトの色を変えるとモデルの色も変わります。
ライトカラーを白に設定しておきましょう。
3つのカラーを設定する
続いて、def_mat内の3BasicColorsSettingsを設定していきます。
Base Mapは影がかからない領域、1st ShadeMapは薄めの影がかかる領域、
2nd ShadeMapは濃いめの影がかかる領域のことです。
この3つの領域にメッシュを塗り分けることで、トゥーンシェーダーを表現することができます。
Base Mapと1st ShadeMapの２つを設定するだけでも、基本的なトゥーンシェーダーが作れます。
BaseMapにテクスチャを設定していきましょう。
BaseMapの左の◎ボタンをクリック→utcで検索→utc_all2_lightを選択します。
続いて1st ShadeMapを設定します。
BaseMapの右のNo Sharingをクリックします。
するとWith 1stShadeMapとなり、1stShadeMapに同じテクスチャが設定されます。
1st ShadeMapの色を選択し、グレーに変更しましょう。
これで基本的なトゥーンシェーダーは適用できました。
ライトの位置や向きを変えて影のできかたを色々確認してみましょう。
パラメータを調整する
パラメータを調整することでよりリアルな表現を作ることができます。
BaseColorStepを変更することで、影の領域の大小を変更できます。
また、デフォルトでは影がかからない領域と影がかかる領域がハッキリと分離されています。
Base Shading Featherを変更することで境界のぼかし具合を変更することができます。
アウトラインを設定する
アウトラインの太さや色を設定することも、トゥーンシェーダーの表現において重要です。
マテリアルのインスペクター内のOutline Settingsからアウトラインを設定することができます。
下のように、Outline Widthでアウトラインの線の太さを変更することができます。
またOutlineColorからアウトラインの色を変更することもできます。
下の画像では太い黒線でアウトラインを設定しています。
トゥーンシェーダーの高度な使い方
髪のツヤを表現する
トゥーンシェーダーで髪のツヤを表現することもできます。
def_matを複製し、髪用のマテリアルを作成しましょう。
マテリアルを適用させたい髪のオブジェクトは、下のようにMesh_SD_unitychan内にあります。
複製したdef_matの名前をhair_matとでも変更し、_Fhairと_Fhair2にドラッグアンドドロップします。
続いてhair_matに髪のツヤ用のMatCapを設定しましょう。
インスペクター内のMatCapが「Off」になっているところをクリック
Activeになるので、MatCapSampler横の◎をクリック→「hi」で検索→HiLight_Matcapを選択します。
これでユニティちゃんに髪のツヤの表現が追加されました。
目の周りのアウトラインを消す
キャラクターに濃いアウトラインを設定した時に目のイメージが変わってしまうことがあります。
OutlineSamplerにテクスチャを設定することで目の周りのアウトラインを消すことができます。
OutlineSampler横の◎をクリック→outで検索→utc_all2_outlinesmplerを選択します。
すると下のように目の周りのアウトラインが消え、キャラクターのイメージをそのままにアウトラインを設定することができました。
トゥーンシェーダーのおすすめアセット
Liltoon
あわせて読みたい
【無料】lilToon - lilLab - BOOTH
アバターを用いたサービス（VRChat等）向けに開発したシェーダーで以下のような特徴があります。 ● 簡単（プリセットからワンクリック設定＆自作プリセットの保存、色調補...
Liltoonは無料で利用できる、高性能なUnity用シェーダーです。
VRChat向けに開発されており、簡単・軽量・美麗なのが特徴で
トゥーンシェーダーを使い始めるならまず持っておきたいアセットです！
すべてのレンダリングパイプラインにも対応しています。
RealToon (An Anime/Toon Shader)
あわせて読みたい
RealToon (Pro Anime/Toon Shader) | VFX Shaders | Unity Asset Store
Add depth to your next project with RealToon (Pro Anime/Toon Shader) from MJQ Studio Works. Find this & more VFX Shaders on the Unity Asset Store.
こちらはより本格的なトゥーンシェーディングを使いたい方におすすめのアセットです。
キャラクターをよりリアルなアニメ風に表現することができます。
機能が非常に充実しており、今でも頻繁に更新されているアセットです。
Toony Colors Pro 2
あわせて読みたい
Toony Colors Pro 2 | VFX Shaders | Unity Asset Store
Add depth to your next project with Toony Colors Pro 2 from Jean Moreno. Find this & more VFX Shaders on the Unity Asset Store.
Toony Colors Pro 2は、独自のトゥーンシェーダーを簡単に作成できるアセットです。
使いやすさにこだわって作られておりドキュメントも充実しているので
初めてトゥーンシェーダーを使う方にもオススメできます。
まとめ
以上、トゥーンシェーダーの使い方について解説してきました。
本格的なアニメ風のモデルを制作したい方はぜひマスターしたい機能ですね！
この記事が気に入ったら
フォローしてね！
