Hair and Beards: Assets

In this guide, we’ll cover the basics of what you need before you get started with importing, how to import, and how to connect what you’ve imported in the Toolkit for further use.

Requirements

To make a hairstyle work in the engine, you need three things:

• A hair mesh (in .fbx or .gr2 format)
• A hair texture (MSKA, in .dds format, not sRGB)
• Optionally, a scalp texture (in .dds format)

Using these, we will need to create:

• A hair preset
• A hair material
• If you have a scalp texture, a scalp material

Tall and Small Race Versions

We generally have two different versions of hairstyles: one for tall races and one for small races.

The tall race version of the hairstyle gets assigned to:

• Humans
• Strong Female Humans/Elves/Half-Elves/Tieflings
• Elves
• Half-Elves
• Tieflings
• Drow
• Githyanki
• Female Half-Orcs

The small race version gets assigned to:

• Gnomes
• Dwarves
• Halflings

The small race version exists to make sure that the hair stays proportional to the overall size of the race and doesn’t get scaled down too much. Hair assets with the HUM or GTY tag are the tall race versions, whereas hair assets with the DWR tag are the small race versions.

ⓘ You don’t necessarily need the small race version of the hairstyle. If you make the tall race version automatically snap, it will snap all the same to every race. This just means that on small races, the hairstyle might look a bit disproportional.

Exceptions

There are two exceptions to the above: Male Half-Orcs and the Male Strong body shape for tall races. Even with automatic snapping, the heads of these body shapes often have clipping issues, requiring manual hairstyle adjustments.

Adding hair for these exceptions can get tedious, so it’s recommended to first set up the main “tall race” version and check it in-game. If there are visual problems, only then address them.

Importing the Hair Mesh

Open the Resource Manager (the box of crayons icon) via the main toolbar.

Opening the Resource Manager.

Navigate to your mod in the left sidebar. If you like, you can create some subfolders here and a new package to better organise your assets. For the purposes of this guide, we’ll use the existing base package. With your package selected, click on the Add Resource button (the box of crayons with the + symbol).

Adding a resource to the mod package.

In the Add Resource Wizard, select Model. Your model should already be placed in your mod’s Source Asset Data Path, and in .gr2  or .fbx format.

In the Rename/Move window, double-check that the asset is going into the right package. You can also change the name of the asset here, if you like.

The Rename/Move window after adding a Model via the Add Resource Wizard.

Click OK.

If you’re importing a .fbx, you’ll see the Visual Importer window. You don’t need to change any of the settings here. Just click on Import at the top of the window.

Importing an .fbx file.

Once the import process is done, the model should show up in the target package of the Resource Manager as a VisualResource. In this example, the new HAIR_HUM_F_Test_A asset has appeared:

The model appearing as a VisualResource in the Resource Manager.

Importing the Texture

As before, click on the Add Resource button, and this time select Texture. Your MSKA texture should already be in .dds format.

As with the model, double-check the target package and name, then click OK to import the asset. You will be asked if the texture is sRGB. MSKA textures should not be sRGB.

The imported texture should appear in the Resource Manager as a TextureResource.

If you have a scalp material, repeat the process above to import it.

Creating a Hair Material

To use the texture(s) you imported, you’ll need to set up a material. The easiest way to do this is by using an existing MaterialResource as your base, and then adjusting it to fit your needs.

In the Resource Manager, click on the All folder in the sidebar, then type hair into the filter bar. Right-click on the Material icon (the blue globe) to show only MaterialResources.

Filtering for MaterialResources with "hair" in them.

In the resulting list, you’ll want to find a hair material that uses the CHAR_Hair.lsf source file. You can change everything else – it’s this source file that you really need. We’ll use HAIR_Straight_Long_A.

Making sure that the selected hair material uses CHAR_Hair.lsf as its Source File.

Right-click on the chosen MaterialResource file and select Create New From Selected…

Creating a new material based on the selected existing hair material.

You’ll see a small Select Target Package dialogue window. Double-check the target resource package – it should be located in your mod – and give the material a new name. For this example, we’ll go with HAIR_MyNewHair.

Confirming the target resource package and naming the new material.

Press OK. Navigate to that target package, and you should see your new MaterialResource there. If you don’t, you’ll need to remove the filter by clearing the text from the filter bar.

The material appearing as a MaterialResource in the Resource Manager.

Double-click on the MaterialResource to open the Material Editor.

The new material opened in the Material Editor.

Scroll down until you find the section called 01Texture Maps. Look at the IDDepth_Root_Alpha_MSKA parameter.

Locating the IDDepth_Root_Alpha_MSKA parameter.

With the Material Editor still open, go to the Resource Manager and look for the MSKA texture you imported earlier. It should be a TextureResource.

ⓘ If you still have only MaterialResources showing, right-click on the Material icon again to show all resource types again.

With the texture selected in the Resource Manager, click on the arrow pointing left (<=) in the Material Editor beside the IDDepth_Root_Alpha_MSKA field. It should populate that field with your imported asset.

Populating the IDDepth_Root_Alpha_MSKA field with the imported asset.

In the Material Editor, click OK.

Creating a Material Preset

