Draw My Canvas / studio

Kuramoto Sync

Three hundred lights, each blinking at its own rate, each wired only to the four beside it. Nothing tells them to agree — one sine term is enough.

Plate 21coupled-oscillators

Waiting for the animation above to load…

What lands in the file, and what the width does

One click writes whatever the animation is drawing at that moment to a PNG, with the drawmycanvas.com mark drawn into the picture rather than laid over it. Leave the width box empty and you get the stage exactly as your browser rasterised it — your window’s width times its device pixel ratio, which is about 1,600 px across from a 1280‑px window on a HiDPI laptop and about 353 px from a 390‑px phone.

Type a width instead, or take a preset, and the frame is redrawn into a canvas that wide: the height follows the stage’s own shape and the mark scales with it. The stage is 16:9 on a wide window and 4:3 below 560 px, so a width of 1200 saves 1200×675 on a laptop and 1200×900 on a phone. 1200 px is the width Open Graph and X link cards are cut from — the canonical card is 1200×630, and a card crops the extra height rather than letterboxing it.

Honest limits. Asking for more pixels than the stage was drawn at resamples pixels that were never drawn: a 1920‑px file exported from a 353‑px phone stage is bigger, not sharper. A very large width is a real memory allocation and a browser is allowed to refuse it; when that happens the line above says so plainly and nothing else on the page changes. PNG only — no JPEG, no WebP, no animated export. And nothing is uploaded: the picture is assembled in your own browser, so no frame of this plate ever reaches us.

Live on an HTML canvas · vanilla JavaScript · no dependencies Open fullscreen

About this piece

Every light on this frame is an independent oscillator. It carries a phase — where it is in its own blink — and a natural frequency, the rate it would blink at if nothing were pulling on it. Those rates are not equal. They are drawn from a band 36% wide, so the fastest light on the plate completes a blink in 1.40 seconds and the slowest takes 2.97, with the middle of the field at 1.90. Left alone, that is all you would ever see: three hundred lights blinking past one another, never twice in the same arrangement.

Each light is wired to the four lights it touches and to nothing else. It cannot see the frame, it has no idea what the field as a whole is doing, and there is no clock anywhere in the piece. What it does have is one term added to its own rate: for each neighbour, the sine of the difference between that neighbour’s phase and its own. A neighbour a little ahead contributes a positive number and tugs the light forward. One a little behind contributes a negative number and holds it back. When they agree the term is zero and the light is left alone.

That is the whole mechanism, and everything on the plate falls out of it. Turn the strength of that tug up and the lights stop arguing and start agreeing — not all at once, but outward from wherever agreement got started, as a wave crossing the frame. Turn it down and the frequency spread wins again and the field comes apart into twinkle. The strength is the only thing this animation changes over time; the lights are never told what to do.

At the size this page draws it — a stage about 908×511 — the lattice is 24 × 13, so 312 lights, each nudged up to a quarter of a cell off its row so the field reads as scattered rather than ruled. A gallery thumbnail runs 126 of them and a phone in portrait runs 300.

One sine term, and why it is enough

The rule each light follows is one line of arithmetic:

i/dt = ωi + (K / ni) ∑j sin(θj − θi)

θi is the light’s phase, ωi its own natural frequency, the sum runs over its ni neighbours, and K is how hard they pull. This is Yoshiki Kuramoto’s 1975 model, which he wrote down and solved for the case where every oscillator is coupled to every other one. This plate runs it on a grid instead, so the coupling is local, and that single change is what turns a statistical result into a picture: with all-to-all coupling the field locks as one lump and there is nothing to watch, while with four neighbours the agreement has to travel.

The sine is doing more work than it looks. It is odd, so the pull between two lights is equal and opposite; it is periodic, so a light one full cycle ahead counts as agreeing; and it is bounded, so no single wildly-fast neighbour can drag a light arbitrarily hard. Replace it with the raw phase difference and the model stops being Kuramoto’s and starts being diffusion, which locks everything to the average and produces a uniform blink with no wave in it at all.

