loonygames' Graphic Content

| - Contents - About - Submissions - Feedback - Archives

volume 1, issue 17

Today in loonygames:

New!! The Archives have been cleaned up, fead links fixed, and printable versions restored! Also, don't miss the new comments on the front page!

Livin' With The Sims: theAntiELVIS explores the wild and wacky world that is Will Wright's The Sims, asking the inevitable quesiton, "is The Sims the first step toward a virtual life where everyone is Swedish?"

Pixel Obscura: Josh Vasquez on Omikron: The Nomad Soul.

Real Life: Check out our newest comic strip, Real Life! Updated daily!

User Friendly: Updated daily!

Related Links:

DRAW Partner!: Chris Buecheler's article on games and 2D art.

The Texture Studio: Chris' texture home page, with tons of textures for you to download.

Feedback:

You've got an opinion...voice it! Drop a line to our Feedback column...you could end up with a free T-Shirt!

Random Feature :

User Friendly: the comic strip for geeks. Updated every day, right here at loonygames.

Search the Archives!

Graphic Content:
General Texture Tips

By Christopher "shaithis" Buecheler

o here's the deal...

I was going to jump right into various "mapping" tech; bump-mapping, environment-mapping, diffusion-mapping, etc....But I've received a couple of requests for a hand-drawn texture tutorial. I want to get that done for you guys first, because I want to do the mapping articles right in a row. Additionally, I've got an interesting idea for a comparison article (I'm going to take two games, compare and contrast their textures. Should be pretty cool). So...the mapping stuff's going to come later on. I don't think you're too worried. It'll be more fun to read about when tech that actually supports it is either out, or close to out, anyway.

Now then. Today's article is a compilation of general texture tips I've come up with over the past year or so that I've been doing this sort of thing. This way, I've got a few weeks to make and write about the hand-drawn texture. Additionally, it lets me pimp a site I just opened up, The Texture Studio. I'm using that site to release (literally) hundreds of textures, and can look at those to see firsthand how a lot of these tips have been applied. I've already got two 100+ texture packs up for download, and I'll be releasing another one this Saturday. So if that kind of thing interests you either for educational purposes (I don't claim to be the best texture designer on the earth, but I truly believe that everyone can learn something from everyone else), or for level designing purposes, make sure to stop by. There...pimping done with. Let's get to some tips. :)

Offset

The offset filter (filter:other:offset) is one of the most important tools a 2D texture artist has to work with. There's simply no better way (short of the method that Wally uses, but they haven't activated 24-bit support yet) to work on a tiling texture. The offset filter allows you to see the four edges of your work as the center of your image. Remember to always use a horizontal and vertical value of exactly have of each value's total size (i.e. if you have a 512x256 texture, you would offset it 256x128, do your work, and offset it 256x128 again to return it to its original position).

Patterning

The best way to locate "artifacts" (that is, pieces of your texture that really stand out as repeating when the texture is tiled) is to run the texture in-game. However, that's time consuming and frustrating. The next best, and far faster way, is a method that's discussed in the new Half-Life texture SDK, and one I've been using for some time now: Patterning.

When you finish a 256x256 texture, even when you've offset it to check for seams, don't automatically assume it's engine-ready. Though no artist or game is perfect, and highly visible repeating textures do make it into finished game occasionally, it's best to avoid it as often as possible. First, select all (ctrl-a). Define your selection as a pattern (edit:define pattern). Make a new canvas (ctrl-n) that's 512x512 (or even 1024x1024). Fill it with the pattern (edit:fill - select "pattern" from the dropdown). Now what you're seeing is basically the same thing as you would see if you looked at a large wall in-game. Any major artifacts should very quickly show up. You can then return to your original 256x256 texture, and edit these out.

Overcompensation

Don't worry too much about artifacts, however. While it's a good idea to tone down any incredibly obvious ones, it's also more than possible to go too far in that direction, to the point where you've turned your texture into a lifeless, blurry mass that has no real definition. Sure, you can't tell where it tiles, but that's because there's no detail there to use as a reference. This is bad.

Try, instead, for a nice balance between the two. It's not unreasonable to have a few artifacts that show up when massively tiled, but aren't much of a problem when the space being covered is less (it's good to keep in mind, also, that a 256x256 texture will cover a wall four times the size of the average player model. So even if it artifacts somewhat heavily, it may still be useful for smaller spaces). A good example of this is Unreal's cavern walls. The texture, if spread out over a flat space, visibly repeats. The level designers, therefore, have made the edges of their cliff faces jagged and uneven. This, along with lighting, can play a major part in making a repeating texture's pattern look quite a bit less obvious.

Half-Life has come up with a new (well, new for the 3D FPS genre, anyway. Not really a new idea) method in which it can take a set of five or so basic textures that all tile together, and randomly tile a wall with them. This is exceedingly useful, as it cuts way down on artifacts. You can make each texture have its own individual details, but you'll never see them consistently repeated in any specific pattern. I like this concept a lot. Done well (meaning, both texture artist and level designer have a good grasp of how it works), it can create some of most realistic looking areas done in a FPS to date. I'm honestly surprised that this technique isn't used more often in Half-Life. Perhaps it was a tech developed near the end of the design cycle.

Avoid Textures with Non-Mathematical Patterns

A hexagonal grid drawn over a "bunch of wires" texture, in which each hexagon is eight pixels wide and eight pixels tall, is good. Why? Because since it is in a power of two (2,8,16,32,64,256,512,1024,etc), it can be easily cut up to match the grid that level designers normally work with. A hexagonal grid in which each hexagon is a different size, but they all manage to match up at 256x256, is bad. Why? Because when a designer needs to cut it up, it will look awkward. Especially if it needs to cut and tile. While this is often not totally avoidable (after all, even numerical patterns look weird if cut and tiled at certain places), it's much easier to work with mathematical patterns.

(Continued on next page)

Credits: Graphic Content is © 1998 Christopher Buecheler. All other content is © 1998 loonyboi productions. Unauthorized reproduction is strictly prohibited, so don't do it, or we'll paint you white against a white background.