While you can create a Material Preset from scratch, it can be time-consuming. It’s usually easier to take an existing Material Preset, make a copy, and modify it to suit your needs.

Reusing Existing Material Presets

Navigate again to the All folder in the Resource Manager, and filter for Material Presets.

Filtering for Material Presets in the Resource Manager.

Choose a HAIR_ preset to copy. We’ll go with HAIR_HUM_M_Wavy_Long_B. Right-click on it and select Create New From Selected. In the following window, confirm the target resource package and give your new preset a name.

Confirming the target resource package and naming the new preset.

After pressing OK, navigate to where the new preset was created and double-click on the file to open the Material Preset Editor.

The new preset opened in the Material Preset Editor.

You can play around with these settings if you like – just make sure to click Save or OK so you don’t lose your work.

Creating New Material Presets

If you’re determined to start from scratch, you’ll want to create a Material Preset via the Add Resource Wizard. It creates an empty preset. Give this preset a very similar (or identical) name to your hair mesh to avoid confusion. Click OK.

Double-click on the preset to edit it.

Editing a preset.

In the Material Preset window, click on the Add Preset (+ Preset) button, and select Scalar.

Adding a scalar parameter.

This creates a default Scalar Parameter. Double-click on the name to rename it to the correct parameter name. These include:

• Scatter
• ColorDepthContrast
• DepthColorExponent
• DepthColorIntensity
• HairBacklit
• IDContrast
• RootTransitionMidPoint
• RootTransitionSoftness
• Roughness
• RoughnessContrast
• PixelDepthOffset
• PixelDepthOffsetRoot
• DepthTransitionMidPoint
• DepthTransitionSoftness
• ScalpDarken
• ScalpDesaturation
• DreadNoiseBaseColor
• HairFrizz
• SharedNoiseTiling
• HairSoupleness
• MaxWindMovementAmount

Setting the parameter name.

It’s up to you to play around with these settings as you like.

Adding a Scalp Material

You’re not required to have a scalp material. If you don’t, go ahead and skip this section. If you do, you should already have imported it as instructed in Importing the Texture.

Now, let’s create the scalp material. Just as you did for the hair material, go to the All folder, filter out everything but the materials, and look for a scalp in the filter bar. Here, you’ll want to choose a material that uses the CHAR_Scalp.lsf shader.

Finding a material that uses the CHAR_Scalp.lsf shader.

We’ll use HUM_F_NKD_Hair_FemStraight_Short_A_Scalp. Right-click on the file and select Create New From Selected. Give your scalp material a good name and press OK.

Naming the new scalp material.

Find your new scalp material inside your mod resource package, and double-click to open it. At the bottom of the settings, find IDDepth_Root_Alpha_MSKA and, using the same method as before, set it to your imported scalp texture.

Now, you have everything you need to start setting up the mesh.

Assigning Materials to the Mesh

Find your hair mesh file (VisualResource) and double-click it. An Edit Visual window will open.

The Edit Visual window after opening the hair mesh VisualResource file.

Using the left-facing arrow (<=) like before, assign your hair material to the material(s). There might be multiple. Click OK.

Quick Check

With the materials assigned to your mesh, let’s take a moment to double-check how it’s looking in the preview panel. Click on the VisualResource (the mesh) – you should see a mesh with the texture correctly displayed. In the case of this example:

A mesh successfully appearing in the preview panel (top right).

What if I don’t see anything in the preview panel?

If you see nothing in the preview panel when the VisualResource is selected, try selecting one of the MaterialResources. If the preview also shows nothing for the MaterialResource, you’ll need to resave it. The material in the below screenshot has this problem, so let's fix it.

A material that isn't showing up in the preview panel.

Right-click on the MaterialResource in question, and select Open in editor…

Opening the MaterialResource in the Material Editor to resave it.

This will open the Material Editor. You don’t need to do anything here – just go to File > Save to save the material again.

Resaving the material in the Material Editor.

Your preview for the MaterialResource should now show correctly.

The material now appearing successfully in the preview panel.

Close the Material Editor.

ⓘ Opening the Material Editor will almost always cause errors to appear, despite you having made no changes. This is a known issue.

Continuing the Mesh Setup

Make sure your mesh (VisualResource) is selected in the Resource Manager. In the right panel, find the Hair Length, Hair Preset Resource ID, Scalp Material ID, and Slot ID settings.

The relevant fields in the Resource Manager.

• Hair Length is responsible for helmet hair (see Hair and Beards: Helmet Hair). Pick the length according to the length of your new hairstyle.
• Hair Preset Resource ID is where you assign your Material Preset resource. Clicking on the arrow will reveal a dropdown menu where you can search for this preset. Select your preset and click on Set.
• Scalp Material ID is where you assign your scalp material, if you have chosen to use one.
• Slot ID determines which tab the mesh appears in when using the Character Editor. Hairstyles should always be Hair.

Once those fields are assigned, you’re ready for the next step.

The relevant fields filled in correctly.

What Next?

Now that you have the meshes, textures, and materials set up, you can proceed to Hair and Beards: Character Creation, where we will add our new hairstyle to the Character Creation options.