Resources

Clo 3D

Welcome to the CLO3d Export Guide!

 

We recommend exporting Clo assets as Standard GLB.

If you’re bringing the exported and optimized asset into an application that has specific UV space requirements, we recommend exporting with Unified UV Coordinates enabled.

We’ll walk through both export methods and show you a few tips and tricks to ensure the texture quality and realism are maintained on export.

To help get your through this doc, below are the topics to revisit for each export method.

Sections to visit for a Standard GLB export (Recommended):

  • File Preparation

    • Pattern

    • Fabrics and Materials

      • Substance Materials

      • Semi-transparent Fabrics

    • Sewing

    • Topstitching

      • Seamline Shadow Topstitch

    • Puckering

    • Trims

    • Exporting

      • Standard GLB Export Settings

      • Avatars

Sections to visit for a Unified UV Coordinates export:

  • File Preparation

    • Pattern

    • Fabrics and Materials

      • Substance Materials

    • Sewing

    • Topstitching

    • Puckering

    • Trims

    • UV Editor

    • Exporting

      • Unified UV Coordinates GLB Export Settings

      • Avatars

Don’t forget to install the VNTANA Clo Plugin to export, upload, and optimize individual or bulk assets directly in Clo.

 

Let’s dive into it!

File Preparation

We’ve outlined our recommendations for preparing the pattern, fabrics and materials, sewing, topstitching, puckering, trims, and the UV Editor. 

Pattern

Clo allows you to Freeze, Deactivate, and Archive pattern pieces. Be sure all unused pattern pieces are deleted prior to export. If they’re not deleted, they will be present in the exported geometry and can contribute to higher poly count and file sizes.

2D window includes only pattern pieces used in the 3D garment. Deactivated/ Archived pattern pieces are not included.

Fabrics / Materials

To preserve texture quality in the export and the optimized asset, it’s highly recommended to use power of 2 textures. That means image dimensions of 1K, 2K, 4k, etc. We prefer 1K or 4K textures with a dpi of 300.

Be sure all fabrics include a Texture, Normal, and Roughness Map. Roughness can also use a value input. Both are acceptable but Roughness Maps are preferred.

Here’s an example Clo Fabric following our recommendations

Base Color Map
Normal Map
Roughness Map

In order to do 3D on the web you have to have GLB/glTF files with real-time PBR materials. In Clo you can use:

  • Fabric_Matte
  • Fabric_Shiny
  • Fabric_Silk/Satin
  • Fabric_Velvet
  • Leather
  • Metal
  • Plastic

You cannot use pre-rendered materials as these require physics that are only inside of Clo and do not work on the web. The materials that do not work on the web (whether in VNTANA’s viewer or others) are:

  • Fur (Render Only)
  • Gem (Render Only)
  • Glass (Render Only)
  • Glitter (Render Only)
  • Iridescence (Render Only)
  • Light (Render Only)
  • Skin (Render Only)

If you use these and try to export a GLB, you will see errors. This applies to any web application (eCommerce, AR, social media, etc), not just the VNTANA platform.

Note: Clo does not currently support the glTF extensions that would enable users to export parameters like sheen and clear coat.

Another thing you can do to help your textures out in optimization is to bump the Normal Map Intensity up to between 50-100. A higher intensity makes the embossed detail appear raised off the surface. A lower intensity will have the detailing closer to the surface. Normal maps do not change the geometry (like a Displacement map). They only mimic height and depth.

Roughness, Reflection Intensity, & Normal Maps

You may notice that the exported fabrics in your GLB are too shiny, too matte, or perfect. If the fabrics are too shiny or matte, you will need to adjust the Roughness and or Reflection Intensity.

Below you’ll see an overview of the values ranging from 0 to 100. We’ve included the normal map as well because sometimes you may need to adjust its intensity too.

 

Map

Value of 0

Value of 100

Roughness

Gloss

Matte

Reflection Intensity

