Unity│簡単設定!ユニティちゃんトゥーンシェーダーでアニメ調にする方法

ユニティちゃんトゥーンシェーダー(UTS)を使って、3Dモデルをアニメ調の見た目にする方法を紹介します。

影用テクスチャの作成からマテリアル設定まで、基本的な手順を解説します。

目次

必要なデータのダウンロード

モデルデータ

今回はキズナAIのモデルを使用します。

ダウンロード:https://kizunaai.com/download/

ライセンス表記:@Kizuna AI

ユニティちゃんトゥーンシェーダー2.0

下記URLからダウンロードします。

ダウンロード:http://unity-chan.com/download/releaseNote.php?id=UTS2_0

解凍後、「UTS2_ShaderOnly_v2.0.3.unitypackage」をインポートします。

ライセンス表記:© Unity Technologies Japan/UCL

影用テクスチャの作成

トゥーンシェーダーでは、明るい部分と影の部分で別々のテクスチャを使用します。元のテクスチャを加工して影用テクスチャを作成しましょう。

手順

1. 影用テクスチャの候補を選択

目関係以外のカラーテクスチャを選びます。

影用テクスチャの候補

2. 影用テクスチャの作成

Photoshopで開き、明るさ・コントラストを下げて暗くします。

明るさ・コントラストの調整

3. 影用テクスチャの保存

「〇〇_dark」という名前で別名保存します。

マテリアルの作成

顔用のマテリアルを作成します。名前は「face_toon」とします。

シェーダーは「Toon_DoubleShadeWithFeather」を選択します。ユニティちゃんトゥーンシェーダーには多くの種類がありますが、今回はこれを使用します。

マテリアルの作成

マテリアルの調整

カラー設定

基本のベースカラーと影の設定です。

  1. BaseMapにface、1st_ShadeMapと2nd_ShadeMapにface_darkをアサイン
  2. BaseColor_Step(0.3)でステップを決め、Tweak_SystemShad(0.4)を調整
  3. ShadeColor_Stepは0に設定
  4. Base/Shade_Featherに値を入れると光と影の境界線が柔らかくなる
カラー設定

ハイライト設定

テカリの表現です。肌、布、金属など質感ごとに調整します。

  1. Is_SpecularToHighColorにチェック
  2. Is_BlendAddToHiColorにチェック
  3. HighColor_Powerをお好みで調整(例:0.06)
ハイライト設定

リムライト設定

輪郭の回り込み表現で、立体感が出ます。

  1. RimLightにチェック
  2. RimLightColorに肌色の暗めの色を設定
  3. RimLight_Power(例:0.1)をお好みで調整
リムライト設定

アウトライン設定

輪郭線の設定です。

  1. Outline_Samplerに白テクスチャをアサイン
  2. Outline_Widthで線の太さを調整
  3. Outline_Colorで線の色を設定
アウトライン設定

アウトラインの調整

白目部分にアウトラインが出てしまう場合があります。

白目部分の問題

Outline_Samplerのテクスチャを加筆して、アウトラインを出したくない部分を黒く塗りつぶします。

テクスチャの加筆

他のパーツのマテリアル作成

服や体なども同様に作成します。顔のマテリアルを複製して、それぞれのテクスチャをアサインしていきます。

他のパーツのマテリアル

調整のポイント:

  • 目はそのままのマテリアルを使用
  • 髪の毛のアウトラインは顔より細く(例:2程度)

プレビュー確認

元のベースからライティングが反映されていることを確認します。

シェーダープレビュー

ライトを回転させた場合の見え方です。

ライト回転時のプレビュー

まとめ

ユニティちゃんトゥーンシェーダーの基本的な設定方法を紹介しました。

設定のポイント:

  • 影用テクスチャは元テクスチャを暗くして作成
  • BaseColor_StepとTweak_SystemShadで影の出方を調整
  • リムライトで立体感を追加
  • アウトラインはパーツごとに太さを調整

トゥーンシェーダーは求めるルックをイメージしてから調整しないと時間がかかります。

まずは基本設定を試してから、テクスチャやライティング、ポストエフェクトで仕上げていくのがおすすめです。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次