Skinning Tutorial by MrGorsh [PS]

TML and sound file assistance

Skinning Tutorial by MrGorsh [PS]

Unread postby MrGorsh » Sat, 2nd Feb 2013 20:45

Welcome to my skinning tutorial, in which I will explain how I texture, colour and create variants for the skins I make. I’m aware some of you might know easier, faster or more ‘real’ ways of skinning, but this is my own method that gave me best results of all, thus please, if you know better, explain it to people instead of posting how wrong THIS is. It's also a tutorial I wrote for ZooTycoon2 modding community, so if you find a term referring to ZT2, please mention it so I can correct it.
I skin with photoshop cs5, you can adapt it for other software too, if you know its tools. By the way, this is not a Photoshop tutorial, this is skinning tutorial, if you don't know how certain tools work, and I do not explain or show it, please do the research on the web, as I can't do a tutorial on both PS and skinning at the same time if I want to save the reader even bigger wall of text. My skinning can be divided into following ‘phases’:

I. Setting up PSD
II. Texturing
  • Shading/highlighting
  • Sourcetexturing
  • Basic texture layers
  • Additional texture layers
  • Final touchups
III. Colouring
  • Setting up basic colours
  • Detailing
  • Patterning
  • Adding hue effects
IV. Finishing the skin

In this tutorial I’m using JPOG Albertosaurus model and UV since it will allow me to present few more ways of skinning, including adding fur/feathers, scales and creating crucial alpha channels.

I. Setting up PSD:

1. Strenghtening the UV

Open the UV (preferably with transparent ‘background’ colour). Select the UV layer, then click the layer name with right mouse button -> Blending Options -> Stroke and set the preferences to 1-2 pixel strong and Center position. This will help you later on if UV starts disappearing suddenly – you can change the colour and strength of the lines so they are better visible.

2. Adding necessary layer groups:

Mouseover the upper context menus and click: Layer -> New -> Group
Groups you will need, in order how they should appear on the layer list:
  • Texture
  • Detail
  • Colouration
  • Background
3. Setting up your basic colour layer which will help you trim the skin and keep the PSD nice, clean and less messy.

Left click on the Colouration group, then from the upper context menu select Layer -> New -> Layer, naming the new layer “Basic Colouration”.
Select the Magic Wand Tool(later referred as Wand – available under the W key) from the tool palette (if you don’t have it, click and hold the Quick Selection tool until the choice menu appears). Using Wand select the space around the UV on the UV layer - including the holes in the UV like the leg seams.

Switch to the Basic Colouration layer without deselecting what you just selected. From the upper context menu click Select -> Inverse (Ctrl+Shift+I). Then click Select -> Modify -> Expand.
Expand it by roughly at least 1% of the total skin resolution rounded up – for a skin 1024px large, you will need at least 10px expand, while 15px value is most advisable. It will later prevent you from obtaining ugly white seams on the UV edges ingame.

Fill the expanded selection area with a basic colour using the Paint Bucket Tool (later referred as Bucket - avaliable under the G key). For the purposes of texturing phase, better choose a mild, not too dark, nor too light and not too saturated colour, so you see the actual value of the textures in normal conditions. It can be changed much later with few clicks. Keep the UV parts in check, separate them if they are ‘filled’ together using the pencil ereaser tool of few pixel diameter.

4. Setting up the background

Select the Background group, click Layer->New->Layer, naming it "Bkg Colour". Fill it with a slightly different colour than the main colouration layer, don’t make it too bright so it doesn’t distract your eyes during the skinning.

Overall, after this phase, your PSD layout should look something like this:

II. Texturing:
0.Covering the seams
As silly as it might look at first glance - if you are not experienced in fixing the seams and setting up good skin flow around them, it will come in handy. Mark the corresponding seams with the same colour using Brush Tool, so you can see what comes where and you have an easier time covering the seams with proper texture flow. It should look something like this:

As you can see, I left the mouth not marked because I want the texture to be a little distinct on both sides of the seam. If you want the skin texture to sink into mouth, remember to mark it too!

1. Shading and highlighting:

