|
Features

3D Game Textures: Create Professional Game Art Using Photoshop
[This feature is an excerpt from 3D Game Textures: Create Professional Game Art Using Photoshop (ISBN 0-240807-68-5) published by Focal Press February 2006. An official description from the book's press release follows:
"Learn how to create stunning, professional-quality game textures from an award-winning industry expert. This book is your one-stop-shop to learn everything you'll need to know about texturing game worlds, from the research that goes into creating a world to tips, tricks and tools of the trade. Learn how to create everything from bullet holes and flames to windows and walls in tutorials that walk you through the process of developing textures (game art) for the most common game settings--from modern urban to fantasy--based on professional concept art.
Most importantly, you'll learn how to think like a game artist. Each tutorial begins with the instructions you'll most likely be given on the job, then walks you through the research and planning phase to the process of building textures for the scene at hand. You'll learn not only what goes into building a game world, but you'll also come away with a complete, professional portfolio to help land your dream job."]
A Basic (Game) Art Education
Art is born of the observation and investigation of nature.
Cicero
Roman author, orator, and politician (106 BC–43 BC)
Introduction
The basis of computer art is art itself, so before we dive into any technical issues we must first discuss the most basic but important aspects of visual art. While teaching you traditional fine art skills is beyond the scope of this book, it is critical to have an understanding of some basic aspects of visual art in order to create game textures. Fortunately, these basic aspects of art are fairly easy to present in book form. By studying these basics of art, you will learn to see the world as an artist does, understand what you see, and then be more able to create a texture set for a game world.
The basic aspects of visual art we will focus on are
- Shape and form
- Light and shadow
- Texture
- Color
- Perspective
Learning to observe the basic visual aspects of the world around you is a strong beginning in the process of seeing the world like an artist, communicating with other artists, and creating great game textures. Technology is, of course, critical to the larger picture of game textures, but the actual basics of art is where great textures begin. Too often would-be game artists are thrown into a discussion on tiling, or even game engine technology, when what are most important for the creation of game textures are the ability to understand what you are seeing in the real world and the ability to recreate it in the computer. Often a texture artist is required to break a scene down to its core materials and build a texture set based on those materials, so learning this ability is essential. While you don’t need to have an advanced degree in art to create great textures, let’s face it: almost anyone can learn what buttons to push in Photoshop, but the person who understands and skillfully applies the basics of art can make a texture that stands out above the rest.
There are many types of art and aspects of visual art that you should further explore in order to develop as a game artist. Some of the things you can study and/or practice are
- Figure drawing
- Still-life drawing
- Photography
- Painting (oil, water color, etc.)
- Lighting (for film, still photography, the stage, or CG)
- Color theory and application
- Sculpture
- Drafting and architectural rendering
- Anatomy
- Set design
It is even worth the time to study other areas of interest beyond art such as the sciences, particularly the behavior of the physical world. Light, for example, is becoming processed more and more in real time and not painted into the texture to the extent it was just a few years ago. The more you understand and are able to reproduce effects such as reflection, refraction, blowing smoke, etc., the more success you will find as a game artist. We presently have emerging technologies that reproduce the real world to a much greater extent than ever before, but it still takes an artist to create the input and adjust the output for these effects to look their best. The areas of study that will help you when dealing with real-world behaviors are endless. You can start by simply observing the world. How water drips or flows, the variations of light and shadow on different surfaces at different times of the day, how does a tree grow from the ground; straight like a young pine or flared at the base like an old oak—you will soon be staring at the cracks in the pavement and photographing the side of a dumpster while the world stares at you. An excellent book for this type activity is Digital Texturing & Painting by Owen Demers. You can also take tours of museums, architectural tours, nature walks; join a photography club; join a figure drawing class… there is no end to the classes, clubs, disciplines, and other situations you can expose yourself to that will open up your mind to new inspirations and teach you new tools and techniques for texture creation. And, of course, playing games, watching movies, and reading graphic novels are the food of the game artist.
Chapter Overview
- Shape (2D) and Form (3D)
- Light and Shadow
- Texture: tactile vs. visual
- Color
- Perspective
While there are many elements of traditional art, we will narrow our focus to those elements that are most pertinent to texture creation. We will start with shape and form.
Shape and Form
A shape (height and width) is simply a two-dimensional (flat) outline of a form. A circle, square, rectangle, and triangle are all examples of shape. Shape is what we first use to draw a picture with before we understand such concepts as light, shadow, and depth. As children we draw what we see in a crude way. Look at the drawings of very young children and you will see that they are almost always composed of pure basic shapes: triangle roof, square door, circle sun. Even as adults, when we understand shadows and perspective, we have trouble drawing what we see before us and instead rely on a whole series of mental notes and assumptions as to what we think we are seeing. There are exercises to help develop the ability to draw what we actually see. Most notably the book Drawing on the Right Side of the Brain offers many such exercises. And one of the most famous of these involves the drawing of a human face from a photo. After you have done this, you then turn the photo upside down and draw it again. The upside-down results are often far better than the right-side up, first try. This is due to the fact that once you turn the image upside down your brain is no longer able to make any mental assumptions about what you think you are seeing; you can only see what’s really there. Your brain hasn’t yet developed a set of rules and assumptions about the uncommon sight of an upside-down human face. One of the first skills you can practice as an artist is trying to see the shapes that make up the objects that surround you. Figure 1-1 has some examples of this ranging from the simple to the complex. This is a very important skill to acquire. As a texture artist you will often need to see an object’s fundamental shape amidst all the clutter and confusion in a scene so you can create the 2D art that goes over the 3D objects of the world.
|
|
 |
 |
 |
Figure 1-1: Here are some examples of shapes that compose everyday objects. These shapes range from simple to complex.
|
Form is three-dimensional (height, width, and depth) and includes simple objects like spheres, cubes, and pyramids. See Figure 1-2 for examples and visual comparisons. You will see later that as a texture artist you are creating art on flat shapes (essentially squares and rectangles) that are later placed on the surfaces of forms. An example can be seen in Figure 1-3 as a cube is turned into a crate (a common prop in many computer games). When a shape is cut into a base material in Photoshop and some highlights and shadows are added, the illusion of form is created. A texture can be created rather quickly using this method. See Figure 1-4 for a very simple example of a space door created using an image of rust, some basic shapes, and some standard Photoshop Layer Effects.
|
|
 |
 |
 |
Figure 1-2: Here are examples of shapes and forms. Notice how it is shadow that turns a circle into a sphere.
|
|
|
 |
 |
 |
Figure 1-3: A game texture is basically a 2D image applied, or mapped, to a 3D shape to add visual detail. In this example a cube is turned into a crate using texture. And a more complex 3D shape makes a more interesting crate while using the same 2D image.
|
|
|
 |
 |
 |
Figure 1-4: Here is an example of how shapes can be cut into an image and using some simple layer effects can then be turned into a texture in Photoshop.
|
Of course, mapping those textures to more complex shapes like weapons, vehicles, and characters gets more difficult, and the textures themselves reflect this complexity. Although paradoxically, as the speed, quality, and the complexity of game technology increase, artists are actually producing more simplified textures in some cases. The complexity comes in the understanding and implementation of the technology. Don’t worry; you will gradually be introduced to this complexity until it culminates with the sections on Shader Technology.
As in the above section, you can also practice looking for the forms that make up the objects around you. In Figure 1-5 you can see some examples of this.
|
|
 |
 |
 |
Figure 1-5: Here are some examples of the forms that make up the objects around you.
|
Light and Shadow
Of all the topics in traditional art, this is arguably the most important due to its difficulty to master and importance to the final work. Light and shadow give depth to and, as a result, define what we see. At its simplest, light and shadow are easy to see and understand. Most of us are familiar with shadow; our own shadow cast by the sun, making animal silhouettes with our hands on the wall, or a single light source shining on a sphere and the round shadow that it casts. That’s where this book will start. Light and shadow quickly get more complicated, and the examples in this book will get more complex as well. The book will start with the ability to see and analyze light and shadow in this chapter, move up to creating and tweaking light and shadow in Photoshop using Layer Styles for the most part, and finally look at some basic hand tweaking of light and shadow. If you desire to master the ability to hand paint light and shadow on complex and organic surfaces, then you are advised to take traditional art classes in illustration, sketching, and painting.
We all know that the absence of light is darkness, and in total darkness we can obviously see nothing at all, but the presence of too much light will also make it difficult to see. Too much light blows away shadow and removes depth and desaturates color. In the previous section we looked at how shape and form differ. We see that difference primarily as light and shadow as in the example of the circle and a sphere. But even if the sphere were lit evenly with no shadows and looked just like the circle, the difference would become apparent when rotated. The sphere would always look round if rotated, whereas once you began to rotate the circle it would begin to look like an oval until it eventually disappeared when completely sideways. In the previous example, where a shape was cut into an image of rusted metal and made to look like a metal space door using Photoshop Layer Effects, the highlights and shadows were faked using the various tools and their settings. In Figure 1-6 you can see the same door texture rotated from front to side. Notice the complete lack of depth in the image on the far right. The illusion is shattered.
|
|
 |
 |
 |
Figure 1-6: Here is the same door texture from the previous section. Notice the complete lack of depth as we look at it from angles other than straight on. The illusion of depth is shattered.
|
Understanding light and shadow are very important in the process of creating quality textures. We will go into more depth on this topic as we work through this book. One of the main reasons for dwelling on the topic is not only due to the importance of light and shadow visually, but you will see that many of the decisions that need to be made are based on whether light and shadow should be represented using texture, geometry, or technology. To make this decision intelligently in a serious game production involves the input and expertise of many people. While what looks best is ideally the first priority, what runs best on the target computer is usually what the decision boils down to. So keep in mind that in game development you don’t want to make any assumptions about light and shadows--ask questions. I cover different scenarios of how light and shadow may be handled in a game in this book. It can be challenging to make shadows look good in any one of the situations. Too little and you lack depth, too much and the texture starts to look flat. Making shadows too long or intense is an easy mistake. And unless the game level specifically calls for that, on rare occasion, don’t do it. Technology sometimes handles the highlights and shadows. This is challenging because it is a new way of thinking that baffles many people who are not familiar with computer graphics. This method can also be a bit overwhelming because you go from creating one texture for a surface to creating three or more textures that all work together on one surface. Naming and storing those textures can get confusing if you let it get away from you.
Overall you want your textures to be as versatile as possible and that includes, to a great degree, the ability to use those textures under various lighting conditions. See Figure 1-7 for an example of a texture where the shadows and highlights have been improperly implemented and one that has been correctly created. For this reason we will purposely use highlight and shadow to a minimalist amount. You will find that if you need more depth in your texture than a modest amount of highlight and/or shadow, then you most likely need to create geometry or use a shader—or consider removing the source of shadow! If there is no need for a large electrical box on a wall, then don’t paint it in if it draws attention to itself and looks flat. If there is a need and you are creating deep and harsh shadows because of it, you may need to create the geometry for the protruding element. You may find that as game development technology accelerates, things like pipes, door knobs, and ledges are no longer painted into the texture but modeled in geometry. Many texture surface properties are no longer painted on. Reflections, specular highlights, bump mapping, and other aspects of highlight and shadow are now processed in real time.
|
|
 |
 |
 |
Figure 1-7: The crate on the left has conflicting light sources. The shadow from edge of the crate is coming up from the bottom, is too dark, is too long, and even has a gap in it. The highlights on the edges are in conflict with the shadow cast on the inner panel of the crate, and they are too hot, or bright. The crate on the right has a more subtle, low-contrast, and diffuse highlight and shadow scheme and will work better in more diverse situations.
|
In the rest of this book we will take various approaches to light and shadow using both Photoshop’s Layer Effects to automate this process and other tools to hand paint highlights and shadows. One of the main benefits to creating your own highlights and shadows in your textures is that you can control them and make them more interesting as well as consistent. Nothing is worse than a texture with shadows from conflicting light sources: harsh, short shadows on some elements of the texture and longer, more diffuse shadows on others. See Figure 1-8 for an example of this. The human eye can detect these types of errors even if the human seeing it can’t quite understand why the image looks wrong. One of the artist’s greatest abilities is not only being able to create art, but also being able to consciously know and verbalize what he is seeing. In Figure 1-9 you can see the various types of shadows created as the light source changes. This is a simple demonstration. If you ever have the opportunity to light a 3D scene or movie set, you will discover that the range of variables for light and shadow can be quite large.
|
|
 |
 |
 |
Figure 1-8: Here is a REALLY BAD texture created from two sources. Notice the difference in the shadows and highlights. The human eye can detect these errors even if the human seeing it can’t understand why the image looks wrong.
|
|
|
 |
 |
 |
Figure 1-9: With one light source and a simple object you can see the range of shadows we can create. Each shadow tells us information about the object and the light source, such as location, intensity, etc.
|
Highlights also tell us a good bit about the light source as well as the object itself. In Figure 1-10 you can see another simple illustration of how different materials will have different highlight patterns and intensities. These materials lack any texture or color and simply show the highlights and shadows created on the surface by one consistent light source.
For a more advanced and in-depth discussion on the subject of light and shadow for 3D scenes, I recommend Essential CG Lighting Techniques by Darren Brooker.
|
|
 |
 |
 |
Figure 1-10: With one light source and a simple object with various highlights on it, you can see that the object appears to be created of various materials. Keep in mind that what you are seeing is only highlight and shadow. How much does only this aspect of an image tell you about the material?
|
Texture
|