https://scottandrecampbell.com/static/foams/index.html

Modeling things with physical properties is challenging. Being computationally expensive (many calculations to run for each moment in time), there are hard limits to what can safely be modeled in a browser environment. This example has 1331 points which are shown as icosahedrons. The main behavior I’m modeling here is cohesion; adjacent points tend to clump together and form semi-solids. They’re bound to a physical boundary (cube) and gravity is an option. You can interact with your mouse/pointer. While this works fine on mobile, the interactivity is more fun on desktop.

There were many iterations of this project. This version, while simple, captures the behavior I’m looking for in a minimalist way.

I’d like to give a big shout-out to Matthias Müller @TenMinutePhysics. Much of the physics modeling in this project was informed by his work and code. My biggest takeaway from his work was some pretty solid code for spatial hashing; a concept I’d been looking for. Instead of algorithms that compare each point to every other point, we use a table to store positions (like making a matrix of cells that do/don’t contain points) and derive point adjacencies from that.