First thing to do here is to grab any anatomy sketches of the animal you are skinning. If you are doing a dinosaur like I do here, any scientific book should do here, personally I suggest Gregory S. Paul's The Princeton Field Guide Dinosaurs. Paul has a habit of outlining too much of skeletal structure and muscle on the animals, but ingame it will not be that extremely visible if you play it well, yet should add a good touch to the whole animal. I'd post an example of these, but I don't want to be hunted down for using GSP's work, so if you can't find his book, here's an example of large theropod muscle flow:
Second thing to do will be 'bulging' the muscles with highlights, I do it before the shading so I can set up the shading 'around' the muscles instead of going the other way. Create a new layer (you can name it or not, at this point it doesn't matter) in the "Texture" group. Select the Brush, set the opacity to ~12-15% and hardness to 0%, while also setting up the brush spacing at the lowest posible rate (you set brush spacing on the brush tool customize window to the right, above the layers) and using the mouse cursor (or your tablet tools if you skin with it) start highlighting spots where muscles or bone higlights should be. In general the larger the muscle or the more pronounced it is on muscle study, the more swipes you will need. I'd advise 1 brush swipe for barely visible highlights - the tail side for example, 2 for those that are a bit pronounced - ribcage, neck, the line of spine - and variety of 3 to 6 brush swipes for the most pronounced highlights like limb muscles or face shape.
Create new layer every time you move to a new highlight. You will merge them together when they are done. This is to prevent you from the need of re-doing whole layer just because you messed something up and can't edit one highlight without destroying others. After all highlight layers are done, merge them. If the layer looks a little blotched with white patches instead of nicely highlighted (happens almost every time) use Filter -> Blur -> Gaussian Blur with a few pixel diameter. Now you should have something looking like this:

Notice how I haven't pronounced nostrils yet and I have only a highlight here, also the skin lacks shading. We'll be getting on it now. To get the shading right, try to create the shades using black brush tool with same properties as the white one before. Create new layer with every shade part, so you don't have to start over if something goes awry.
For a simplifications on how to create shades - look at the part of UV and imagine it being on the animal with light coming from above the head, so the shades point slightly downwards-backwards. Don't go blindly painting it with reference to the skin, as the UV parts are not always shown as they would be sticked on the model - always have good orientation how is the part rotated.
When your shadow layers are done, merge them, blur if necessary. The end result should look something like this:

Open the shade layer Blending Options, set the layer type to Overlay and the opacity to 75%, do the same with the Highlight layer. Now you should have a nice shading set up for your skin and you are ready for another step!

2. Sourcetexturing:

You might be familiar with this kind of skinning, it's commonly used as primary if not only way of creating skins. Here, as we are working on an extinct animal we have no photos of, we have to create a custom texture, but that doesn't possibly mean we are limited to what we draw! You can now search for any internet images of the animal you are skinning so you can implement them on your skin - I'm talking about texture here, so mainly scale arrangements, soft tissue structures etc. I will be adding nostrils, eyelids and ears from komodo dragon, aswell as combining various crocodile and bird mouth textures for a better mouth insides. Prepare the source photos/images and be ready to learn how to use various edit options our skinning software offers us.

When you got your textures, you will need 2 tools to fit them in places you want - Edit -> Puppet Wrap and Edit -> Free Transfrorm.
Puppet Wrap works by extending or rotating the textures around with the usage of the 'pins'. After you 'pin' a certain spot with the mark, you can use that mark to make the spot stay in place or drag it to move it. It's useful if the texture you are using is different angle or shape than the UV piece that you want to fit it into.
Free Transform on the other hand is useful when you have a proper shape of the texture, but it's wrong size.
Remember that those two tools can be tricky and they almost always ruin the sharpness of the layer, so if things get a little too blurry, use Filter->Sharpen->Sharpen(or Smart Sharpen).
After fitting pieces is done, click Image->Adjustments->Desaturate and Filter->Other->HighPass with strength of 75-150. This will guarantee that your texture won't alter the colour of the skin and that the shading won't be too strong.

Here is how my skin looks with added 'sourced' bits.

Note that most of the rest of the texturing can be also used with sourcetexturing different photos, but here I used this to implement direct parts that won't be altered in any other way or multiplied, just placed on the skin.

3.Basic texture layers:
Despite the importance of this process, it's fairly easy, though a bit time consuming. You need to prepare the textures that you are going to use for your skin. For wrinkles I remind you that using elephant wrinkle textures is a cheap and mistaken way of wrinkling dinosaurs and reptiles in general. Try to use (if you source them) tortoise, lizard or even bird wrinkles as they are closer. I'm using textures that I have painted in Zbrush, though google image search is also a good source of those.

Now the crucial part - if you have an animal that has 2 types of textures like my Albertosaurus here, you will need to prepare a good separator early on. Paint the area where you want one of the textures using a solid, 100% opacity and hardness brush to indicate it. Trim the shape of it using the Pencil Ereaser Tool. I did this with the 'jagged' version of the brush so it gives the impression of singular feathers sticking over the line of where feathers and scales meet. That's how it looks now:

As you can see I have clearly defined where do I want and where I don't want certain textures. Now the fun part. Grab one of the textures that you want to do on your animal and start putting it over the areas where it should appear. Use the Puppet Wrap and Free Transform tools when needed, utilize sharpening. Remember to desaturate the layer after it's done and merged and put a HighPass filter on it! After putting first texture layer my skin looks like this:

Getting there, eh? So far my dinosaur looks little too elephantine (bald wrinkles! avoid at all cost on dinosaurs unless it's meant to be a completely naked part!) and I must put some scales as soon as possible unless I want a dinosaur/amphibian hybrid. So... Let's go! I grab my further basic textures and you grab yours and we fill our skins with them. My aim so far are the scales over most of the wrinkles and feathers on the orange-marked area. Remember to utilize the aforementioned tools and don't rush anything. Quality over quantity. After this process my skin looks about that:

Notice that, since I don't need the feather boundary layer at the moment, it was temporarily hidden to show a better example of how the textures look when put together. 2 layers of thick and thin feathers give a nice, shaggy look of the simple filaments covering the tyrannosaurid's skin. This is what we call basic texture layers. Which means we can move to another step, which is no less than finishing up the texture with important secondary details!

4.Additional texture layers:
As you can see, these textures look pretty bland and they don't seem to be finished. What are we missing here? Of course there are no claws skinned on, the wide foot scales are missing and the animal would certainly use some teeth. In the following I will explain how to create simple custom textures for the skin parts I have mentioned, so you no longer need to trouble yourself with searching a source texture.

First - claws. Grab a grey colour and 100% hard brush and 'paint' where the claws should be. Open the claw Blending Options, tick Bevel and Emboss, set the soften value to the max.
Second - teeth. Draw one tooth of the shape you desire and put it on where the teethblock alphas are located. Copy and rotate it enough times to give an animal whatever number of teeth it needs. Right click the claws layer, select Copy Layer Style. Right click the teeth layer, select Paste Layer Style.
Should you desire to give teeth and claws some texture - you will find it on the google image search. I usually don't try to overtexture those, but rather use colours, since both teeth and claws are usually rather smooth.
And finally third - foot scales and similar structures. Draw a desired shape of the texture bit you need. Apply the Bevel and Emboss to it and play with the settings (depending on how the certain things look like you need to give it different values, don't be afraid to experiment) until you get the desired shading. For the foot scales of dinosaurs - copy the layer, move the scale bit slightly above the original one, merge the two layers. Copy the new layer, move slightly above previous one, merge, repeat until you get enough of the scales. Now put them on the legs where they should go - and you have an easy set of leg scales without a need of sourcing them from anywhere. Mine went a little rubbish, but since it's JPOG skin they won't be even much noticeable due to a poor UV map. Now set all the three new layers to Overlay - you will later use them for colouring canvas. This is how my skin changed at this stage:

Notice that from this distance the leg scales aren't very noticeable, but the texture flow will be visible ingame. All we need now for the texture are the final touches and we'll be set for the colouring part!

5.Final touchups:

Most important thing is seams. Save your skin as DDS or TGA and preview it on the model so you can see where does the skin require edits. Remember to use various tools for those edits - from puppet wrap to the ereaser.

Case 1: Texture is darker on one part of the seam!
Solve: if this is due to badly laid shading layer that you didn't fix when you had it split into many layers, use the soft Smudge Tool or low opacity soft Ereaser to adjust the strength of the shading. If this is due to fact one of the layers has different values of texture darkness, you need to use HighPass Filter until it has no natural 'shades' on it.

Case 2: Texture flows on a different angle on one part of the seam!
Solve: This is because you must have misunderstood the UV part flow. To correct this, mark the area around the seam with the Lasso Tool, press Ctrl+T (or Edit->Free Transform) and rotate the part so it has a proper angle. After the seam is fixed, fill the remaining gaps using neighbouring textures cloned with Clone Tool (S key)

Case 3: Texture on one part of the seam is different size than another!
Solve: In some cases, UV parts do not fit eachother with size. When this happens, you need to resize down your template texture (scales, wrinkles, fur, feathers, whatever) and put it back on the part that appeared to be too large so the texture flow is not disturbed. If you don't get it right first time, cut the part out, resize, put back, fill the empty space using cloning tool if necessary.

Case 4. Texture doesn't match the other part of the seam!
Solve: This means you must have confused the seams. Carefully study which seam goes where and when you know what part of the texture should be replaced, do it with Clone tool or paste the appropriate texture in that place, keeping your eye on the texture flow so you don't recieve one of the previous cases!

When all seams are fixed, you can consider the texture to be roughly done.

Next is the Alpha channel. Go to the CHANNELS tab to the right. click on one of the channels (either of the RGB palette) and copy it, renaming it to Alpha 1. Select the new layer and paint it whole white. Go back to the Layers tab. Select the Base Colouration layer. Using Wand tool select the teeth alphas where they are (in my case bottom right), and return to the Channels tab. Click the alpha channel, erease what you have selected.
Go to the Layers tab. Select the Teeth texture layer, then using Wand tool repeat the last manouvre, but this time select the area around the teeth then Select -> Inverse, go to the channels tab and paint white over the previously ereased parts, so now you have marked what bits of the teeth alphas are meant to be visible. Overall my alpha channel looks like this:

If you got rid of the seams and alphas work properely, you are officially ready to start colouring your skin!

III. Colouring:

1. Detailing:
We start colouring with the detailing part, contrary to the texturing. Why? Because it's crucial to get the small things done first so we can focus on the bigger ones later. Grab a pink-ish colour and colour the mouth with it, keeping an eye on not making it too solid, use different hues of the colour. Get a lightbrown/orange colour and paint it over the teeth. Never paint the teeth solid white, there aren't many animals that can brag about having perfectly snow white teeth! Colour the eye with your chosen colour, also use the Wand around the Claws texture layer, inverse the select and fill it with dark greyish brown or whatever are the claws of your creature coloured like. Ready? Great, after this phase my skin presents itself like this:

As you can see, I have already started changing the Basic Colouration and Feather Boundary layers colours and you can now start doing the same if your layers don't have your planned colours yet. Don't get too attached to them, though, as sometimes you might need to readjust the basic colours when the rest is being done. Which leads us to...

2. Setting up basic colours:

Do you have an idea how to colour your animal? If no, go find some inspiration on the google image search. If/when yes, proceed. Grab the basic Brush tool, select the colour you want to implement for it. Using Wand select the UV parts that you want to colour. Start colouring. Don't mind the transitions between the colours much now, we'll be getting on it in the next point. Remember to try to cover the seams as best as possible. When you're done setting your basic colours (BASIC only, no patterns yet, we'll get on it later), trim the colours by selecting the outer space around the Basic Colour layer and deleting anything from the layers above that appears out of the line. Less mess = better orientation on the skin.
My progress so far:

See the ugly edges of the colours? We're getting on it right away.

3. Adding hue effects:

Despite the name, it also includes sharp edges with no hue transition whatsoever. But that later.

For the transitions where you want a smooth hue change from one colour to another - Grab the Ereaser tool. Set the size to ~10% of your skin resolution. Set the Opacity to ~20%. Set Hardness to 0%. Select one UV part where lies the colour you will be changing with Wand. Carefully start ereasing the edges where it's supposed to fade. Notice the strength of the fading. Repeat by ereasing more and more (or less and less depending how much you want it to blend) until the transition is smooth and has no solid colour changes.

For the sharp transitions, grab a small diameter Ereaser tool, with 100% opacity and hardness. Carefully erease the edges where you want the sharp transition to appear, giving it the desired shape and flow. If you erease too much, paint or smudge the certain spot and start over. After these edits, your colours might look similar to this:

See how the edges became either blurred out or sharpened? This way you won't have an animal that looks unnaturally 'blotched' with blurry patches of colour. Now we can move to another step.

4. Patterning:

This is one of the most important parts of the colouring process. You can either improve or ruin the skin, depending on what you had in mind. For this demonstration I chose an animal that I don't want to give much pattern, so it will take me less time to finish. Depending on the type of pattern, grab a normal Brush tool with your chosen hardness and opacity and start creating what you had in mind. Remember to draw some inspiration from the nature and don't make the patterns look too artifficial. Spots, stripes etc shouldn't be too regular and straight, more random settings of patterns look much more plausible. Now some tips on patterning the animals:

a) Spots - if you go for this, make sure the spots are of a different size, not too uniform and certainly not placed in regular rows or columns unless it's really your intention. You can change the opacity of some spots so not all of them are so solid.

b) Stripes - Depending on what the animal is covered with, the stripes might appear differently too. In general slightly blurred stripes with 'soft' edges and rounded ends suit better for fuzzy animals while sharp, solid stripes with pointy ends go well on the flat skin surface.

