PDA

View Full Version : [UT]-Skinning : From an idea to the game


SaD
10th Apr 2005, 08:02 AM
UT - From an idea to the game:

Created by Rick Stirling (rickstirling@btinternet.com) and AcidDrone (drone123@dingoblue.net.au)

Tutorial copied with the friendly permission from Identity Crisis (http://dynamic3.gamespy.com/~identitycrisis) .

After skinning for Quake for a long time, I decided to try my hand at an Unreal Tournament skin. It had to be deleted - it was terrible! All my experiences with Quake 3 had ruined me :) I realized that there are a lot of pitfalls that can be made when making a skin for UT, so I decided to document the whole process.

Unfortunatley, I ran out of time, and the majority of this tutorial was written by AcidDrone.

This tutorial is going to be BIG, so it will be uploaded in several parts. Hopefully everyone will learn something from this tutorial - whether is be a new technique or just a new way at looking at something. If you have only just started skinning, I recommend you read all the other tutorials too - and just because you skinning for UT doesn't mean the Quake tutorials are useless!

There are going to be some very big jumps in this tutorial, and some parts shown in minute detail. I now work at double size for all my skins - the UT skins for the male soldier are 4 textures each 256X256 pixels. I work on one large image which has all four textures joined together, which would make an image of 512X512, however I re-sized this to 1024X1024. This allows me to see what I'm doing better.

I also work in grayscale, then colour afterwards. This is personal preference, and not the easiest thing to learn. However, it does allow you to spend the time concentrating on shaping the skin, getting the shadows and highlights correct.

Sometimes the hardest part, sometimes the easiest. Where do ideas come from? Who knows - the world around you, a film, a book, a song. Anyway, you should have an idea of what you want to draw before you start. If you just start, all too often you will end up getting lost in the middle of a skin.

For my idea, I decided on the good old high-school-jock-ex-SAS-army-turned-space-marine character. Yes, I know its original, so please don't copy it! *grin*. No, actually I chose the old standby to show that even it can be made different. There is also a few elements of the Doom character in this skin.

As well as the skin idea in my head, I sketched out a few roughs, and decided on the style of armour I wanted. Now I had something to start from. I also decided to let the guy have bare arms so that I could draw the arm muscles.

First thing I did was load a base mesh, then CREATED A NEW LAYER. Everything goes on new layers. I painted one of the arms gray, then using the burn (darken) tool I marked out the areas where the deltoids, biceps and triceps should be. I used various sized brushes at different opacities so that I didn't have any hard lines. You could also use the blur tool, I used to do that a lot, but I tend to stick with the lighten and darken tools.

http://skincity.beyondunreal.com/tutorials/idea-to-game/1.jpg

Anyway, continuing from the above image, I have used the dodge(lighten) tool to help me define the lighter areas on the muscles. Its important to spend time on this - get a few reference photos from the net, or buy a bodybuilding magazine ( a better option). By continually using the dodge and burn tools, you build up a nice rounded gradient. Don't be tempted to use the gradient tool. You need to get a smooth gradient, my older worked suffered because I had gray with shadows and highlights. Note that I really work on the midtones.

http://skincity.beyondunreal.com/tutorials/idea-to-game/2.jpg

Note: pressing ALT when using the dodge tool turns it into the burn tool and vice versa.

