Drop Experiment by Manny Tan

Driven by the idea of a droplet of water following a line, Manny Tan created this Three.Js experiment that explores a droplet shape and it’s associated views in 3d space. The web application allows you to click and drag to rotate the shape. Alternatively, you can use the scroll wheel or right click and drag to move the shape to a particular view.

The experiment includes a series of points that orbit around a center point. It began with creating the center line that uses perlin noise to create and update the shape of the line. This is followed by droplets which move along the string with dividing it into 2 parts – first part uses math to create and parse data in real time and second that draws different shapes based off of that data. Although at first Manny envisioned a toggle allowing you to switch from one view to another but after checking through some of the Three.js examples (specifically the multiple canvases example), he thought it was much more interesting to show all views at the same time side by side.

The step by step development and final versions are available here. The full explanation of the process including different stages are at the link below.

Project Page | Manny Tan