少ないポリゴン数で複雑な造形を表現できるノーマルマップですが、ノーマルマップだけで最大限の効果を発揮するのは限界があります。
ノーマルマップはスペキュラーマップやアンビエントオクルージョン、視差マップなどと同時に使うことで、最大限の効果を発揮することが出来ます。
ただ何時でもスペキュラーマップや視差マップを使用できる訳ではないですよね。
通路の壁や天井に配置された、ただの排気口を表現する為だけにカラーマップテクスチャーとノーマルマップの2つに更に追加で何かを使うのはリッチ過ぎます。
そこで今回はノーマルマップの効果を活かすカラーマップテクスチャーの描き方を紹介したいと思います。
通常のカラーマップテクスチャーにノーマルマップを追加
通常のカラーマップ と ノーマルマップ を用意しました。
![colormap_normalmap](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_00.png?resize=640%2C320&ssl=1)
この2つをUnityのPlaneに貼って表示してみます。
カラーマップ(UnityのAlbedo)のみ適用
![colormap_only](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_05.png?resize=500%2C498&ssl=1)
ノーマルマップを追加適用
![colormap_and_normalmap](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_04.png?resize=500%2C498&ssl=1)
ノーマルマップの効果で立体感が表現されています。
このままでも良いですがカラーマップに少し手を加えたいと思います。
カラーマップテクスチャーに工夫をしてノーマルマップを追加
通常のカラーマップテクスチャーを少し修正しました。
修正箇所が分かりますか?
立体的に盛り上がっている部分のピクセルを意図的に伸ばしました。
![修正テクスチャー](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_01.png?resize=400%2C400&ssl=1)
左が通常のテクスチャー 右がピクセルを伸ばしたテクスチャー
![tips_tex](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_02.png?resize=450%2C149&ssl=1)
ピクセルを伸ばしたテクスチャーとノーマルマップを適用してUnityで表示します。
![normalmap_and_tips_colormap_Hi](https://i0.wp.com/liquidjumper.com/Home/wp-content/uploads/2020/03/tips_normal_colortex_07.png?resize=500%2C498&ssl=1)
「立体的な部分にテクスチャーを貼った為にテクスチャーが伸びてしまった」様に見えませんか?
通常のテクスチャー と ピクセルを意図的に伸ばしたテクスチャーのどちらがより立体的に見えるでしょうか?
最後に
この方法は、以前(数年前?数十年前?) Unreal Engine3 の研究のために某○picGames社のデータを分析していた時に見つけた手法です。
あらゆる箇所でこの方法が使われている訳ではなかったですが、発見した時はとても感心した事を覚えています。
おそらく、そのデータを作成したクリエイターが色々と試行錯誤した中の一つがこの手法だったのだと思います。※Unreal Engine3の頃だったので尚更そう思います。
決して万能な手法ではないですし大きな効果が期待できる訳では無いですが、
いざという時に使えそうな覚えて損はないTipsの一つだと思います。
記事の中で使用しているノーマルマップはMAYAで生成しました。
ノーマルマップをMAYAで簡単に作る方法を紹介した記事です。
![]() |
|
3DCAD/3DCG/動画編集/ゲーム開発向けクリエイターPCを低下価格で購入できるFRONTIER
>>【FRONTIER】
▶最新GPUも格安構成も自由に選べる!パソコン買うならBTOの【FRONTIER】
[PR] TechAcademy/テックアカデミー
TechAcademy [テックアカデミー]![](https://i0.wp.com/www15.a8.net/0.gif?resize=1%2C1&ssl=1)
は、週2回のビデオチャットや、毎日のチャットサポート、現役プロのメンターから課題のレビューを無制限に受けられる等、マンツーマンのサポートで基礎からしっかり学習できます。
プログラミングやデザインなど沢山のコースがありますが、ユニークなのは「Python + AI」「Unity + iPhoneアプリ」のような複数のコースを受講できるお得な「セット割り」がある事。
機械学習の基礎が学べる「Pythonコース」 短期間でPython・機械学習が学べるコースPythonを基礎から学び、機械学習プログラムの開発をめざします。 Unityコース 短期間でゲームアプリを開発出来るようになるコースUnityの操作方法とゲームを動かす為のスクリプト、C#を学べます。
![]() |
|
![]() |
|
![]() |
|
![]() |
|
![]() |
|