You can see that I applied a bit of noise to the image - just a tiny amount. It really improves the texture of the skin. The veins are in the correct place, I used the reference magazine, which also showed me that my triceps (that's the muscle on the back on the arm) was wrong. I did change it, but it looked bad on the model, so I changed it back to the simple version.

The deltoid (top bit, the shoulder part) actually comes about 1/2 way down the upper arm, however the model loses the top 1/4 of the upper arm in the shoulder pad. The biceps takes up the bottom half of the lower arm. It actually curves around the arm. These are nice things to remember, they will add a touch of realism.

What I then did was to create another new layer, and painted over the arm area in a light brown skintone. I then set the blending mode of this layer to softlight at 100% opacity. Its skin! Rather than having to pick all the correct colours, I created the arm in gray, then used photoshop to work out the skin colours just by applying the skin as a new layer. I also took a quick screenshot in my demo version of Painter 3D, and you can see that the arm does actually look pretty good. ( I loaded the default skin, and then pasted my arm over the models arm).

http://skincity.beyondunreal.com/tutorials/idea-to-game/3.jpg http://skincity.beyondunreal.com/tutorials/idea-to-game/4.jpg

This bit was simple - I duplicated the arm and pasted it into the correct place, then on the skin colour layer I just painted the correct skin tone over the correct area. Then, on another NEW layer, I painted two dark bands in black paint, to simulate the shadows caused by the shoulder pads. I set this layers blending mode to be softlight at about 30%.

http://skincity.beyondunreal.com/tutorials/idea-to-game/5.jpg

Tip! Rename each layer! At this stage in my image, my default photoshop layers would be called background, layer1, layer2, layer3 and layer4. I renamed them to mesh, right arm, left arm, skin colour and pad shadows. It makes the image easier to navigate.

http://skincity.beyondunreal.com/tutorials/idea-to-game/6.jpg

Onto the shoulder pads! On a new layer (of course!) I painted in the basic area of the shoulder pad, and used the burn tool to darken the areas under the pads. If this is the first time you are skinning a model, take a good look at an exisitng skin - both in 2d and on the model. It will give you clues to how the mesh fits the model.

The dark upside down V shape is actually the bottom of the pad - so its upside down :)

Whoa! A big step. Like I said, these are going to happen a lot. If you want details on good shading and highlighting, I written loads of other tutorials about it. I basically marked out what I wanted using the dodge. burn and airbrush tools, I shaded the dark areas and highlighted the lighter ones. All the time I of course consulted my initial sketches. I then copied and pasted the shoulder pad, so that I had 2 of them. You could leave them like this, and you would have metal shoulder pads, but lets go a bit further.

http://skincity.beyondunreal.com/tutorials/idea-to-game/7.jpg

Here I've done things a few- on the shoulder pads I've used the dodge and burn on a very small brush size to create a few small scratches and dents. It makes the pads look a bit more used.

http://skincity.beyondunreal.com/tutorials/idea-to-game/8.jpg

Then, on a new layer, I've painted green and applied the layer as a softlight layer. This colours the pads. I can play about with the hue and saturation until I'm happy.

http://skincity.beyondunreal.com/tutorials/idea-to-game/9.jpg

Now this is cool! On the colour layer I've used the eraser tool to remove some of the colour, to let the metal show through. I've not done this just anywhere though - I've only done it over the scratches I created, and at the edges and corners of the pad.

This is to simulate the paint being chipped off when the armour has taken the brunt of a fall or when dropped in the armoury or suchlike.

As well as overlaying colour, you can overlay other images. In the following shot of the pad, I've taken an image that I got from www.freetextures.com (edit by Lawgiver: this site is no longer available) and I applied it in softlight mode at about 10% over the pad. This gives a bit of texture and a bit of dirt to the image. Finally, a shot of my work pasted over a default skin, showing everything done so far.

http://skincity.beyondunreal.com/tutorials/idea-to-game/10.jpg

http://skincity.beyondunreal.com/tutorials/idea-to-game/11.jpg

Thats overs the main aspects of the way I work. Its going to get a lot faster from here on in.

SaD
10th Apr 2005, 08:08 AM
Ok, shoulders and arms are done as you saw in the final image of the previous section, now we move onto the chest of our skin. As with the previous section(Arms/Shoulders) I like to make a roughish sketch of my ideas and work it in a bit with the Dodge and Burn tools so I have something to go off rather then just jumping in and losing an idea half way through.

Ok now that I have the basic idea(s) down of what I want my skins chest to look like I begin working it in and adding more details using small brushes zoomed in. Once I have my basic shape down I work on it more spending alot of time refining details and adding small bits that just add that whole marine-guy-gone-postal look to it.

http://skincity.beyondunreal.com/tutorials/idea-to-game/12.jpg

If you don't refine your work you will just end up with a very fast rough looking skin which no one will want to use and you yourself will feel less likley to want to use.

http://skincity.beyondunreal.com/tutorials/idea-to-game/13.jpg

