3D Artist
Apr
21

How do I create real-time hair for games?

Tips & Tutorials
by
Steve Holmes

CG pro Tom Parker shows you how to create believable hair using ZBrush, Maya, Photoshop and Marmoset Toolbag 2

How do I create real-time hair for games?

Making believable real-time hair for games is often a very technical task, usually requiring the use of specialist in-house hair solutions or lots of fiddling with curves.

However, it doesn’t have to be this way.

Through clever use of ZBrush, we can streamline the process and create a hairstyle from scratch in a few hours.

Here you’ll build medium- to long-length hairstyles in line with the latest videogame techniques and specifications. The idea behind this workflow is to keep the process as artistic as possible, so we’ll be working in ZBrush often, using InsertMultiMesh brushes for laying down our Alpha strips and also in creating believable hair that can be baked down for the texturing process.

We’ll finish the tutorial in Marmoset Toolbag 2, which is a real-time PBR renderer. There are also a few tricks to learn to help make hair more believable within Toolbag 2.

Our thanks to Tom for this tutorial. For more of his excellent work, head to tomparkersartdump.wordpress.com

Step 01 – Prepare your IMM brush

How do I create real-time hair for games?

This is going to be the basis of our Alpha cards, so is very important to get right early on. Luckily, it’s very simple. In your 3D app of choice all you need to do is create a start, a middle, and an end. I prefer to add a slight curve to the top, so it replicates the natural curve from the root. These meshes must be flush with one another and assigned their own PolyGroups in ZBrush.
 

Step 02 – Set up the IMM brush

How do I create real-time hair for games?

In ZBrush we need to duplicate the SubTool for the brush to work, or you can also add new meshes that might help later on, such as a single strip brush instead. With the mesh snapped into place in the viewport, you can hit Brushes>Create InsertMesh. With the mesh locked in, we just need to play with some settings. Start by turning on Curve Mode in the Stroke setting, then clicking on Brush>Modifiers>Stretch/Weld Points. You may need to increase the Curve Res as well. This is so that the meshes weld together during each stroke.
 

Step 03 – Quickly test the brush

How do I create real-time hair for games?

Now we should be able to test the brush and make sure it’s working correctly before saving it for use later. Make sure the depth is correct so that you can layer the strips on top of one another and that the points are welding nicely. To do this, lay a few strips on a plane and then, when you’re happy, go to Tool>Geometry>Modify-Topology>Weld-Points. Then when you Autogroup, every hair strip should be in its own PolyGroup. This means that the brush is working correctly.
 

Step 04 – Concept sculpt

How do I create real-time hair for games?

Once you’re happy with the head sculpt, start by creating a DynaMesh hairstyle. This is a very important step as it will determine the look of our character and also help us decide on how we will go about laying out the hair strips. This block-in mesh is only going to be used as a guide when laying out our Alpha strips, so we don’t need to be too detailed and can concentrate mainly on the style and look of the hair.
 

Step 05 – Begin to lay hair strips

How do I create real-time hair for games?

With the concept sculpt done we can start laying down our base for the hair strips. For this I prefer to duplicate the head sculpt and drop it down to a low subdivision level before deleting all subdivisions – make sure this is a duplicate so you don’t lose your head sculpt. Start by laying down the underlying hair and working your way up. When editing the hair, use a large brush size over the curve (Blue reticule) so it creates a smooth transition. Always remember you can use the Move brush if needed.
 

Step 06 – Finish the hair in ZBrush

How do I create real-time hair for games?

By working our way around the model and trying to close as many gaps as possible, we can start to finish up this stage. Make sure you weld points and Autogroup like before for easier editing with the Move brush. If you set this to Topological, you can easily isolate single strips. Keep checking on your concept sculpt throughout to make sure you’re sticking close to it. Once you’re happy with the hair, you can start preparing it for UVs.
 

Step 07 – Prepare the hair

How do I create real-time hair for games?

