- Runjie Zhao
- Akiko Zhu
This is a real-time webGPU-based cloth simulation project that implements a dry frictional contact model based on the Signorini Coulomb law. This offers an accurate simulation of friction and non-penetrative contact and boosts the simulation efficiency with the help of GPU computing.
| Final Result | Final Result | Final Result |
|---|---|---|
![]() |
![]() |
![]() |
- WebGPU pipeline
- Compute pipeline (particle generation, mass-spring-damper model, force generation, intersection)
- Graphics pipeline
- GUI controller
- Algorithm implementation
- Edge triangle collision detection
- triangle intersection
- particle free fall compute
- Projective-Dynamics-based forward simulation
- Gradient computation
- Enhanced rendering
- Texture loading and material rendering
- Cloth with animation
Use mouse's left drag, wheel, and right drag to control the camera
In this project, we use a structure that takes each vertex as a node and stores the position, velocity, acceleration, springs, and associated triangles in the node. By associating each vertex with those attributes, we can simulate physical particle system based on the mass-spring-damper model.
| Physical System |
|---|
![]() |
In this project, we use Hooke's law to describe the relationship between the force exerted on a spring given its displacement from static. By using a simple way to simulate the force, we now notice the horizontal and vertical springs can shear. Therefore, we add diagonal springs connecting all the vertices to make the springs connection more stable.
| Simple net force | Node |
|---|---|
![]() |
![]() |
| Hooke's law | Damping |
|---|---|
![]() |
![]() |
| Stable | Free fall |
|---|---|
![]() |
![]() |
Because under the force influence, we don't want our cloth to self-intersect. To prevent the self-intersection, we draw a small sphere around each of the vertices of our cloth. We ignore if the reverse sphere intersects with one of its neighbors, but if two spheres intersect that are not neighbors of each other, we will move each other so that they are no longer colliding.
| Sphere Colliders |
|---|
![]() |
Milestone 1
Milestone 2
Milestone 3
[1] https://people.csail.mit.edu/liyifei/publication/diffcloth/
[2] https://people.csail.mit.edu/liyifei/uploads/DiffCloth_SIGGRAPH_8_min.pdf
[3] https://igl.ethz.ch/projects/dynamic-garments/