Looks like a big step, buts its just a continuation of what went before. Continue working in your skin using the dodge(lighten) and burn(darken) tools until you get something that is more or less what you had in your mind.

Once I have the general look of my chest and it looks more like a chest then a blob of grey, I continue to add the finer details as I progress closer to coloring the chest.

http://skincity.beyondunreal.com/tutorials/idea-to-game/14.jpg

Ok once youve got all your detail down in Grey Scale you need to colour it and refine it and add any extra little bits and pieces you want to spiff it up a bit. My previous green layer (from the shoulder pads) was just extended to cover the armour. As with the pads I then erased some of the colouration on edges to make it look like paint was missing.

Choose the texture(s) you wan't and apply them to the area's you want to have a texture. There are several ways to do this the easiest is to open your text, then choose Select>All and then Edit>Define pattern. Now go back to your Skin and select the layer that was created previously and click Edit>Fill and choose pattern it will then fill your layer with the desired texture, you just have to adjust the brightness/layer options/opacity until your satisfied.

Sometimes I just use a marquee tool to select an interesting texture and then copy and paste it over the coloured layer. I then play with the various blending modes (overlay, softlight and darken being my faves) and opactiry until it looks correct. I'm also not scared to erase parts of the texture too.

Ok now to make it look a bit more weatherd you can paint on some grey or blueish colours or optionally use the Sponge tool on Desaturate to remove some of the colour and make it look like its seen better battles. Ok were nearly done with the Chest just finalize it make sure its the way you pictured it, You'll see I've added an id tag to this guys chest just to add a bit more of a marine-ish feel to it.

SaD
10th Apr 2005, 08:14 AM
Chest done you can have a rest now. But not to long caus its time to move onto the Wrist Guards or "the thing above his hands".

As with all of these different sections I can't stress enough how important it is to plan out your idea's either by sketching or just from your mind but make sure you have some idea of what you want then do the rough work onto your mesh so that you indicate to yourself how you want it to look.

http://skincity.beyondunreal.com/tutorials/idea-to-game/15.jpg

Ok you have your basic idea for your guards down now just follow the same steps in creating it as you did with the previous 2 sections, just because its a wrist guard doesnt mean you can't treat it the same as say, a chest. Just plan it out until your satisfied if theres a part of it you don't like simply grab your base grey colour and brush it back over that spot and redo the piece you want.

Now that you have your basic shape just follow what was discussed in the previous section in regards to working in your piece with the dodge/burn tools and applying colour and texture to it. Because you mainly repeat this for each piece of the skin there is no need for it to be repeated here.

Continuing on, once you've refined, textured and finally coloured your wrist guards you should end up with something similar to..

http://skincity.beyondunreal.com/tutorials/idea-to-game/16.jpg

Ok you're Wrist Guards are resembling the rest of your skin and everything is so far taking shape all thats really left is the hands and the small bits 'n' pieces that link the rest of the skin together.

Ok our skins shaping up well lets recap a bit, weve done the Shoulders, Arms, Chest and Wrist Guards not much left now just the Pants, Hands and Head. Ok now there will be a few jumps from here on in as most of tutorial now writes itself, the Pants/Hands are just made using the same methods as we've done previously.

http://skincity.beyondunreal.com/tutorials/idea-to-game/17.jpg

Just experiment with what you know and practise. Don't be afraid to change your mind!

http://skincity.beyondunreal.com/tutorials/idea-to-game/18-thumb.jpg (http://skincity.beyondunreal.com/tutorials/idea-to-game/18.jpg)

As you can see there has been a massive amout of work done here. The trousers are a cut and paste and modify of the gloves - it saved me some time and it keeps the skin looking uniform.

I've applied a LOT of dirt to the boots, trying to make it look like caked on mud. It seems to work. Just expermint with the saturation and opacity!

Ok legs are done?. Chest is done?. Wrist Guards done?. Shoulder Pads done?. Arms done?.that just leaves the Head and the hands.

SaD
10th Apr 2005, 08:20 AM
I saved this bit to last as its the most fun, and I wanted you to read all the other important bits!