c) Texture type vs patterns - I often see it being neglected in skinning, but what you are colouring often dictates how can you colour it. If you are doing an animal that has feathers - be wary of the advancement level of those structures. Primitive feathers can be safely patterned like fur, but for the more advanced feather types (like those of paravians) try to pattern it like a modern bird. Singular feathers 'appearing' in the pattern always look neat and give some authenticity. When colouring scales or naked skin, keep in mind that scaly or bald animals often have very sharp patterns that don't blur as much as fur or feathers.

This is what happens when you pattern your animal:

Done? Great, now we'll be finishing the skin!

IV. Finishing the skin:

1. Fixing texture strength

You might have noticed that after you coloured the skin, the texture appeared to be slightly altered, some layers turned out to look stronger than they should, some have faded away. To fix those errors it's advisable to either Sharpening filters or Image->Adjustments->Brightness/Contrast.

2. Spicing up the skin

If you feel like your skin, for some reason, is too bland or lacks variety in colours or texture, try following:
a) Randomizing layers. Grab a texture of a washed metal, overlay it on your skin, desaturate, HighPass, lower opacity a bit. It should change the texture flow into less uniform.
b) Improving colour variety. Add one or two layers to the colouration group and put mildly toned colours on them when you want to change your skin's monotony. Set those layer's blending options as either Overlay or Soft Light and it might do the trick.