The next step is to separate out the proxy head and get the model ready for UVs. Weld the points, Autogroup again, then hide the head and split. Now you should only be left with the hair, so you can start looking for errors. Run a quick UV Master on it to double-check all the points are welded. This should show quite clearly what needs fixing in your 3D application. In the screenshot you can see that a square piece hasn’t welded.
 

Step 08 – Start UVing

How do I create real-time hair for games?

You can fix any errors in Maya and then continue to UV the hair. Combine all the hair strips and then select Polygons>Unitize in the UV Texture Editor. This will UV each polygon to 0-1 Space. Next, select the model and hit Merge and Sew. This merges all the strips together, so we can pull the Islands out. The last step is to make sure all the UVs are running in the same direction and then use Polygons>Unfold to minimise any UV stretching – you may want to pin the borders as you do this.
 

Step 09 – Lay out your UVs

How do I create real-time hair for games?

As mentioned earlier, it’s important to have your UVs running in the same direction to drive the anisotropic direction in Marmoset Toolbag 2. This requires your UVs to run top to bottom, left to right, or vice versa. Now we need to decide on how many Islands we want and to scale our UVs into place ready for texturing. Once the textures are done, go back to the model and make tweaks, getting an idea of the Islands for texturing.
 

Step 10 – Build the textures

How do I create real-time hair for games?

In ZBrush we can try a new and artistic approach to creating hair. Now that we know what Islands we want, we can start laying out our textures within ZBrush. Start with a plane, and then using the CurveTube brush we can actually draw out the hair strands one by one. Before we do this, however, we want to increase the CurveSteps in the Stroke menu so each strand is more optimised, then we can play with the Size to add a bit of shape. Make sure to work from reference also.
 

Step 11 – Lay down the hair

How do I create real-time hair for games?

Now that the brush is set up we can start creating our strokes. I’ve decided to use three Islands on this hairstyle – one will be full and thick for the larger backing strips and then a medium and sparse Island for detailing. When laying out the hair, it’s important to think of your hairstyle and what you’re trying to achieve. For most styles you need to keep the strokes relatively straight and very thin. Make sure to work three-dimensionally by pulling some strands forward – this will help when baking to add depth.
 

Step 12 – Bake the maps

With everything ready we can start baking out our textures in Xnormals. I polypaint the hair white against a black background to get the Alpha information. Next bake a Normal and an Ambient Occlusion map, which can be tweaked to create Alphas to speed up the texturing process. Now you can start creating your textures. If you want you can also polypaint the hair for your Diffuse / Albedo map, although I prefer to do this all in Photoshop.
 

Step 13 – Tweak the meshes

How do I create real-time hair for games?

With our base textures ready, we can see how the model holds up. With this workflow you start by working blind, so it does require a bit of cleaning. We can duplicate shells and use Soft Selection to pull them around, then concentrate on filling gaps and getting a nice flow to the hair. This is also a good stage to get the model into Toolbag 2 as well, so you can see how it’s working and if you need to tweak your textures or meshes at all.
 

Step 14 – Transfer Vertex Normals

How do I create real-time hair for games?

This stage is often overlooked but as each hair strip has a hard-edged border, it means the normals will give you a separated look. To rectify this, simply create a proxy mesh to transfer the normals from using Maya’s Transfer attributes. If you have a short hairstyle then sometimes you just need to use the head mesh itself to transfer normals from. If you are a 3ds Max user, there are also a load of scripts available for this.
 

Step 15 – Set up Toolbag 2

How do I create real-time hair for games?

A good way to derive values from Toolbag 2 is to set up proxy materials for each surface. In this instance we are just making one for the hair. Using the Colour Picker we can get RGB values for the Albedo. The Gloss slider will give us a black percentage and for our Specular /Reflection we will use a solid colour to reduce texture maps. Now transfer these to Photoshop and replace the values with the textures. Check constantly between your texturing software and Marmoset to check your results.
 

Step 16 – Make final tweaks

How do I create real-time hair for games?

