# Roblox Layered 3D

Layered clothing provides an opportunity to create 3D clothes and accessories that nearly any avatar can wear with any combination of other layered clothes.&#x20;

Layered clothing naturally stretches over an avatar's body and layers over other layered clothing items without clipping or breaking.

<figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2Fo8D0XnBZP4qEdgkkNNYW%2Fimage.png?alt=media&#x26;token=f65a742c-3319-42fc-8b1a-109e006081ba" alt=""><figcaption><p>Same outfit fits 2 different characters</p></figcaption></figure>

### Platform features

* [Paint layers](#paint-layers)
* [Morphing](#morphing)

## Preparation

Work must be carried out using the following software:

* **Blender** - no specific version (final model placement with all textures and skeleton)&#x20;
* **Photoshop** - no specific version
* **Roblox Studio** (setting up and checking up ready-made models)
* Chose[ reference ](https://wiki.customuse.com/platform-basics/choosing-references)

### Before Start

Please explore this material

<details>

<summary>Useful introductory links</summary>

* About 3D Layered Clothing\
  <https://devforum.roblox.com/t/3d-layered-clothing-is-now-available/1517745>&#x20;
* Requirements for the 3D model\
  <https://developer.roblox.com/en-us/articles/layered-clothing-asset-requirements>&#x20;
* Dummy and armature (Cage) as well as examples provided by Roblox Developers <https://github.com/Roblox/avatar/tree/main/LayeredClothingDeveloperRelease/Layered_Clothing_Cage>
* How to make a simple model and upload it to Roblox Studio <https://www.youtube.com/watch?v=a0D2CjqUSP8> &#x20;

</details>

## Model quality

It is very important that the model is made as qualitatively as possible.&#x20;

* the model must be well-detailed&#x20;
* fully comply with platform standards
* follow chosen style  &#x20;

<div><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FAgFFQCnSTgMAQjRP4Azs%2Fimage.png?alt=media&#x26;token=713ba332-026b-4d51-bb95-09f7b89d0e63" alt=""><figcaption><p>poor quality work</p></figcaption></figure> <figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F71Y16uKJGxmt6n75gndS%2Fimage.png?alt=media&#x26;token=49c5d3cc-7d03-419c-9408-9954c27c5aaf" alt=""><figcaption><p>quality work</p></figcaption></figure></div>

## Model preparation

### Base

Models must be created for a special Roblox layered dummy and only for it, for proper work of stretching scripts in Roblox.

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FS8PlnPHVMl7CYJFJ3dYy%2Fimage.png?alt=media&#x26;token=0a43347f-1e97-47a8-a8e7-2a897da35058" alt=""><figcaption><p>Roblox layered base model</p></figcaption></figure></div>

{% hint style="info" %}
Roblox layered clothing applies only to bipedal humanoids.
{% endhint %}

### Modelling&#x20;

The model can be created in any software you like, but in the end, the model **must be** in Blender.

\
Models should **not have** internal volume. The mesh should be **closed** and have no holes. This principle also applies to all openings in an item of clothing, whether sleeves or waistband.

<figure><img src="https://lh6.googleusercontent.com/WV2MyreZ3CUHQt9TY5Mj5mBGaGx55ZLI29ZfqEllRu9TbKx-e7GxiWU9v4x8Pc0NgbFesBQH3EcR9jCdPZmQjYr3b_3w-yEyMxsrKgLKNVJHu0zTG3IKQtcH29USo5CiNHtBpR51bNnDXH1bCwZMOQ" alt=""><figcaption><p>Caping holes example</p></figcaption></figure>

<details>

<summary>Restriction on polygon quantity:</summary>

* **Upper clothing** - 3,500 triangles&#x20;
* **Bottoms** - 3,000 triangles&#x20;
* **Shoes** - 1,500 triangles&#x20;
* **Full Suits** - 5,000 triangles&#x20;

</details>

### Mask

Blender and glb file must contatin **mask** mesh (mannequin that shows in editor on Customuse)\
You can find link to download this mask [here](https://gitlab.com/customuse/contributor-program/-/blob/master/RBL%20-%20Roblox%203D/mask/rbl_mask.blend)\
\
![](https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FLoVo5hJA0EqqM1OKREcq%2Fimage.png?alt=media\&token=d79f80c1-9e4c-4e38-a590-c33ebd8b5f0e)

{% hint style="info" %}
**Mask** should **not** have any **Color Atribute** \
![](https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FGtWTJcunfaIy3JpgaxhG%2Fimage.png?alt=media\&token=54c0757b-e225-42a4-976d-7710b5e90ce1)
{% endhint %}

### Pivot points

Pivots (origins) of **empty Cage**, **mask** and **armature** must be in zero coordinates (x=0,y=0,z=0)

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F1CueZ0owcA7bw8sZ7L0r%2Fimage.png?alt=media&#x26;token=56a88455-eff3-4c53-bbe4-3a26ecd7126c" alt=""><figcaption></figcaption></figure></div>

### **UV Layout**

UV Layout uses general standards. No unique features on Roblox Layered here.

{% hint style="info" %}
Check general UV Layout requirements [here](https://wiki.customuse.com/platform-basics/uv-layouting).
{% endhint %}

### Texturing

Texturing can be done in any software convenient for you, as long as the result is 4 textures:&#x20;

* diffuse&#x20;
* metallic&#x20;
* normal map&#x20;
* roughness.

Textures for **glb** file also requiered and contains of these textures:

* albedo
* normal map
* orm

<details>

<summary>Texture resolution limits:</summary>

* **Upper clothing** - 1024х1024
* **Bottoms** - 1024х1024&#x20;
* **Shoes** - 256х256&#x20;
* **Full Suits** - 1024х1024&#x20;

</details>

### **Rigging**

The scene which should be used for modelling clothes is provided by Roblox.&#x20;

You can download it [here](https://github.com/Roblox/avatar/tree/main/LayeredClothingDeveloperRelease/Layered_Clothing_Cage).

The file will contain all the necessary files, which are:

* **Armature** - rig provided by Roblox, which we will apply to our model
* **Inner and OuterCage** - essential components of the project.  With the help of these cages, it is determined how clothes will be put clothes on the avatar&#x20;
* **InnerCage** - is used as a mannequin for clothes
* **OuterCage** - covers the clothes&#x20;
* **Attachment Points** - these are spheres that are used to attach clothes to a mannequin.       Each Attachment is suitable for a different type of clothing:                                              **BodyFront\_Att** - T-Shirt, Shirts, Sweaters, Jackets

  **WaistCenter\_Att** - Pants, Shorts, Dresses and Skirts&#x20;

  **RightFoot\_Att** - Right Shoes Foot

  **LeftFoot\_Att** - Left Shoes Foot    &#x20;

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F9Wf1VuANyLSg8heQcNFz%2Fimage.png?alt=media&#x26;token=daac0541-38e9-41b2-92db-1d671cae4e65" alt=""><figcaption><p>Attacment points and cages</p></figcaption></figure></div>

{% hint style="info" %}
You have to choose only one Attachment and **remove** the others from the scene.  Detailed information about attachment points can be found [here](https://developer.roblox.com/en-us/articles/using-avatar-importer#attachments)
{% endhint %}

### Weights

Assign the armature and weights correctly so that the accessories can move naturally in different poses.

Once you have combined armature and mesh, you will get vertex groups to which the weights should be assigned&#x20;

\
![](https://lh5.googleusercontent.com/VT1XfuFMAFSTA-wt_RfeO0EtvkhII7ot_XpPe2HxrUgF2z86K72oIJ30Qt2FdPgqLpTpzj0xKGnY9-7v72wZojwG2GzLtjUP3WXZunPnk1LGZNV4FPLUEOYHZRtnkRCEYonAHyMThKbku0WjltAGfg)![](https://lh3.googleusercontent.com/qo0rbvN9S_dpc-AvcrDpGb1ED_7bYk_np_yQlJ-LGN5tpDR7qRNHGOgUWKOY9DKqVjRjWwFTwDv4GE-TBboVvm2Mj6uSMKvHPfQPCCwmk7-bPzwgnD6o-pArh1E0Rx-RSQ9YmlrFjJdshiBzhFyLQw)<br>

{% hint style="warning" %}
**Roblox requires** limiting the number of weights per vertex by **4**&#x20;
{% endhint %}

\
![](https://lh5.googleusercontent.com/bVoAnKNZSSgvuuNy-zLl-RE9c9oMjIK1TK0Rj_tm5lfzCR7Tt7-Uy9Brdzf2oGeiJx7fgz0Urg_AxPLE6XnXKfPkxM7XwEQ-zU5q2bI_WAzx9bIK4GYhTBO4jfVbM86S21ey5pa-jLLUt8sQnEtFUw)![](https://lh4.googleusercontent.com/YBRlq181WvbjLnX5pYCjoo9Vwr6UYjsnTNa6R0KcpVMlbVdse6eoTBrB_6ucCgXgR_qZ6k_L0ogX3_XaolfZ_t3JmdzFqTH9gLDuIFjLcAvmpIOK3JJtrqwz9aTVPiJm0XC4OpcUyu7pkemHiy5I9A)

After that, you can get to work, but before that, we advise you to study [examples of work](https://github.com/Roblox/avatar/tree/main/LayeredClothingDeveloperRelease/Layered_Clothing_Examples).&#x20;

It will also help to understand which vertex group is responsible for which area.

How to unload a model in Roblox for testing can be studied [here](https://devforum.roblox.com/t/3d-layered-clothing-is-now-available/1517745).&#x20;

You can also watch a [video ](https://www.youtube.com/watch?v=a0D2CjqUSP8)with a step-by-step explanation.

### Paint layers

Paint layers use general standards. No unique features on Roblox Layered here.

{% hint style="info" %}
Check general Paint Layers requirements [here](https://wiki.customuse.com/platform-basics/paint-layers).
{% endhint %}

### Naming

Naming uses general standards, but the names of textures have a **unique tag** at the end that must be added for proper work in Roblox.

<details>

<summary>For example:</summary>

* Albedo texture -  rbl\_130422\_timvs\_redskirt\_**DIF**&#x20;
* Metallic texture -  rbl\_130422\_timvs\_redskirt\_**MET**&#x20;
* Normal map texture - rbl\_130422\_timvs\_redskirt\_**NOR**&#x20;
* Roughness texture - rbl\_130422\_timvs\_redskirt\_**RGH**

</details>

{% hint style="warning" %}
You need to use only big letters for tags as in the example
{% endhint %}

Textures used in **glb** require general naming standarts

{% hint style="info" %}
Check general Naming requirements [here](https://wiki.customuse.com/platform-basics/naming-convention).
{% endhint %}

### Morphing

Morphing for the Roblox Layered is optional now and requires testing. Nevertheless, you can check the general requirements here:

{% hint style="info" %}
Check general Morphing requirements [here](https://wiki.customuse.com/platform-basics/morphing).
{% endhint %}

## **Exporting**&#x20;

You will need to export your model with bones in **FBX** and **GLB** formats.

To import your model into Roblox Studio you will need **FBX** format.

{% hint style="warning" %}
**"Be sure to clean out any excess files from your Blender file before exporting to FBX and GLB format"**
{% endhint %}

### FBX

FBX should contain everything except:

* mask
* materials

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FH0ZlAD72gH9Akf0phFbw%2Fimage.png?alt=media&#x26;token=61c4f9a1-5cdd-49eb-8c96-04735e5f8d17" alt=""><figcaption></figcaption></figure></div>

Remove the **Add Leaf Bones** check box from the .fbx export menu under Armature.                     The rest of the default settings for the Blender .fbx export can be left untouched.

{% hint style="info" %}
The exported .fbx model **must** have at least 1 **attachment point**
{% endhint %}

### GLB

This file will be used as a preview model in Customuse.

The GLB file must contain the following:

1. Mask
2. Armature
3. Mesh
4. Material with [textures](#texturing)

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FdSROMfk6KiaWUnYGKCZv%2Fimage.png?alt=media&#x26;token=6ba4431f-7c24-4c59-92f8-3822d1c2e80a" alt=""><figcaption></figcaption></figure></div>

Everything else must be deleted! The glb export settings should be left default.

## **Roblox Studio**

### Model testing

Before you pass the model, make sure that everything is working properly. You can do this by uploading an Asset to [Roblox Studio](https://developer.roblox.com/en-us/articles/Studio-Setup).

How to download and test an asset in Roblox Studio you can learn by watching this [video ](https://www.youtube.com/watch?v=a0D2CjqUSP8)and reading this [Roblox guideline](https://devforum.roblox.com/t/3d-layered-clothing-is-now-available/1517745).

{% hint style="info" %}
As a basic quality standard, we suggest to test model using the basic avatar r15. &#x20;
{% endhint %}

It is acceptable that assets may have small artefacts in the hips and legs during testing. This is a variant of the norm, but it is better to avoid the appearance of artefacts in any form.&#x20;

<figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FW6mBDAAzpccGl9Yvt7pt%2Fimage.png?alt=media&#x26;token=f1fa34aa-fbcf-4094-8997-759e531085df" alt=""><figcaption><p>Here are some examples of possible artifacts</p></figcaption></figure>

It is **necessary** to check clothes on different avatars.

{% hint style="info" %}
You can study an example of quality work [here ](https://www.loom.com/share/0e96c7b528e84429a899ec444ed54f40)
{% endhint %}

## **Final check and** [**upload**](https://wiki.customuse.com/introduction/contributor-hub)

### The final folder with all the files

1. Exported paint layers as well as the mask layer
2. Blender file
3. FBX file exported from Blender
4. GLB file exported from Blender
5. PSD file from photoshop with all layers
6. All textures in the correct resolution and file size
7. Blender file <br>

<div align="left" data-full-width="false"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2Fhnfvg2NoqzRIC3YfuILu%2Fpacking.png?alt=media&#x26;token=0340dca5-a6ed-492b-b3dc-abfb5e54d7dd" alt=""><figcaption><p>final folder</p></figcaption></figure></div>

\ <br>

<br>

<br>
