Interactive Fluid Simulation

• P5.js

• May, 2019

This is an individual project based on P5.js. It simulates the movement of colors in water and provides an interactive model for users to experience color diffusion, where they can also create some appealing visuals. Users can change colors and adjust the viscosity of water. Along with some other choices, users can drag the mouse and explore the color mobility in water.

I was inspired by marbling, an interesting activity with colored water. I tried to create digital color diffusion through P5.js. In this project, I mainly explored the motion of water, the mixture of color, the movement of the mouse, the balance and various shapes.

Flow field is a way of looking at fluid motion that focuses on specific locations in the space through which the fluid flows as time passes. The calculation in this project borrows its conception and is pixel-based. For each pixel with value x0, there are 4 nearest pixels with values x1, x2, x3, x4 such that the final value of the pixel x = [x0 + a * (x1 + x2 + x3 + x4)] * c