Purpose: To understand the basics of applying Phong shading and custom textures.

Objective: To be comfortable with the materials and editing Texture projections on models.

Textures in Games

In any video game created within the past 20 years, give or take, the Textures used always have additional script files associated to them. These script files (aka shaders) tell the game engine how to render and treat the texture in game, including: ricochet & footstep sounds, surface property information, mass, transparency properties (glass), etc.

Valve shader files are created using the .vmt file extension (valve material type). We will cover VMT’s later on, but for now it’s important to understand that textures used on both models and in maps have shader files associated to them that give the texture added properties. Now as it relates to texturing a Model in XSI, we are going to assign a Phong material to an Object.

Note: Textures in Modeling applications are commonly referred to as Materials (as in scene materials).

Phong

Phong materials are the default material type available for Models created in XSI. In game, phong shaders integrate naturally with the existing lighting and provide greater definition, particularly to key characters such as Alyx Vance.

Creating A Desk

To understand how to load and fit a texture to a model, we will begin with an example of texturing a simple desk.

    Create 4 cylinder primitives and a square primitive tabletop. The dimensions of these objects are not critical, but should closely resemble that of a simple table or desk.

4 Cylinders: Radius 0.5, Height 6
1 Cube: Scale: X=1.5, Y=0.05, Z=1.5

Assign a Phong Material

Many video game engines support Phong textures exported directly from a Modeling application. Let us begin by first assigning a phong material to our table top.

  • Select the table top (object mode)
  • Get > Material > Phong

There are hundreds, if not thousands of different ways to modify your Phong Material in this menu. However, all we are concerned with at the moment is changing the color.

  • Under Diffuse, check the Color box, and using the sliders to the right, select a color. Simply close the window when you find a color you like.

Since we are going to add a wood texture next, I will approximate this first with a brownish Phong color for now:

R: 1.000, G: 0.600, B: 0.000

Note: As you move the sliders around you will see the color changing in the Camera Viewport immediately (ensure you are on the Shaded display option)

Importing Textures

Textures are the most common Material that can be dropped onto a Model. There are a few more steps involved then adding a Phong material, but the process is essentially the same.

  • Select one of the Cylinder legs of our Table.
  • Select all of the cylinder’s faces except for the top and bottom ones.

Now we will apply a texture to the model. This is done by a process called UV Mapping.

Every model is made up of a series of polygons, which are defined by their corner points or vertices as we have learned.

To apply a 2D texture onto a 3D model we have to tell XSI what part of the texture corresponds to what part of the object or group of polygons selected by mapping the vertices on the texture. Through this process, each vertex receives a UV coordinate assigned to it (i.e. the relative position on the texture image itself).

  • Firstly, let’s switch our Mode in XSI to Rendering. Underneath the File Menu click on the Model Down Arrow and select Render./
  •  
  • To view textures in the Camera Viewport we will also need to switch our Camera Display to Textured Decal from Shaded.
  • With the cylinder side faces still selected, navigate to Modify > Texture > Add > Image

Note: Two menus may open up at this point, depending on your screen resolution you may need to close or move the Material: Phong window that is covering the Material: Image window (the one we want).

  • Underneath the Texture projection Section in the Material: Image popup menu select:

New > Cylindrical

This is the default UV mapping image that we will be replacing with our texture next. This default image is used to ensure the texture we apply will have the correct Texture Support (displayed correctly, and not stretched out for example).

  • Underneath the Image Section in the Material: Image popup menu, change the Image from noIcon_pic to a wood texture already prepared for this class:

New > New From File > Path: Advanced 3D Design > Pictures > wood_texture.tga

You will see that the object is now textured. But it does not look right quite yet if you look at the table leg from all angles – there is an ugly circular thing there. We need to edit the UV mapping.

  • Open the Texture Editor from the Top Shelf menu:

View > Rendering/Texturing > Texture Editor (Alt+7)

What we are seeing now is all of the points and polygons of our cylinder mapped on to the wood texture. We need to adjust this mapping so that the selected faces do not contain the bottom wood texture located towards the bottom left of the texture.

  • Zoom out a bit by holding (MMB) and (S) while dragging your mouse.
  • Drag a box around all of the points in the texture editor.
  • Press (X) to scale the points and drag to the left to shrink the mapping coordinates of our selected points.
  • Press (V) to translate the selected points up and to the right like so:

If we look at the side faces of our leg now, there is no longer the ugly circular wood texture showing up on the sides – just the smooth up and down grain wood texture we want.

Now let’s apply the circular bottom wood texture to the bottom of our cylindrical leg.

  • In the Camera Viewport, switch to Object Tool mode first, then Raycast Polygon Select and CTRL select all the bottom faces of the Cylinder.
  • In the Texture Editor window, locate the Planar Subprojection icon, select it, and choose: Best Fit from the drop down menu.

  • As we did on the leg side faces, scale the selected points down and translate them, only this time we’re moving them on top of the bottom left portion of the texture.

Now we have 1 completed table leg! Repeat this process 3 more times for the other legs.

  • However, on the next 3 legs (and tabletop) we do not have to load a New image from file, we can simply select our wood texture from the drop down menu under Image.

And finally with all our table legs setup, let’s apply the same texture to the tabletop.

  • Press (8) to open the Explorer menu. In the camera viewport select the tabletop model. The mesh will be highlighted in the explorer menu – expand it and locate the Material component. Right click the Material component and select delete. The phong shading is now deleted from the tabletop.
  • Modify > Texture > Add > Image
  • Create a NEW Texture projection, this time choosing: Planar XZ
  • Under Image select the drop down arrow and select our wood texture
  • Repeat the same processes as above to select all points in the texture editor, scale them down so the circular portion of the texture is not within the selected points and translate the selected points to the right as desired.

Finished!!!

  • Feel free to save your work in the Scenes Directory under Haus of Mapping Curriculum Project Path.

« Module 7 | Module 8 | Module 9 »