There is a real number for where the field gives in. For an all-to-all population whose frequencies are spread uniformly over a band of half-width γ, mean-field theory puts the critical coupling at Kc = 4γ ÷ π, which for this plate’s γ = 0.36 is 0.46. Measuring the actual lattice — average cos(θi − θj) over every neighbouring pair, run to steady state at a fixed K — gives 0.12 at K = 0.1, 0.35 at 0.3, 0.54 at 0.5, 0.88 at 1.0 and 0.92 at 1.5. It crosses one half at about 0.46, which is a nicer agreement than this plate deserves: mean-field theory assumes all-to-all coupling and infinitely many oscillators, and on a finite two-dimensional lattice there is no sharp transition at all. The curve above is smooth. Kc is a landmark here, not a threshold you can point at.

Where this actually happens

Synchrony of this kind is not a metaphor borrowed for an artwork; it is one of the more stubbornly recurring behaviours in nature, and the model was built to explain real observations.

The famous case is fireflies. Several southeast-Asian Pteroptyx species gather in riverside trees by the thousand and, over some minutes, flash in unison — described by European travellers for centuries and long dismissed as an artefact of the observer’s blinking, until it was filmed. A firefly is a relaxation oscillator that shifts its own timing when it sees a neighbour flash: exactly the ingredient above. Note what the tree does not do — there is no leader and no signal broadcast to the swarm.

The most expensive case is a bridge. London’s Millennium Bridge opened on 10 June 2000, carried about two thousand people, and began to sway sideways badly enough to be closed two days later. The cause was not wind or resonance with a marching step: a slight lateral wobble makes walkers adjust their gait to keep balance, adjusted gaits push in step with the wobble, and the crowd and the deck lock together. It was later analysed with essentially the equation above, with pedestrians as the oscillators.

And the case you are running right now: the roughly twenty thousand neurons of the suprachiasmatic nucleus, the body’s circadian pacemaker, are individually sloppy oscillators with periods scattered around a day, and they keep time as a population by coupling to one another. Arrays of Josephson junctions phase-lock the same way, as do the alternators on a power grid — where losing the lock is what a blackout is.

Reading the plate: what to watch for

The coupling is swept by a single cosine from 0.05, well below anything that can hold the field together, to 1.5, well above it, and back — once every 2,400 frames, forty seconds at sixty frames a second. Three things follow from that, and they are worth picking out separately.

  • The field falling into step. Coming off the loose end of the sweep the neighbour agreement measures about 0.04 — statistically indistinguishable from unrelated lights. Roughly twenty seconds later it is 0.94. Nothing is faded, nothing is scripted: that is the same equation at two coupling strengths.
  • The wave, not the unison. At the tight end of the sweep the neighbour agreement is 0.92–0.94, but the global order parameter — how aligned the whole frame is, taken as one average — only reaches about 0.5. Those two numbers together describe a field that is locked locally with a phase gradient running across it, which is exactly what a travelling wave is. The bright band that sweeps the frame is not an object moving; it is the place where the lights currently happen to be at the top of their blink.
  • The pacemakers. The lights that lead are the fastest ones, and they are marked: coral is the top quarter of the frequency band, 79 of the 312 on this stage. Waves tend to start where several coral lights sit close together, because a cluster of fast oscillators outvotes its slower neighbourhood and the rest of the field entrains to them rather than to the average.

One more thing, once the field is tight: the whole frame dims and brightens together, roughly every two seconds. That is the point of the piece rather than a fault, and it is why no light is ever allowed to go out — the dimmest a light gets is 38% of its bright radius at 18% alpha, so the frame at the bottom of a unison blink is an even stipple of embers, not an empty rectangle.

