跳到正文
网页珍奇柜Web Curio

流体油画

Fluid Paint,David Li,2017 年

正在布展…

原作直展:这是 David Li 的原始作品,按 MIT(附带的 Open Sans 字体为 SIL OFL 1.1) 许可证收录(版本 6b8adfa)。原作全部脚本和着色器原样展出;页面只改了一行:把从 Google Fonts 加载的 Open Sans 换成随附在同一目录里的字体文件,这样藏品不会向其他网站发请求。在画布上拖动即可用带刷毛的笔作画。 许可证全文 · 收录说明

它是怎么做的

  1. 第 1 步每根刷毛是一串约 10 个顶点的链,用距离、弯曲、平面约束(PBD)在 GPU 上求解
  2. 第 2 步刷毛贴近画布的部分把颜料“拍”进速度场和颜料纹理
  3. 第 3 步颜料作为流体:平流、散度、Jacobi 迭代求压强、去散度,在着色器中完成
  4. 第 4 步颜色存在 RYB 空间,用三线性插值转回 RGB,模拟颜料的减色混合
  5. 第 5 步颜料厚度生成法线,按光照方向做漫反射和高光,呈现厚涂感

复刻配方

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

Model the brush as N bristles, each a chain of about ten vertices stored in textures, and solve distance, bending and canvas-plane constraints with position-based dynamics in fragment shaders as the brush follows the pointer. Where bristles touch the canvas, splat velocity and paint into a paint texture. Run a standard grid fluid step on the paint (advect, compute divergence, Jacobi pressure iterations, subtract gradient) restricted to the region near the brush for speed. Store colour in RYB and convert with a trilinear lookup for subtractive-looking mixes, then derive normals from paint thickness and shade with a simple microfacet light.

档案

交互

能不能拿来用

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

性能开销

视觉强度

实现难度

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

核实记录:Opened https://david.li/paint/ (200, title 'Fluid Paint'); repo dli/paint exists, licence MIT via GitHub API; read shaders/ (advect, jacobi, distance/bending constraints) and painting.frag (rybToRgb).