Digital Marbling
I’ve been working on a physics-based marbling simulation to explore the ways that the traditional craft of paper marbling can be augmented digitally. Paper marbling is a centuries-old craft that uses the movement of water to create swirling patterns of inks and paints on paper (and sometimes fabric). The earliest accounts of marbling date back to the 12th century in Japan, where it is known as “suminagashi.” Inks were floated on top of water and manipulated into delicate, flowing shapes using breath, fans, and other utensils. Later, paper marbling traditions emerged in the Middle East and Europe, making use of more viscous media and fine-toothed combs to create repeating patterns with greater regularity and control.
I built an early prototype of a marbling-inspired fluid simulation back in 2017 when I was first learning to write physics simulations with WebGL, interactive demo below:
Over the past year I’ve been revisiting this work and exploring computational methods to more accurately simulate the marbling process. Recently, I even had the opportunity to collaborate with Jessica and Jesse at Nervous System (whose work I am a huge admirer of) on a series of marbling infinity puzzles:
I’ve learned a lot in the process of building this simulation, and I wanted to use this post to compile some of the main ideas in one place. You can find additional info about how the marbling puzzles were designed in Nervous System’s blog post. This collaboration was also featured in the New York Times.
Marbling Simulation
In order to create a marbling simulation, you need to model the motion of fluids. Typically, this is achieved by running a physics-based fluid solver and iteratively moving virtual inks along the flow. Combing actions and other manipulations are modeled as forces applied to the fluid’s velocity field. Due to the high viscosity of the fluid media (called “size”), the colored inks of a marbling pattern tend to warp and stretch rather than diffuse and mix with each other in a turbulent manner; this behavior helps to differentiate a marbling simulation from other types of fluid simulations (e.g. smoke simulations). Also, because the underlying fluids are “incompressible”, the inks move in ways that preserve their surface area.
To start I read up on work by Aubrey Jaffer, including the paper Mathematical Marbling (Lu, Jaffer et al. 2012). The main idea behind Mathematical Marbling is that the combing actions in paper marbling can be modeled by closed-form mathematical transformations; in other words, they argue that you don’t actually need to run a full-blown fluid solver to accurately simulate a marbled pattern. They show some nice results in their paper, which they’re able to compute extremely quickly because their method is direct rather than iterative.
After implementing Mathematical Marbling in WebGL, I decided to go with a hybrid approach that uses some of the Mathematical Marbling transformations, but ultimately lets a fluid solver kick in to create more dynamic and life-like results. This allowed me to experiment with freeform patterns that were made using a combination of combing and curl-noise (Bridson et al. 2007), giving the appearance of turbulent air blowing across the surface of the pattern:
I like the playfulness that interacting directly with the underlying physics simulation allows. It’s fun to watch patterns warp and stretch as the dynamics of the fluid take over:
Pattern Exploration
Even though marbling techniques have been around for centuries, there is still plenty to explore when it comes to pattern generation. I’ve really only just started to scratch the surface here. My marbling simulation allows me to line up combs very precisely and apply multiple combs at once, so it’s possible to experiment with patterns that would be impractical to recreate in real life. Several of the combing patterns we used for the infinity puzzles are brand new (as far as I know) variations on traditional marbling techniques, such as bouquet, birdwing, and thistle. The pattern I’m most excited about at the moment is a “two-way” variation on the popular bouquet pattern:
Similarly, the two-way birdwing pattern contains scalloped edges in both directions. The version below contains additional vertical combing to sharpen the peaks of the larger-scale features in the design:
The dovetail pattern is a simple variation on bouquet that uses vertical combs to enhance alternating features of the pattern. The resulting shape reminds me of Islamic architecture:
A unique property of digital marbling that we leveraged in the design of the infinity puzzles is the ability to create patterns that tile perfectly in space. The resulting puzzles have no edges, and the pieces fit together in a multitude of configurations. It would be interesting to merge marbling with other ideas around tilings (e.g. Truchet tilings, hyperbolic tilings) to generate novel combing patterns as well.
Ink Drop Simulation
I also explored the behavior of individual drops of ink. Jaffer has an excellent page detailing the math behind dropping paint/ink on the surface of water, and the resulting transformation that a single drop has on the rest of a marbled pattern. Again, the trick here is that each ink drop should induce an area-preserving transformation on the surrounding regions. So if many drops are used to create a ringed pattern, the rings will slowly increase in radius and decrease in thickness as they move outward. I used this technique as the basis for a suminagashi simulation:
By dropping multiple drops at once, you can simulate a “stone” pattern, which are typically used as a starting point for combed patterns. You’ll notice that the following simulation violates incompressibility a bit, as there are regions between the drops that appear to shrink. Jaffer’s area-preserving technique works great in an infinite domain where the inks can simply flow off the edge of the screen, but the simulation below is meant to tile in space, so I had to come up with some way to loop the simulation in x and y while still preserving the correct local behavior of the drops. Due to the area expansion occurring at each drop’s center, there has to be contraction elsewhere in the pattern:
This contraction behavior is actually somewhat realistic. In a finite-sized tray you will eventually notice ink patterns begin to shrink and become more saturated as additional drops of ink are added. You’ll also notice that the more ink drops you add, the more slowly each new drop will expand across the surface of the water. It seems that the thickness of the ink layer on top of the water increases with each extra drop of ink added, which causes the entire pattern to gradually contract. This change in thickness is not explicitly modeled in my or Jaffer’s methods, but can easily be added by scaling the effect of the ink drops.
Challenges
One of the trickiest technical aspects of creating this marbling simulation was preserving crisp boundaries between colors in the combed pattern—an important feature of paper marbling. I had been using the Stable Fluids (Stam, 1999) method, which tends to create excessive blurring the longer the simulation runs, so I wrote a new fluid solver based on BiMocq2: Efficient and Conservative Fluids Using Bidirectional Mapping (Qu et al. 2019), which uses some tricks to significantly reduce this blurring with surprisingly little computational overhead.
The simulation above shows a comparison of Stable Fluids (left) and BiMocq2 (right) solving a system exhibiting Rayleigh–Taylor instability, both implemented in WebGL using the same time step, grid resolution, and initial conditions. The difference between the methods is staggering. Not only does BiMocq2 preserve cleaner boundaries between the white and black fluids, but it also reduces damping and preserves details in the underlying velocity field, which is evident by numerous fractal-like vortices that emerge in the flow. These velocity field details are not so important in the context of traditional marbling, where we’re generally concerned with laminar flows of more viscous fluids, but could be interesting to explore in future work.
Future Work
Looking forward, I’m interested in how digital marbling could unlock new aesthetics that make use of turbulent and ephemeral behaviors of fluids, which would normally be very difficult to transfer to paper:
Throughout the development process, it’s been interesting to explore how random bugs in the code change the behavior of the system in unexpected ways:
I loved the way this unintended sloshing motion generated surprising shapes:
The current iteration of the marbling simulation app is still a bit too much of a hacky research prototype to be released publicly, but I’m hoping to find some time to wrap up this work and release something in the near-ish future. Mainly, I want to add some optimizations to the simulator to create better real-time performance for larger patterns (the app crashed my computer on several occasions!). Though the current prototype has some “undo” capabilities, it would be extremely helpful to also be able to edit previous combing operations while viewing their effect on the final marbled pattern—this would allow you to more easily control the amount of color mixing in the final design.
In the process I also created a simple file format for importing marbling combing patterns into my app; this allowed for easier interop with other programs I was using. It might also be interesting to generate velocity fields to apply directly to the fluid simulation; there is no reason you have to stick with combs when you’re working digitally.
This vector format uses stroke-width to roughly map to the diameter of the comb’s teeth (also known as “tines”). Taken to the extreme, you can create patterns using combs with lots of tiny tines, which essentially behave like bristles on a brush:
Further Reading
-
The Art of Fluid Animation (2004) by Jos Stam – An introduction to the concepts behind fluid animation, building up to an implementation of the Stable Fluids paper.
-
Fluid Simulation (with WebGL demo) by Jamie Wong – The most accessible explanation of the Stable Fluids method that I’ve found. Includes many interactive widgets to help you understand each component of the method.
-
pst-marble by Aubrey Jaffer, Jürgen Gilg, and Manuel Luque – I have not had a chance to try this, but it appears to be a library for creating marbling patterns in Latex, based on Mathematical Marbling.
-
Marbling Infinity Puzzles blog post by Nervous System – Additional information about the design of the Marbling Infinity Puzzles.
-
gpu-io – A WebGL GPU computing library for running physics simulations that I’ve just recently released (soon to be announced). I’ve been building all of my digital marbling simulations (and many other things) on top of this library.
-
Marbled Paper App by Jonas Luebbers – A WebGL implementation of Mathematical Marbling.