If plate 04, Spiral Waves, looks like a relative, the difference is worth being exact about: there the arms are drawn, as logarithmic spirals evaluated and stroked. Here nothing draws a wave. Every light is solving its own one-line equation with no knowledge of any other light but its four neighbours, and the wave is an accounting fact about where agreement has got to. Plate 17, Turing Bloom, is the closer cousin — also a lattice, also local rules — but its cells exchange substance that spreads and is consumed, while these exchange nothing at all except timing.

Colour, and how the picture is put together

Two inks, both read from this site’s shared palette rather than invented here, so the plate follows the light/dark setting of whatever page it is sitting on. Three lights in four are cobalt and one in four is coral — the same 3 : 1 weighting the rest of the gallery uses — but which lights are coral is not a decoration. It is the top quarter of the frequency band, read off the same draw that sets each light’s rate. The coral marks the fast ones, which is the one piece of hidden state in the model worth exposing.

A light’s radius and its opacity both ride the same brightness curve, so a light near the top of its blink is bigger and hotter than one near the bottom. That curve is (1 + cos θ) ÷ 2 raised to the power 1.9; the exponent shortens the bright part of the cycle and lengthens the dim part, which is the difference between a light that blinks and one that merely breathes.

The lattice spacing does not scale in strict proportion to the frame. In proportion, the 38 pixels between lights at this page’s stage size would be 16 pixels on a gallery thumbnail — lights closer together than their own bright radius, which is a smear rather than a field — and 80 pixels on a 1080-tall screen, a sparse scatter of eleven rows. It follows a square root with a floor and a ceiling instead, holding the spacing between 22 and 56 pixels at every size the plate is ever drawn at. The honest cost is that the thumbnail is not a miniature of this view: it runs 126 lights against 312, and a smaller lattice locks more uniformly, so the thumbnail shows less of the travelling-wave structure than the stage does.

The grid does not wrap, and that is deliberate. On a torus every site has the same neighbourhood, waves have no edge to break on, and the field locks blandly. With real edges the corner lights are the least-coupled sites on the plate — two neighbours instead of four — so the corners hold out longest and are usually the last places to come into step.

Honest limits

Several, and none of them are hidden.

It never reaches true unison, and it is not trying to. Local coupling on a finite grid tops out around a global order parameter of 0.5. If you want every light in the frame at the top of its blink on the same instant, you want all-to-all coupling — and you get a metronome instead of a wave. That is a different and much duller plate.

The scatter is jitter on a grid, not random points. Each light sits up to a quarter of a cell off its lattice position, which breaks the rows convincingly, but the spacing is still far more even than a genuinely random scatter would be. That is a choice in favour of the physics: on a real Poisson scatter, neighbourhood sizes vary wildly and the wave speed varies with them, which reads as noise rather than as structure.

The integration is explicit Euler. The step is at most 0.09 radians, two orders of magnitude inside where that method gets into trouble, so it is a safe choice and not a hidden approximation — but it is a first-order one, and this plate should not be read as a numerically careful simulation of anything you intend to publish.

A different frame size is a different picture. The lattice is sized from the frame, so the stage, the thumbnail and a phone are running lattices of 312, 126 and 300 lights respectively, with different neighbourhoods and different pacemakers. Each is deterministic and repeatable, but they are not the same run at three magnifications.

The gap between fastest and slowest is deliberately narrow. A 36% spread is wide enough that the loose end of the sweep genuinely scatters and narrow enough that the tight end genuinely locks. Widen it much and the plate never comes together at any coupling this side of a blur; narrow it and it never comes apart, and the first twenty seconds are the only interesting ones.

Finally, motion. Under prefers-reduced-motion nothing animates: the field is warmed to its opening frame and drawn once as a still. It is a slow piece even when it runs — a full breath is forty seconds — so clicking the animation pushes the coupling a quarter of a sweep on, about ten seconds’ worth, without disturbing the phases the lights have already reached.

Curious how the loop and canvas fit together? Read how it works →

More from the gallery

All 22 animations in the gallery →