Tutorial #4: Understanding Texture Maps (Templates)

In this tutorial, I am going to assume you are familiar with deriving from items, using the previewer, loading your texture into the previewer, creating catalog images, and submitting your item. If you are not, please check out Tutorial 2 and Tutorial 3 before approaching this tutorial. I will not be going over those steps here.

If you have completed Tutorial 3, you have a basic understanding of texture maps. You have a basic understanding of how a 2D image is applied to a 3D model. In this tutorial we will be going over more complex texture maps, how to interpret them, and how to use them.

1) Load the catalog page for the Dress. This is the model I will be using as an example. It has two texture maps, and both will be interpreted differently. Go ahead and download the templates to your computer and open them in your graphics program.
2) First, lets go over the body template. This template is based off of the standard IMVU avatar template. You will see a similar template for any skintight clothing you might derive from. You would also use something similar to this for painting skins. At first glance, you will probably be able to identify some of the areas, such as the chest area in the center, and the crotch area where it looks like a bathing suit bottom.
3) What are the mystery areas? But there are a few areas that aren't intuitively obvious. Such as the shapes up at the very top, and that strange shape near the bottom. In order to figure out what these areas are, I am going to paint colors over the template and then load it up in the previewer. When I see where the colors appear, it will show me what the various parts are.
4) Load up your test image. Click the derive link to open up the previewer. (Important Note: if the mesh won't load properly, make sure you have the most recent version of the previewer!!) Now, load in your test image. WOW, that's UGLY!! LOL. But now you have an idea of how the map works! Those things at the top are the arms, the sides of the top wrap around to the back, the shapes by the crotch are the butt, and that shape at the bottom is the neck! Now we can do something with this!
5) Create your actual image. Now that you know the layout of the map, you can create your design. If you are using an advanced graphics program like Photoshop, Paintshop, or Gimp, you should be using layers (look them up in Help in your graphics program if you don't know how to use them... you'll be glad you did!) I will often keep a copy of the template in a transparent layer overtop of my design to remind me of where things are. If you do this be sure to hide this layer before you save your image!
6) Load it up and check it out. As we've done before, load your texture up in the previewer and see how it looks. Tweak it until you're happy with it.
7) And now for the skirt. Now that we have the body portion of the dress done, it's time to tackle the skirt. This texture map is very different from the last one... it doesn't really have any shapes we can identify. Of course, I created the map so I know how it works... but for the sake of the tutorial, lets use my color method and see! For this one, I'm going to put a gradient over it, so the whole skirt is covered.
8) Get rid of the transparency. The transparency is going to make it harder to see how the gradient is applied, so we're going to get rid of the transparency. We will discuss opacity maps in more detail in another tutorial, but for now I am going to tell you how to make this area solid. Go back to your texture template and save a new copy. In the new copy, fill it with all white. Save it as a separate file from your texture map.
9) Apply your test texture and your opacity map. Now, the first thing we need to do is figure out where this second texture goes! We have already put the first texture in M00, like we have done for other tutorials, so we need to find a new place for the skirt. Click on M01 on the right hand side. This says "skirt.xrf." Now put your test texture in as usual, then down below click "opacity" and put your opacity (white) texture there. UNCHECK the box next to "Use Blending". (We will talk about why that's important in another tutorial).
10) Check it out in the previewer. Okay! Now our skirt is opaque and we can see that the gradient wraps around to the back. So the texture map for this is basically like if you cut the skirt straight down the back and laid it flat. Very easy to paint. Most texture maps that look like this probably work this way. Some items with texture maps like this are my garters and pleated skirts.
11) Paint the skirt. Again, use the map as a guide. It will help you center and line things up on the skirt.
12) Load it up! You know the drill by now, load your texture in, see if you like it, make changes, save, click "apply changes"... and when you're happy with your finished product, save it and submit it like we've done before.
Congratulations! You now have a good working knowledge of texture maps, and should be able to tackle any you come across! The next tutorial will cover opacity maps!