Mostly Harmless

Legacy:Making Seemless Textures From Photographic Sources

From Unreal Wiki, The Unreal Engine Documentation Site
Revision as of 14:54, 27 February 2008 by AcidSphinx (Talk)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Tools Used:[edit]

  • A camera or other source for photographic textures
  • Texture Maker (to make the textures seemless) Link
  • Photoshop or other image editing software (to touch up the texture)
  • CrazyBump (to divide the texture into various maps) Link
  • UT3 Material Editor (to get them into the game)

The Process[edit]

For this example - I will be demonstrating two seperate images to illustrate the process, the originals can be seen in Tiles #01 and #02.

The first thing I do is make the texture the correct size, I load my photo-editing software. There are quite a few options in this step, from Bicubic Resizes to Cropping, I went with a resize, to achieve a height of 2048 pixels, and then cropped the image, while retaining its X-Y proportions so that there was no distorting, you can see the results in Tiles #03 and #04

I then save this, and open it in Texture Maker, I have shown on previous occasions how to use the resampler to resample textures, but with these textures too much detail is lost in the process, insted, this time I go to the function selection and choose the Make Seemless option, my preference is the Circle Blend, though you may like to experiment with some of the other options here, I process both the textures this way resulting in Tiles #05 and #06

Tile #05 Looks ok to me, and I think this will work in game, while looking at it closely you can see the blend, I think that it shouldn't show up to much in game, in Tile #06 however, the blending is readily apparent, and this will need to be touched up in an image editing program that has some form of clone-stamp.

Essentially these textures are done and ready for seemless tiling, but to capture the feel of their essence - one more step remains before bringing them into the Material Editor.

For the sake of making this easier on myself, I am only going to continue the rest of this example using the image shown in Tile #05.

I startup the CrazyBump Application, and open my image as a photograph, a momentary pause later I am at the screen shown in Tile #07. This screen llows you to choose if the brighter pixels are going to be higher or lower than the darker ones, like in this example if I want the roots to be raised or depressed over/into the soil, the image on the left shows the root raised, it is the one I want.

After selecting that, the next screen comes up as shown in Tile #08. I am not going to go into too much detail as to how the controls of CrazyBump work, and simply state that to the best of my knowledge, all the maps with the exception of the occlusion maps can be used in UT3 (maybe even the occlusion - though I am not certain of how - yet).

So after tweaking these maps through the sliding controls till the texture looks the way I want it, I save 4 of the 5 maps, then with my photo-editing software I combine the grey scale images into one image, each using it's own color channel, in this case I have put the specular on the red channel, and the displacement on the green, I could have optionally put the occlusion on the blue, but since I am not using it, I left it as solid white. (see Tiles #09 through #11).

I start up the UT3 Editor, and import my 3 textures. Then I make a material, in its most simple form it should look like as shown in Tile #12, though you can embelish it far more than this.

Image Tiles[edit]

Tile #01 : Rough Earth Image (Original is 3008x2000)
Tile #02 : Grassy Rock Image (Original is 3008x2000)
Tile #03 : Rough Earth Resized Image (Non-Seemless Variant)
Tile #04 : Grassy Rock Resized Image (Non-Seemless Variant)
Tile #05 : Rough Earth Resized Image (Seemless Variant)
Tile #06 : Grassy Rock Resized Image (Seemless Variant)
Tile #07 : Crazy Bump Z-Axis Selector
Tile #08 : Crazy Bump Main Interface
Tile #09 : Finished Seemless Texture (Diffuse Component)
Tile #10 : Finished Seemless Texture (Normal Component)
Tile #11 : Finished Seemless Texture (Specular and Displacement Components)
Tile #12 : A simple material showing where these textures go!