Matte

Gloss

Normal

No Detail

Max Detail (Also applies to –100)


Roughness and Reflection Intensity Recommendations

If you are using a custom roughness map, we recommend setting the roughness value to 50 and adjusting the reflection intensity based on how glossy your fabric needs to be. A value of 50 will preserve the roughness values in the custom map. A low reflection intensity is matte, a high reflection intensity is glossier.

If you choose to use the Clo’s roughness values without the supporting map, we recommend for matte fabrics like cotton, jersey, fleece, linen, ribs, wool etc. to start with a roughness value of 50 or higher and a reflection value 10 or lower. For fabrics that require a semi-gloss like leather, ripstop, nylon etc., we recommend starting with a roughness value of 50 or below and a reflection intensity value of 50 or above. For fabrics that require a high-gloss like silk, taffeta, satin etc., we recommend a roughness value of 10 of below and a reflection intensity of 90 or above.

Substance Materials

If using Substance materials, be sure to adjust the texture size of the fabric within the Property Editor as needed. By default, the texture size imports as 1K. We like to change this to 4096px or 4K. 

 

Semi-Transparent Materials

When exporting as a standard GLB and your garment includes semi-transparent or translucent materials, you will have to revise your Base Color or Texture map to ensure it exports correctly. Skip this if you are exporting within Unified UV Coordinates.

  1. Bring the Base Color map into Photoshop.

  2. Select the areas that should be transparent.

  3. Delete those pixels.

  4. Save as a PNG with transparency embedded.

  5. Import into your fabric within Clo.

  6. Remove any alpha maps applied to your fabric in Clo. If Alpha maps are let on the fabric, the cloth will not export correctly.

Sewing

Ensure all pattern pieces are sewn properly and fully simulated prior to exporting.

Don’t forget to change the Sewing Line Type to Turned as needed for pocket openings, turnback pieces, etc.

 

We like to use the below Sewing settings to ensure the seamline shadows are visible on export.

Select all sewing that requires a seamline shadow to be visible. Then change the the following settings. Of course, you can adjust these as needed to meet your virtual quality standards.

  • Fold Strength: 100

  • Fold Angle: 240

  • IMPORTANT: Re-simulate the garment to reflect the changes in the 3D garment.

  • Note: If you have internal lines that require a visible seamline shadow, reference our topstitching section for detail on how to achieve the seamline shadow visual with our preset topstitch.

With these settings your garment will look like this.

Without these settings applied your garment will look like this.

If you are exporting with Unified UV Coordinates, you can enhance the seamline shadow by adjusting the 3D Seamline settings. We like to use the below if exporting with Unified UV Coordinates. 

3D Seamline

·      Intensity: 50

·      Thickness (in): 0.08

Topstitching

We recommend adjusting some of the topstitching settings within Clo’s Standard ISO Topstitching Library. Below are the settings we like to use to ensure the topstitching is clearly visible.

Additionally, we change our topstitching type from OBJ to Texture.

This helps with the performance of Clo, especially when using a coverstitch, and it reduces the amount of exported geometry.

Topstitching Settings

Adjust these Topstitching Settings:

·      Topstitching Type: Texture, NOT Obj.

·      Offset: Adjust as needed based on spec sheets

·      Stitch Count: 1

o   Versions older than Clo 7.1: We’ve noticed that topstitching with front and back stitches will export with the back stitch baked onto the front of the garment. To avoid this, remove all back stitches.

o  

·      Set the Length (SPI): adjust as needed

·      Space (in): adjust as needed

·      Thread Thickness (Tex): 80 – 150

·      Configuration, Face: Adjust as needed

·      3D: Off

o   It’s acceptable to turn 3D on however, if on we recommend using a normal intensity of 1-50 and the default thickness value.

Seamline Shadow Topstitch

