Character skin/hair tone swapping: textures or mat color?

13fc161c2270d6d34b79aaa0c7844f8a
0
piobug 101 Jun 08, 2012 at 19:29 textures shaders character color

Hi all,
I’m working on the character customization part for a tiny game in Unity and I want the player to be able to change the skin color for every face texture (or hair texture) and I need some help.

After some attemps I could think of only two solutions:

  1. paint all face textures in all skin shades in Photoshop and then swap textures in Unity (cons: more textures to paint an to load? pros: better results?)

  2. paint just the face textures (maybe in grayscale?) and then change the color of the material in Unity using a diffuse shader.
    (cons: poor result? pros: less textures to paint and load?)

So:

  • What is the best technique between the two?
  • What are the advantages and disadvantages of the two?
  • Are there other better techniques?

Because my game will have the same painted look and feel shown in the Guild Wars 2 previews (see images at the end of the post) I was curious about:

  • How many and which texture layers do you think are needed to achieve this beautiful painted skin effect?
  • What skin shader for Unity 3.5 do you suggest to achieve this effect?

Any tip and suggestion would be priceless ‘cause I’m a beginner.
Thank you in advance!
p.

For reference: high resolution images from Guild Wars 2:

http://img32.imagesh…311/cc3face.jpg

http://www.arena.net…male_humans.jpg

http://stevivor.com/…ungcalanice.jpg

http://allahweh.file…12/05/gw002.jpg

6 Replies

Please log in or register to post a reply.

A8433b04cb41dd57113740b779f61acb
0
Reedbeta 167 Jun 08, 2012 at 20:19

The key to high-quality skin shading is subsurface scattering (SSS). I don’t know whether Unity offers an SSS shader, but if it does that would be a good place to start.

A technique I’ve seen before for altering texture colors is to multiply the rgb color with a 3x3 matrix in the pixel shader. You can do various things with this. A scaling matrix will make things brighter and darker obviously; scaling perpendicular to the luminance axis (the black-to-white diagonal axis) will adjust saturation. It can also be useful to rotate around the luminance axis, which adjusts hue. I’m sure there are other kinds of color-shifting transformations a creative person could come up with. :)

13fc161c2270d6d34b79aaa0c7844f8a
0
piobug 101 Jun 08, 2012 at 22:30

@Reedbeta

The key to high-quality skin shading is subsurface scattering (SSS). I don’t know whether Unity offers an SSS shader, but if it does that would be a good place to start.

I thought SSS was only needed for realistic skin rendering but I’ll give it a try: Unity doesn’t offer a SSS shader but you can code one.
@Reedbeta

A technique I’ve seen before for altering texture colors is to multiply the rgb color with a 3x3 matrix in the pixel shader. You can do various things with this. A scaling matrix will make things brighter and darker obviously; scaling perpendicular to the luminance axis (the black-to-white diagonal axis) will adjust saturation. It can also be useful to rotate around the luminance axis, which adjusts hue. I’m sure there are other kinds of color-shifting transformations a creative person could come up with. :)

never heard of this stuff, thank you. I was indeed looking for a multiply effect similar to the one found in Photoshop so I’ll give a try to the “3x3 matrix” stuff. After a quick search in the interwebs I didn’t find anything easy to understand or fast to use: do you have some resource at hand you could point me to?

Thank you for the help.

B20d81438814b6ba7da7ff8eb502d039
0
Vilem_Otte 117 Jun 09, 2012 at 12:35

I don’t know how much is Unity capable - but NVidia back then in 8800GTX era did the cool SSS stuff with texture-space blurs :) (the more recent screen-space way to simulate this-like solution is looking way worse, but still better than nothing).

You could actually do NVidia like solution today for lots of faces today using megatexture-like technology (e.g. paging faces textures and doing texture-space blurs on them then - exactly like they did, but actually you could work on infinite number of faces with this way). :)

13fc161c2270d6d34b79aaa0c7844f8a
0
piobug 101 Jun 09, 2012 at 13:45

@Vilem Otte

You could actually do NVidia like solution today for lots of faces today using megatexture-like technology (e.g. paging faces textures and doing texture-space blurs on them then - exactly like they did, but actually you could work on infinite number of faces with this way). :)

thank you for your reply. I have read something about the topic but I don’t have enough knowledge to understand how it could answer my question or solve my problem: could you elaborate more o point me to some resources online, please?

6837d514b487de395be51432d9cdd078
0
TheNut 179 Jun 09, 2012 at 17:06

I think you’ll be fine with a grayscale image. Just apply hue to the texture to change the skin tone. I’ve seen quite a few games do this. You can do all sorts of fun things like have zombie skin, purple skin, shades of skin, etc. The game Saints Row the Third downright exaggerated the tones, but still added an interesting look. To add diversity, you would have a standard face template and then superimpose any additional features on top (makeup, facial hair, scars). Quite a few games do this as well (Saints Row, Skyrim). You will need to have separate textures for dark skinned characters though (modifying grayscale images here would be difficult), as well as oriental characters. There’s subtle differences that should be kept, but you could still have the hue option to add some fun element to it. So in all, 3 textures to cover the 3 main groups (x2 for male + female skins), an HSL mixer to add diversity, and some makeup textures for the finishing touches.

13fc161c2270d6d34b79aaa0c7844f8a
0
piobug 101 Jun 10, 2012 at 13:29

@TheNut

You will need to have separate textures for dark skinned characters though (modifying grayscale images here would be difficult), as well as oriental characters. There’s subtle differences that should be kept, but you could still have the hue option to add some fun element to it.

never thought about that.
Thank you for the tips and the great reply.