To get a truly realistic result, I like to change the shader to a skin shader – this means we have better control over our normal smoothing and shadow blurring. Also, we can create a secondary specular as an anisotropic gloss. In here we can control the strength, direction and position of the highlight. Using a Point / Omni light we can get some nice soft shadow information also. The final step is to hit Capture to increase the sampling and give you an external screenshot, as well as nicer results for your Alphas.

  • Shayan

    Nice tutorial Steve, thank you. can you explain about how do u use those hair strands in zbrush for textures (Do you put a plain behind them or what … ) please ?

  • lild

    Transfer Vertex Normals is an incredible tip, thx much!

  • Andrei Ionut

    Can you tell how many polys does the hair have?

  • KD

    Too many gaps in this tutorial. Works for someone with more experience maybe but not useful to someone who’s unfamiliar with the process.

  • Andrei Ionut

    I agree. Tried to follow it and got more confused. A good tip for a beginner is transfer vertex normals.

  • Nimeni

    Hey. This tutorial is really sweet. I learned a lot so thanks for sharing, but I’d really appreciate it, if you could go more in depths on step 12. It’s sadly to brief for me to replicate it. Specially how to get the alpha out of zBrush. Thanks

  • disqus_FPj4SGhsjm

    There isn’t many hair tutorials out there, so I wish this was more detailed.. 🙁

  • Paulo Cunha

    Read, do it, read and do it again over until learn

  • Piotr Dziubek

    Export to other application such as 3ds max or Maya, put plane behind, bake normal maps, then you need to paint albedo, gloss, specular, subsurface

    I never done it but i assume that’s how I’d do it

  • LuzariusLive

    Does anyone know how to do step 8 in 3d studio max?

  • LuzariusLive

    I’m trying to figure out how to do STEP 08 in 3d studio max.

    The UVW Map modifier allows you to unitize your mesh when you click the FACE option.

    Now i’m trying to figure out what the move and sew equivalent is in 3d studio max.

    http://polycount.com/discussion/166292/3d-studio-max-is-there-a-move-and-sew-feature-like-maya?new=1

  • Rene Berwanger

    Thank You for this Tutorial. That was my result using the new Unreal engine 4 Shader.

    http://i.giphy.com/l41YkjZVQWo8dQEG4.gif

  • Kamikaze_88

    Need better explanation from step 10 to 12, do I isolate one of the planes and start drawing the curves ontop of it?

  • Got anymore with better lighting?

  • sacredgeometry

    It shows you step by step how to do it. What more do you want?

  • Pingback: URL()

  • Ihzn _

    this is nice tutorial, but I’m stuck at 2 to 3 Step.. I’ve try with nothing missed. after I insert it as IMM Brush then activate the curve mode, my plane doesn’t consist of those 3 polygroups but just 1 polygroup. then I can’t weld it and autogroups… the Image process is step no 3 after pressing the autogroups button. can anyone help me pleasssseeeeeee?????

    https://uploads.disquscdn.com/images/60b64729e6767d6dd20f5c4cdb6df0af6963c8e1e6c2ee87a81af5eefabe4b9f.png

  • KSH 3D

    im a student, friend,,this tutorial is little bit confusing one to me can you please explain the baking process

  • Rene Berwanger

    I dont used baked alphas, I hand painted in photoshop with some “hair” brushes.

  • Latheesh V M Villa

    hi..is it possible to do this in blender. Modelling hair is okay. but arranging UV and texturing is real hard.

  • Andy Todd

    Stuck on step 12 and you elaborate?

  • Alfred Fabian

    On Step 8 , how did you managed to get the UVs to be 7 Uvs Island?

  • Alfred Fabian

    Did you managed to do step 8 ?

  • Miguel Silva

    Follow the highlighted red buttons

  • Alfred Fabian

    The “Move and Sew UV Edges” doesn’t automatically arrange the hair strip for us ? So we still need to move it individually ?

  • Muhammad Mohsin

    i cant weld my vertex as my weld vertex and stretch option is on..