← All work

Soft Magnet

A particle sphere that turns on its own and gathers toward the cursor.

Soft Magnet is an interactive particle system written for the browser in plain HTML and JavaScript, drawn on a single canvas without any libraries. Sixteen hundred points form two nested spheres: a dense core of six hundred and a looser halo of a thousand around it. Every point is projected through a simple perspective camera, so those nearer the viewer grow larger and darker while the far side of the form recedes into a pale haze, and the whole figure turns about its vertical axis, the core orbiting half again as fast as the halo.

The cursor acts as a soft magnet. Points within its reach are drawn gently toward it, then pulled back to their orbits by a spring and slowed by damping, so a pass of the mouse leaves a brief wake that closes as the sphere settles. The behavior rests on a handful of constants for attraction, return force, friction and orbit speed, balanced over a week so that the sphere answers the hand without losing its calm, continuous rotation.