The cloth simulation template allows you to generate realistic cloth simulation with your own custom meshes. It comes with an example bandana cloth, as well as helper scripts to modify your own meshes.
Notice that cloth simulation will enable you to make cloth move with human-force (move, stretch and bend), collision, gravity, air friction, etc. Each single point on cloth may move in different directions due to the combination of different forces.
This template has two examples. We can find them in the Objects Panel.
Head Fabric Material Example
This example demonstrates a bandana cloth attached to the user's head. Let’s click on the Cloth Simulation Bandana Object. Here we can check the Script Components attached to the object in the Inspector Panel.
The first Script Component we have here is the Cloth Simulation Script. This is the main helper script for Cloth Simulation.
Notice here we choose Bandana Mesh as the Cloth Mesh for the simulation. Right below we set where our vertex color is red on the bandana model to follow the user’s head with the Neck Pivot Point object.
Tip: Each vertex in a 3D model can have a color assigned to it by the 3D modeling software (Vertex Color). Here we are using the red colored vertex as the parts of the mesh we want to bind to the Follow object.
Then right below are the Simulation Settings for our bandana. Try playing around with them to see how they work!
Notice here we are enabling Use Fabric Controller to utilize fabric presets from Fabric Material Controller. This controller overrides some of our simulation settings based on some fabric presets. The script attached to Fabric Controller is the second Script Component here in the Inspector, Fabric Material Controller.
Now let’s take a look at the Fabric Material Controller. Here we can find 4 different fabric types that we can use for our cloth! Try clicking on the drop down list to check different fabric types and playing around with fabric properties!
Now let’s get back to Cloth Simulation Script. We can disable Use Fabric Controller to switch back to the global Simulation Settings and material. Try playing around with the materials and the global Simulation Settings to see how they work! Notice by default the Cloth Simulation Script is using Debug Material to display the Vertex Colors of the bandana.
Create a new Cloth Simulation Object
Now let’s delete the Cloth Simulation Bandana Object in the example. And add the bandana from scratch to see how our bandana cloth is configured.
First, let’s add a new scene object in the Objects Panel and rename it to “Cloth Simulation Bandana” (Objects panel > + > Empty Object). In the Inspector Panel, then add the Cloth Simulation script as a new Script Component to the object (Inspector panel > + Add Script > Cloth Simulation).
Applying Cloth Simulation to your Mesh with Material
Notice that we choose the Bandana object as our cloth mesh as an example. This mesh can be your own customized mesh. For the material, we choose Debug Material to demonstrate the vertex color mapping for the Bandana model.
Attaching the Cloth
Next we can configure how the cloth is attached to the user. We want to set where our vertex color is red on the bandana model to follow the object Neck Pivot Point.
Tip: We choose the color red here because our 3D model has the vertices we want to bind in the color red. You can use any color, however.
Once we set the Follow Object, we can see our bandana in the Preview Panel.
Tip: You need to paint at least one vertex color on your own customized mesh to attach the mesh to the Follow Object. You can check out more details on how to import 3D objects into Lens Studio here.
Cloth Simulation Settings
Then right below we have some settings around our cloth. Try playing around with them to find the perfect setting for our mesh.
Fabric Material Controller
Notice we can also utilize the Fabric Controller to override cloth simulation setting by enabling the Use Fabric Controller. In the Resources Panel we can find the Fabric Material Controller in the Prefabs folder. Drag the prefab into the Objects panel, we can then make a reference to the Cloth Simulation Script.
We can then choose the Fabric Controller object in the Objects panel to find 4 different fabric types that we can use for our cloth!
Modifying your cloth’s material
For each fabric type, we can modify the materials and some cloth simulation properties. Feel free to check the difference between each fabric type and play with the properties! For fabric materials we can go even deeper! Right click the material, and press Select to see the material.
Then, you can modify the material in the Inspector panel!
Or even modify it in the Graph Editor!
Tip: To learn more about Material Editor, check out the Material Editor template.
Occluding parts of the cloth
Notice the bandana is not occluded with the body yet. To add the body texture occlusion, let’s find the Plane Occluder Prefab in the Resources Panel. Simply drag and attach it as a child for Cloth simulation Bandana Object.
Tip: This prefab contains a plane displaying the body segmentation, so that the parts of our cloth that is behind the user would be occluded. To learn more about body segmentation, check out the Body Segmentation template.
Vertex Color Example
Now that we understand how Cloth Simulation works at a high level, let’s take a look at making a more complicated clothing item with Vertex Controller. Enable the Vertex Color example in the Objects panel and select the Cloth Simulation object to see a similar set up. Here the Override Vertex Setting is enabled.
If we select the Vertex Controller object we will find several scripts that define how each vertex behaves. Try playing around with different settings to see how they work.
Like before, you can select the vertex color you want to modify based on the vertex colors available in your mesh. In this case, our cloth material has vertices colored yellow, red, and green!
Notice here for each vertex simulation property we also have the property global weight. Global weight is how much the influence from the global settings in the Cloth Simulation Script. If we set property Global Weight to 0.0, we are using the absolute value of the property in the Vertex Controller on this vertex. If we set it to 1.0, we are ignoring the property value in the Vertex Controller. When we disable the vertex controller, all the vertex properties are 0.0 by default. So the mesh will be simulated by all global simulation settings.
Let’s take Bend Stiffness as an example.
let G = globalSimulationSettings.bendStiffness let G.VertexWeight = globalSimulationSettings.bendStiffnessVertexWeight let V[i] = perVertexSimulationSettings[vertexIndex].bendStiffness let V[i].GlobalWeight= perVertexSimulationSettings[vertexIndex].bendStiffnessGlobalWeight
In the simulation, the final result for Bend stiffness will be bendStiffness[i] = G * V[i].GlobalWeight + V[i] * G.VertexWeight;
Tip: This example also uses a Debug material to display the Vertex Colors of your mesh!
Previewing Your Lens
You're now ready to preview your Lens experience in Snapchat! To do so follow the Pairing to Snapchat guide.
Please refer to the guide below for additional information:
Still Looking for help?Visit Support