The face is normally one of the first things someone looks at, so spend a lot of time getting it right. After a whil faces will become easier. I recommend taking the time to look at faces and see how the muscles lie, and where the light falls. Understanding the face (and the body) is easier than copying.

When doing heads I strongly recommend working zoomed in quite a long way say 300-400% since heads are a delicate and detailed part of the skin. If you look at any of the default UT skins you'll notice that a great amount of work has gone into keeping them looking human like with human facial features etc.

http://skincity.beyondunreal.com/tutorials/idea-to-game/19.jpg

Quake Skinners! UT heads are slimmer!

Incidentally, because of the compression on these JPGs, the face does look a bit **** in some images. Sorry!

Firstly start off as usual with your base mesh and a grey blob and give it the basic details and facialexpressions your looking for. I used the dodge and burn tools.

http://skincity.beyondunreal.com/tutorials/idea-to-game/20.jpg

The face doesn't have to be totally perfect but to be more realistic you should try and do both sides your self rather then mirroring one side and drawing the other, since it takes away that sense of realism. Of course, if you mirror it and change some of the main features thats fine just makes your job easier.

As you work away with the D 'n B tools you will notice that the face begins to take a less moulded look and more realistic. If your having trouble keeping realism look at yourself in a mirror or take a look at some magazines with real people in them.

Remember, you have net access! Use it to get lots of reference material.

http://skincity.beyondunreal.com/tutorials/idea-to-game/21.jpg

Getting tired yet? If you've been working on a skin for a few days you tend to get sick of it just like anything else yet because were human we still feel a need to see it finished. Don't ask me why I'm not a philosipher its just this urge you get least I seem to anyway. Anyway just keep working and it and we get something similar to that on the left here.

It still looks a bit blurry, so try to add a bit more definition.

http://skincity.beyondunreal.com/tutorials/idea-to-game/22.jpg

Ok happy with the face? Time to move on again.

If you remember the arms part, I created a new layer with the skin ton eon it. To keep the skin consistant, I postion the face layer under that skin tome layer and just paint the same colour over the head. As the layer is on overlay you can still see your face.

Don't colour the eyes, as you may want to select the mouth area and drag the saturation up and the colour a bit more into the red spectrum.

http://skincity.beyondunreal.com/tutorials/idea-to-game/23.jpg

SaD
10th Apr 2005, 08:27 AM
Final stage now just put it all together add anything you want and tidy it up.

http://skincity.beyondunreal.com/tutorials/idea-to-game/24-thumb.jpg (http://skincity.beyondunreal.com/tutorials/idea-to-game/24.jpg)

Well thats our final guy all skinned and ready for action. All that was done after the Head was just the Mic', and Hands.

