Difference between revisions of "Edge padding"
(Talk) |
(WikiName) |
||
| Line 1: | Line 1: | ||
__NOTOC__ | __NOTOC__ | ||
| − | * [[Polycount|Main Page]] > [ | + | <!-- ## page was renamed from Edge Padding --> |
| + | * [[Polycount|Main Page]] > [[2D Tutorials]] > Edge Padding | ||
| + | <span id="EP"></span> | ||
= Edge Padding = | = Edge Padding = | ||
| + | When game models are textured using a single texture sheet (decal sheet, or texture atlas), the texture will have UV'd areas (UV shells) and blank areas between them (gutters). | ||
| + | When a game engine renders a scene it uses texture filtering to smoothly render the textures, in a process called downsampling. If the gutters have colors that are significantly different from the colors inside the shells, then those colors will "bleed" creating seams on the model. The same thing happens when neighboring shells have different colors; as the texture is downsampled eventually those colors start to mix. | ||
| + | |||
| + | To avoid this, edge padding can be added to the empty spaces around each UV shell. Edge padding duplicates the pixels along the inside of the UV edge and spreads those colors outward, forming a skirt of similar colors. | ||
| + | |||
| + | When the UV layout is created, the spacing between the shells should be done with edge padding in mind. If the gutters between the UV shells aren't at least double the width of the edge padding, neighboring shells will tend to bleed together more quickly. | ||
| + | |||
| + | {| border="1" cellpadding="2" cellspacing="0" | ||
| + | |- | ||
| + | |} | ||
| + | |||
| + | {| border="1" cellpadding="2" cellspacing="0" | ||
| + | |- | ||
| + | |} | ||
| + | |||
| + | {| border="1" cellpadding="2" cellspacing="0" | ||
| + | |- | ||
| + | |} | ||
| + | |||
| + | <span id="MP"></span> | ||
== Minimum Padding == | == Minimum Padding == | ||
| + | Here are suggested amounts of edge padding to use for different size textures: | ||
* 128 = 2px | * 128 = 2px | ||
* 256 = 2px | * 256 = 2px | ||
| Line 10: | Line 33: | ||
* 1024 = 8px | * 1024 = 8px | ||
* 2048 = 16px | * 2048 = 16px | ||
| + | It works best when the UV gutters are at least twice this width, and the padding is extended to fill all empty areas (or the empties are flood-filled with a similar background color). | ||
| + | |||
| + | {| border="1" cellpadding="2" cellspacing="0" | ||
| + | |} | ||
| + | |||
| + | If you want a visual guide when creating your UVs, one easy way to see the spacing is to use a checker as the background image in your UV editor, with each checker square set to the padding width. For a 4-pixel-wide checker on a 512x512 image, tile the checker image 64 times... if you calculate that the checker image has 2 checker squares across it, then the checkers bitmap should be 8 pixels across for a 512 image, and 8 pixels goes 64 times into 512, so that means it needs to be tiled 64 times across your UV square. Remember though, that if your UV space isn't square, then the checker image needs to be tiled differently. | ||
| + | |||
| + | <span id="PT"></span> | ||
| + | == Padding Tools == | ||
| + | Texture-baking tools usually have an edge padding feature. | ||
| + | * 3ds Max > Render To Texture > Padding | ||
| + | * Maya > Transfer Maps > Fill Texture Seams | ||
| + | * Xnormal > Edge Padding | ||
| + | |||
| + | Photoshop has several methods for edge padding: | ||
| + | * Filter > Other > Maximum. <<BR>>Before running the filter, fill the empty areas with black, and make a non-anti-aliased selection of the empty areas. Beware that when the padding overlaps itself, it does so additively, over-brightening the pad colors. | ||
| + | * [http://www.xnormal.net/ Xnormal] has a Dilation filter that works well. <<BR>>Before running the filter, make sure the UV shells are together on a single RGB layer, and the gutters are transparent (deleted). | ||
| + | * Eric Chadwick has an Action called [http://www.ericchadwick.com/examples/files/UV%20padding%20from%20Alpha.zip UV padding from Alpha] that adds an 8-pixel edge pad. <<BR>>The Action is slow, but it greatly reduces pixel-streaking and is non-destructive. Before running the filter, make sure you have a non-anti-aliased alpha channel, with white shells and black gutters. | ||
| − | < | + | <<BR>> |
| − | * [[Polycount|Main Page]] > [ | + | * [[Polycount|Main Page]] > [[2D Tutorials]] > Edge Padding |
Revision as of 11:50, 7 July 2010
- Main Page > 2D Tutorials > Edge Padding
Edge Padding
When game models are textured using a single texture sheet (decal sheet, or texture atlas), the texture will have UV'd areas (UV shells) and blank areas between them (gutters).
When a game engine renders a scene it uses texture filtering to smoothly render the textures, in a process called downsampling. If the gutters have colors that are significantly different from the colors inside the shells, then those colors will "bleed" creating seams on the model. The same thing happens when neighboring shells have different colors; as the texture is downsampled eventually those colors start to mix.
To avoid this, edge padding can be added to the empty spaces around each UV shell. Edge padding duplicates the pixels along the inside of the UV edge and spreads those colors outward, forming a skirt of similar colors.
When the UV layout is created, the spacing between the shells should be done with edge padding in mind. If the gutters between the UV shells aren't at least double the width of the edge padding, neighboring shells will tend to bleed together more quickly.
Minimum Padding
Here are suggested amounts of edge padding to use for different size textures:
- 128 = 2px
- 256 = 2px
- 512 = 4px
- 1024 = 8px
- 2048 = 16px
It works best when the UV gutters are at least twice this width, and the padding is extended to fill all empty areas (or the empties are flood-filled with a similar background color).
If you want a visual guide when creating your UVs, one easy way to see the spacing is to use a checker as the background image in your UV editor, with each checker square set to the padding width. For a 4-pixel-wide checker on a 512x512 image, tile the checker image 64 times... if you calculate that the checker image has 2 checker squares across it, then the checkers bitmap should be 8 pixels across for a 512 image, and 8 pixels goes 64 times into 512, so that means it needs to be tiled 64 times across your UV square. Remember though, that if your UV space isn't square, then the checker image needs to be tiled differently.
Padding Tools
Texture-baking tools usually have an edge padding feature.
- 3ds Max > Render To Texture > Padding
- Maya > Transfer Maps > Fill Texture Seams
- Xnormal > Edge Padding
Photoshop has several methods for edge padding:
- Filter > Other > Maximum. <
>Before running the filter, fill the empty areas with black, and make a non-anti-aliased selection of the empty areas. Beware that when the padding overlaps itself, it does so additively, over-brightening the pad colors. - Xnormal has a Dilation filter that works well. <
>Before running the filter, make sure the UV shells are together on a single RGB layer, and the gutters are transparent (deleted). - Eric Chadwick has an Action called UV padding from Alpha that adds an 8-pixel edge pad. <
>The Action is slow, but it greatly reduces pixel-streaking and is non-destructive. Before running the filter, make sure you have a non-anti-aliased alpha channel, with white shells and black gutters.
<
>
- Main Page > 2D Tutorials > Edge Padding