3. Sign your work!

Put your name on your skin. People often forget to do so and then others don't know who to ask for permission if they find it by accident and want to re-use.

Here's the shot of final version of my skin on the model for comparison with the flat skin screens:

Well, that's all. I hope you weren't bored to death and that you found something useful in this tutorial.
Thank you for reading!
User avatar
Friendly Herbivore
Friendly Herbivore
Posts: 127
Joined: Wed, 16th Feb 2011 9:37
Location: Poland
Gender: Male
User Title: Your Worst Nightmare

Re: Skinning Tutorial by MrGorsh [PS]

Unread postby RaptorRaider » Thu, 25th Jun 2015 0:57

What is the UV?
I don't know how to create a UV overlay in photoshop? Can you explain that step further?
*EDIT* Totally didn't see the topic date... but that is a legitimate question. :x
"Political correctness is tyranny with manners"
-Charlton Heston
User avatar
Friendly Herbivore
Friendly Herbivore
Posts: 108
Joined: Sun, 24th May 2009 3:21
Gender: Male
User Title: Alpha Raptor

Re: Skinning Tutorial by MrGorsh [PS]

Unread postby OminousVoice » Thu, 25th Jun 2015 18:28

The UV is the mesh triangles flattened out to form a map of sort for the texture layout. e.g.


That way you can paint "inside the lines" as it were, and help line up details. Most 3D modelling software will allow you to unwrap and export the UV as an image file.
Park Visitor
Park Visitor
Posts: 4
Joined: Tue, 23rd Jun 2015 19:25
Gender: Male
User Title: Member

Return to Skinning and sounds

Who is online

Users browsing this forum: No registered users and 2 guests

Help keep this forum ad-free - please Donate

This free, ad-free forum is hosted by ForumLaunch