
UVシェルの内側の色を広げて縁を作成、ひいてはUVの間に余白を設ける必要性について解説されているサイトとその内容のメモ書きです。
UVをどう配置するかの話。
- UVは分かれているはずなのに、なぜか色が混ざったように見えてしまう
- UVは分かれているはずなのに、なぜかノーマルマップが意図しない結果になっている
そんな経験がある人はUV同士の間をあけて配置し、パディング幅を広げてみて下さい。
この記事では
fa-check-circle-oエッジパディングの役割
fa-check-circle-o解像度ごとの空間を最低限あけるパディングの目安
fa-check-circle-o各ツールでのエッジパディング作成の仕方(Photoshopで使えるフリープラグインも)
をまとめています。
UVシェルの隙間は大事です
- モデラー
関連記事モデラーにおすすめの記事
コンテンツ
参考サイト
エッジパディングとは?
ゲームモデルがテクスチャを使用する際、単一のテクスチャ画像(テクスチャアトラス)を用いることがあります。
この画像には、テクスチャとして使用されるUVシェルと呼ばれる領域と、それらの間に存在するガターと呼ばれる空白領域があります。
※1:テクスチャアトラスは個別テクスチャを一つのテクスチャにまとめる方法。他にはデカールシートなどと呼ばれています。
テクスチャフィルタリングとブリード
ゲームエンジンがシーンをレンダリングする際には、テクスチャフィルタリングが適用され、テクスチャを滑らかに表示するためにダウンサンプリングという処理が行われます。
このとき、ガターの色がシェルの内側の色と大きく異なる場合、それらの色がシェルに「にじみ(bleed)」が発生し、モデル上に継ぎ目(Seem)が発生することがあります。隣接するシェル同士の色が異なる場合にも同様のにじみが起こることがあり、テクスチャがダウンサンプリングされるにつれて、最終的にこれらの色が混ざり始めます。
要は周囲に同じ色の影響を与えてしまうことですね
エッジパディングの目的と仕組み
このような色の「にじみ」を防ぐために、各UVシェルの間のガターにエッジパディングを追加する必要があります。
エッジパディングは、UVエッジの内側に沿ったピクセルを複製し、その色を外側に向かって広げることで行われます。
これにより、シェルの周りに類似の色の縁が形成されます。
UVレイアウトを作成する際には、シェル間の間隔はエッジパディングを考慮して行う必要があります。
UVレイアウトと推奨される間隔
フィルタリングのサンプル。
今回は クリエイティブ・コモンズ 表示 - 継承 3.0 非移植 ライセンスのもと参考サイトの画像を使用します。
エッジパディングなし
一番左、512x512のテクスチャでエッジのパディングはありません。
白いピクセルは使用されている部分(シェル)、黒いピクセルは使用されていない部分(ガター)、UVの形状はピンクで表示しています。テクスチャがダウンサンプリングされると、ガターのピクセルがシェルにブリードします。
エッジパディングあり
4 pxのエッジパディングを使用しました。画像を見てわかるようにダウンサンプリングしてもブリードが少なくなります。最終的には、パディングされていない空のエリアもブリードします。
これを避けるために、全ての空のエリアを同じような背景色で埋めるか、十分なエッジパディングを作成します。
ガターの幅の重要性
ガターの幅も重要であり、推奨されるガター幅はパディング幅の2倍です。
ガターが薄いと、隣接するシェルの色が異なっている場合に、より早くにじみが発生します。薄いガターではすぐにブリードしてしまいます (白い矢印)。
512x512では、各シェルの周囲に少なくとも4ピクセルのエッジパディングが必要です。
この場合、最終的にブリードを回避するのに必要なのは幅8pxのガターです。
最小パディング
テクスチャサイズごとの推奨されるエッジパディングの量です
- 256 = 2px
- 512 = 4px
- 1024 = 8px
- 2048 = 16px
パディングの視覚的な確認方法
UV作成時に間隔を確認するための視覚的なガイドが必要な場合、UVエディターの背景画像としてチェッカーを使用するのが簡単な方法の一つです。
各チェッカーの正方形をパディング幅と同じサイズに設定します。
作例-512x512の画像に4ピクセル幅のチェッカーを表示する
512x512の画像に4ピクセル幅のチェッカーを表示するには、チェッカー画像を64回タイル貼りします。
パディングツール
テクスチャ ベイク ツールには通常、エッジ パディング機能があります。
- 3ds Max > Render To Texture > Padding
- Maya > Transfer Maps > Fill Texture Seams
- Substance Share > Dilate: Color by Bradford Smith
- Xnormal > Edge Padding
Photoshopには、エッジのパディングを行うためのいくつかの方法があります。
- Solidify:フリーのフィルターで、 端のピクセルをパッドアウトしてぼかしてくれるものです。
- フィルタ>その他>最大(※多分明るさの最小値):フィルターを実行する前に空の部分を黒で塗りつぶし、 空の部分をアンチエイリアス処理をしない選択範囲にしておきます。パディングがそれ自体に重なってしまうと、 パディングの色が明るくなりすぎてしまうので注意してください。
- Xnormal:XnormalにはDilationフィルターがあり、これがうまく機能します。このフィルターを実行する前に、UVシェルが一つのRGBレイヤーにまとめられていることと、ガターが透明になっていることを確認してください (削除されています)。
UVはギチギチに詰め込んではいけません
fa-check-circle-oUV同士が近いとお互いの色を拾ってしまうので間をあけましょう
fa-check-circle-oUVよりも大きくテクスチャカラーは描きましょう(又はフィルターでエッジを拡張しましょう)
fa-check-circle-o解像度やフィルタリング次第で作成すべきパディングは変わります
このあたりを念頭に置いてモデリング作業にあたるのがよさそうですね
Maya関連アイテム
動画で学ぶならUdemyがおすすめ!
Maya必須モデリング習得コース Maya Required Modeling Acquisition Course
Maya必須カメラ&ライト習得コースMaya Required Camera & Light Acquisition
Maya必須シェーディング&レンダリング習得コースMaya Required Shading & Rendering
書籍
アニメーション周りの書籍でもMayaが使われていることがあります。
アニメーション
モデリング
素体、髪の毛、衣装、アクセサリ制作のポイントを網羅。完成モデルデータ付きなのが嬉しいというかスゴイ。
基礎
伊藤電脳塾を書籍化したというこの本。ベーシックスというだけあって、基礎的な操作方法が網羅されており、Google検索で探しまわる手間を大分省いてくれます。
初心者もわかりやすく細かに解説されているので操作に迷うことはありません。
お手元に一冊どうぞ
リギング周り
■マヤ道
リグの実践的なノウハウを学ぶ前によみたい根本的なMayaの仕組みを理解することを目的とした本です。
初心者が躓きやすいポイントの解説もあります。Mayaユーザーなら1冊は持っておきたい良書です。何よりマンガで解説されているので、スッと入ってきやすい。
主人公(新人モデラー)の上司のつぶやきとして、セットアップ前のオブジェクトの不備についても触れられています。
■Mayaリギング 改訂版
実践的なリグの組み方を基本的なところからキャラリグまで学べる書籍です。
0ベースからリグを組み立てる工程をサンプルデータと共に解説しています。
リグを作成する際の具体的なルールやリグにおけるデフォーマーの使い方、ノードのつなぎ方、ドリブンキーの使用etc、実制作を通して丁寧に解説されています。
■『アニメーターズ・サバイバルキット』はアニメーターなら持っておきたい一冊 ■ポーズ作りに 関連記事レビューアニメーション関連書籍
体の可動域や体格による違いなどの解説もあるので、知識として一読しておきたい一冊
■廃盤になってしまったようなので高額な転売に注意
■アニメーションには直接関係ありませんが、画作りに一読しておきたい一冊