When exporting as a standard GLB the seamline shadows will not be visible. As mentioned in the Sewing section, we like to adjust a few settings and add a topstitch to ensure the seamline shadow is exported. Skip this if you are exporting with Unified UV Coordinates.

If your garment includes internal lines that also require a seamline shadow visual, we found that applying our Seamline Shadow Topstitch preset to those internal lines will produce the shadow visual.

You can download the Seamline Shadow Topstitch here

Here’s how we apply this:

  1. Download the topstitch.

  2. Drag and drop it from your Downloads into the Topstitch Object Browser.

  3. With the Segment or Free Topstitch Tool activated apply the Seamline Shadow Topstitch to all internal lines that require a seamline shadow visual. You do not need to adjust any of the settings within this topstitch.

In this version, the seamline shadow topstitch is applied to the collar stand:

In this version, the seamline shadow topstitch is not applied to the collar stand:

Puckering

If using Puckering, the intensity specified will only export correctly in Clo 7.0 or higher during a Unified UV Coordinates export. These details will not be expressed in a Standard GLB export. 

If you would like to export as a Standard GLB, the puckering will need to be applied as a Topstitch. We’ve created 2 Puckering Topstitch presets:

  1. Puckering Single – visible on one side of the internal line.
  2. Puckering Both Sides – visible on both sides of the internal line. 

You can download the Puckering Topstitch presets here

Unified UV Coordinates Export

Standard Export

Trims

Trims can easily get lost in Clo’s 3D space. Be sure that all trims included in the file are attached or positioned accurately on or around the garment.

 

If trims are lost in 3D space, they will export in the geometry and create scale issues.

An easy way to check for unwanted trims is by selecting each trim listed within the Scene List. If you don’t see the trim highlighted in 3D space when selected, it is probably an extra, unnecessary trim that should be deleted.

Here’s an example of a trim lost in space.

UV Editor

The UV Editor MUST be set up prior to exporting as a GLB with Unified UV Coordinates enabled. Skip this if you are exporting as a standard GLB. 

 

Unified UV Coordinates are only needed for the below use case:

  • Your garment includes puckering.

  • You will bring the exported and optimized asset into an application that requires a specific amount of UV spaces.

 

Let’s dive into the UV Editor set up process.

If the backside of your fabric is different from the front, the pattern pieces with that fabric assigned will need to be duplicated and positioned within the UV Editor as well.

 

We recommend:

1.     If the backside of the fabric is different than the front of the fabric:

a.     Select the pattern pieces with that fabric assigned.

b.     Right-click and select “Layer Clone Under”.

c.     Position the pattern pieces in the 2D where desired.

d.     Duplicate your fabric.

e.     Swap the front texture maps with the back texture maps.

f.      Assign the duplicated fabric to the cloned pattern pieces.

g.     Re-simulate the 3D.

2.     Toggle to the UV Editor Mode.

3.     Right-click within the UV Editor window and select “Reset UV to 2D Arrangement”.

4.     Arrange all pattern pieces so they fit within the desired amount of UV spaces.

a.     The starting UV Space is the square with the green Y axis and red X axis.

b.     BE SURE when scaling pattern pieces down they are all scaled together. If they are not scaled together the texture resolution across different pattern pieces will be different.

c.     Be sure pattern pieces do not overlap with each other and the black lines of the UV Space square.

                                               i.     If pieces overlap each other and/or the UV Space border, you may see texture issues within your exported GLB.

 

Once all pattern pieces are arranged, it is acceptable to scale smaller pattern pieces larger if the texture quality on those pieces is blurry.

 

Note: The texture quality exported in the GLB is dependent on:

·      The original texture maps used in the fabrics (we recommend power of 2 textures).

·      The amount of UV spaces used within the UV Editor.

·      The texture size specified in the export window (we recommend 4K).

Recommended UV Spaces Per Garment Type

The chart below outlines the recommended UV spaces to be used per garment type. However, if you are bringing the exported asset into an environment with specific requirements related to the number of UV spaces, please follow those requirements when setting up your UV spaces in Clo.