The hair is rubbish, I just drew it quickly to get the skin finished. I looks rubbish on the model too. I'm sorry. It won't happen again :(

To the right you can see the skin on the model.

http://skincity.beyondunreal.com/tutorials/idea-to-game/25-thumb.jpg (http://skincity.beyondunreal.com/tutorials/idea-to-game/25.jpg)

Thats the skinning part almost finshed, just a few notes to make.

I used a lot of layers. It helps me keep things organised. If I want to adjust skintone, I grab one layer and adjust it. The same goes for the armour, which is what I did next.

http://skincity.beyondunreal.com/tutorials/idea-to-game/26.jpg

selected the armour colour layer and adjusted the hue so that I had a red copy and a blue copy. This is for team games - in UT you also have gold and green, so make those too if you want to.

Next thing I had to was resize the image - I was working at double size - 1024X1024 - so I resized the image and sharpened it ever so slightly. Then I flattened it.

Next I had to cut each image into 4 pieces, each 256X256 (as shown above). I used the photoshop grid to help me, I set it at 256X256 then copied and pasted each part to a new image.

Since I was working in true-colur (RGB, 16.8 million, 32bit, whatever you wanna call it), and UT only supports 256 colours in each skin part, I had to convert each part to indexed colour. You should figure out how to do this in yer art package - Read the help files. Experiment. Epic has released a utility called BRIGHT, for Windows machines, which will do this for you.

YOU MUST CONVERT TO 256 COLOURS FOR THE SKINS TO WORK!

UT has a pretty simple naming convention. You need to give each skin part a 4 digit name, followed by a code. I chose tutr (for tutorial!). Next, reading from left to right, then top to bottom, each skin gets a code 1,2 3 and 4. Save the files as either PCX or BMP.

My chest was called tutr1.pcx, the trousers and boots became tutr2, the arms were tutr3 and the head became tutr4. You also need a tutr5, which is a 64X64 image of the head for the HUD in game. I just selected part of the screenshot for that then sized it in Photoshop.

Team colours are added like this - only the chest and legs have team colours, and you just add _tX to the end of the skin name, where 0 is red, 1 is blue, 2 is yellow and 3 is green. Since I had made a blue and red skin, I saved the blue chest as tutr1_t1, and the red chest as tutr1_t0.pcx. The legs follow on as tutr2_t0 and tutr2_t1.

UT supports multiple faces too! Using the same naming convention, you save your images as tutr4FACENAME.pcx, and you must also create a HUD icon for each face too - tutr5FACENAME. Obviously, replace FACENAME with a real name - like tutr4Rick or tutr4Bob.

If you dont follow that, Check out Identity Crisis for more explanations.

Now, you have your skin drawn, chopped up, converted and named properly. Now you need to get them into the game. Right, here goes.

Load Unreal Editor. Its in the System directory.

In the top right, Make sure Textures is selected, and in the bottom right, click New. This creates a new container for textures, and also creates a texture in it. It doesnt matter what the texture is called, because you are going to delete it anyway. Call the package anything you want, you have up to 15 characters. Hit 'OK'.

A new testure should appear in the right hand texture window. Click it and select delete. Eh? Why? Well, when you created the texture, it created a texture AND a container. You are going to use the container to hold your skins, but you dont want the texture that was created.

Now click on Import, browse and select all your image files, then hit 'OK'. You skins will now be imported into the textre package, and you can save it. Click Save.

You must prefix the name of the package with the name of the model you were skinning. If it was a male soldier, you should save as SoldierSkins_XXXXXXX - replace XXXXXXXX with whatever you want eg SoliderSkins_Tutorial. Save to the UT textures directory.

You also need to create an .INT file, this tells Unreal how to use the textures. The .INT file goes in the System directory, so open notepad and get ready to type. The file should be saved with the same name as your texture pack - so for me it will be SoldierSkins_Tutorials.INT. Now, begin typing:

[public]
Object=(Name=soldierskins_tutorial.tutr1,Class=Texture,Description="A Description")
Object=(Name=soldierskins_tutorial.tutr2,Class=Texture)
Object=(Name=soldierskins_tutorial.tutr3,Class=Texture)
Object=(Name=soldierskins_tutorial.tutr4,Class=Texture)
Object=(Name=soldierskins_tutorial.tutr5,Class=Texture)

Object=(Name=SoldierSkins_tutorial.tutr1t_0,Class=Texture)
Object=(Name=SoldierSkins_tutorial.tutr1t_1,Class=Texture)
Object=(Name=SoldierSkins_tutorial.tutr2t_0,Class=Texture)
Object=(Name=SoldierSkins_tutorial.tutr2t_1,Class=Texture)

You dont need to have the spaces in, I just did that so it was easier to see. The first section tells UT where the textures are - the names of the packages (soldierskins_tutorial), and the names of the files inside it. The second part is the same, it just tells UT about the team colour images.

You can easily add extra faces - just copy the lines with 4 and 5 in them, and add the name of the face - also, add a description tag to the 4 lines:

Object=(Name=soldierskins_tutorial.tutr4Bob,Class=Texture,Description="Bob")
Object=(Name=soldierskins_tutorial.tutr5Bob,Class=Texture

And the final product a nicley skinned doom-style-marine guy ready to rack up a few frags. I hope you've learned a thing or two from this tutorial and have also seen how much detail can be achieved using GreyScale since it does allow you more freedom to add and refine details unlike working straight in color.

If you've rememberd anything from reading this tutorial remember that the more you practice the better you get and never give up even if the skin seems terrible or difficult because like everything in life you learn from your mistakes and learning is what we do.