跳到正文
网页珍奇柜Web Curio

软体果冻雨

Softbodies,Niklas Niehus (holtsetio),2025 年

正在布展…

本柜的现场复刻:按原作的技术思路从零编写,不含原作的代码和素材。为什么不直接展出原作:原作依赖 WebGPU 计算着色器,只能在部分浏览器里运行;为了让它长期可用,本柜用 WebGL 和基于位置的动力学从零复刻。原作请点上方「去看原作」。

它是怎么做的

  1. 第 1 步每个软体被四面体化,表面网格通过重心坐标“蒙皮”到四面体上
  2. 第 2 步有限元(FEM)约束在 TSL 计算着色器中并行求解
  3. 第 3 步空间网格哈希用于检测不同软体之间的碰撞
  4. 第 4 步实例化渲染所有软体,并配合阴影与环境光

复刻配方

一段技术配方,可以直接交给 AI 编程助手,也可以自己照着写。想指定技术栈、位置和性能预算,就把它加入实现方案。

Tetrahedralise a few source meshes and store tet vertex positions, velocities and rest-shape matrices in storage buffers. Each substep, predict positions, then in a compute shader evaluate a corotated or Neo-Hookean FEM constraint per tetrahedron and apply position corrections, followed by a ground and wall collision pass. Build a uniform spatial hash grid of vertices for soft-soft collisions and push overlapping vertices apart. Skin the visible surface mesh to the tets with barycentric weights and draw all bodies instanced.

档案

能不能拿来用

原作以 MIT 许可开源:可以阅读源码学习,按许可证条款使用;在自己的项目里引用时保留原作者署名。

性能开销

视觉强度

实现难度

尺度为策展判断(1 到 5),用于比较和推荐。

核实记录:Opened https://holtsetio.com/lab/softbodies/ (200, title 'Softbodies - ThreeJS WebGPU Experiment - holtsetio.com'); repo holtsetio/softbodies exists, licence MIT via GitHub API; README credits TetSim by Johnathon Selstad.