Garment Type

# of UV Spaces

T-Shirt

1

Long Sleeve Shirt

1-2

Pants

1-2

Jacket

2-3

Dress

2

Collared Shirt

2-3

Hoodie

2

Skirt

1-2

Sweater

2

Outfit (Long Sleeve Shirt & Legging)

2 (Top uses 1 UV space and Bottom uses the other UV space)

Exporting

Export Settings

To export, navigate to File -> Export -> glTF 2.0 (GLB)

An export settings window will open. Follow our recommendations below.

We recommend a standard GLB export at this time because it maintains the texture quality in great detail, it requires the least amount of preparation steps, and it produces an extremely optimized result in VNTANA Platform.

Use the Unified UV Coordinates method as directed below.

Standard GLB Export

Use the below settings when exporting as a standard GLB export from Clo.

Before exporting, be sure you have:

  • Applied the recommended sewing settings where a seamline shadow visual is needed.

  • Applied the Seamline Shadow Topstitch to internal lines where a seamline shadow visual is required.

  • Changed your topstitching type from OBJ to Texture.

  • Embedded the transparent pixels into the Base Color/ Diffuse/ Texture map for semi-transparent or translucent materials. Removed any alpha maps from your fabrics.

Unified UV Coordinates Export

Unified UV Coordinates are needed when:

  • Using Puckering

  • When you require a specific number of UV Spaces.

Use the following export settings within Clo to export a GLB with Unified UV Coordinates enabled.

Below are the recommended export settings.

Before exporting, be sure you have:

  • Set up the UV Editor.

  • Changed your topstitching type from OBJ to Texture.

Note: It is acceptable to export at a higher texture size however, for the best-optimized file results, we recommend exporting with 4K because the textures will compress better to a lower size. 8K textures do not compress to 4K or 1K textures easily.

Avatars

When exporting a 3D garment with the avatar, additional steps will need to be performed in an additional 3D software (we use Blender), to prepare the asset for uploading to VNTANA Platform.

These steps only need to be performed when exporting with the Clo default avatar.

Instructions:

·      Import the exported Clo GLB into Blender.

o   Note: when exporting from Clo, if the accessory was added as an avatar, ensure that the “All Avatars” property is enabled within the export window.

·      Adjust the position of the objects as needed.

·      If the bones of the rig/ armature are in the way, toggle to the Viewport Overlays dropdown menu and turn off “Bones”.

·      Select each object individually within the Scene Outliner and Apply the modifier to ensure the avatar and accessories position and dimensions are locked into place.

·      Select all components.

·      Navigate to Mesh -> Apply -> All Transforms

o   This step will lock in the positions of the moved objects.

·      Export as GLB

·      Under the Geometry property, ensure that Apply Modifiers is enabled.

Note: If a trims position has changed during VNTANA optimization, you will need to Freeze/ Apply All Transforms to the affected trims before uploading to VNTANA Platform. Follow the Avatar steps outlined above to prevent trims from shifting during optimization.

Limitations & Recommendations

Sherpa and Fur

Real-time rendering does not support sherpa and fur. This is because real-time rendering does not support displacement maps. Our recommendation is to increase the intensity of your normal map to achieve the sherpa visual. Since we’re using a normal map the sherpa will not stand away from the cloth.

For fur, there is a tedious workaround. You can generate a texture from the fibers for the fur that could be applied to the area where the fur should be. You can tweak the texture maps to mimic fur, but there will be inconsistencies. The biggest issue with fur is that it adds a lot of volume and is very fibrous. You can create a mesh to approximate the volume and then use the material created to apply to it. That would only give you the volume. Unfortunately, we will not be able to get the “fuzz” that fur creates.

On This Page

Accelerate Your
Digital Transformation

Learn how our platform can automate your 3D process.

Tap the magnifying glass to the left of your screen to search our resources.