Visualizations
463 / 500

463 · Math

Change Ringing

Eight bells ring Cambridge and Grandsire: walks through the symmetric group.

In English change ringing each row is an ordering of the bells, only bells in adjacent places may swap between rows, and no row may be rung twice. Methods are written in place notation and generated change by change (Plain Bob, Grandsire, Double Norwich, Cambridge and Bristol, on four to eight bells), with bobs and singles altering the lead ends; the Minimus and Doubles touches ring every ordering of their bells. The tower cutaway is timed like real ringing, with a gap before each handstroke, and each bell swings mouth-up to mouth-up between its own strikes, its rope wrapping the wheel and its sally rising and falling for the ringer below. Beside it the blue line traces the treble and the 2, and the Cayley panel draws the touch as a walk on the permutohedron: the full truncated octahedron for four bells, the 120-vertex polytope for five, and for seven and eight bells a rosette, because each lead is the previous one relabeled by the lead head's cycle. Every strike is a synthesized bell with hum, prime, tierce, quint and nominal partials.

Try it. Pick a method from the list (or keys 1 to 8). Call a bob or a single (B or S, or the buttons) and it takes effect at the next lead end; the faint rows and route ahead update, and the touch is checked for truth as it is rung. N moves on to the next method, T changes the speed, drag the graph to turn it, M mutes; sound starts on the first click.

  • Place notation
  • Permutation groups
  • Cayley graph projection
  • Timed animation
  • Additive bell synthesis

View the source · one module, plus a small shared runtime for sizing, the animation loop and input

Build your own

Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.

Build an animated change-ringing simulator with JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.

Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens (scale by devicePixelRatio), and resizes with the window.
- A row is an ordering of bells 1 to n. Write a place notation parser: "x" swaps every adjacent pair, and a token like "14" means the bells in 1st and 4th place stay put while every other adjacent pair swaps. A comma marks a symmetric method: the part before it, then that part mirrored, then the lead end.
- Generate Plain Bob Minimus ("x14x14,12") from rounds (1234) and check that it rings all 24 orderings once before returning to rounds.
- Ring it: strike one bell every 0.2 seconds, row after row, with a one-blow pause before every other row (the handstroke gap). Play each strike with Web Audio as a few decaying sine partials (ratios around 0.5, 1, 1.2, 1.5 and 2 of the bell's note), started on the first click.
- Draw the rows as a scrolling column of numbers, with the treble's path as a red line and the 2's path as a blue line.

Once that works, make it a tower:
- Draw the bells in profile, each turning about its axle. Between two of its strikes a bell swings from mouth-up on one side to mouth-up on the other, easing near the balance, so a bell that moves later in the next row visibly swings slower.
- Add Plain Bob Major ("x18x18x18x18,12") and a Bob button that changes the lead end to "14" at the next lead end, and warn if any row repeats.

Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as Cambridge Surprise Major, drawing the touch as a path on the permutohedron of four bells, or ringers whose ropes rise and fall with the swing.
PreviousGravity TurnA two-stage rocket flies pad to orbit on a live blueprint, max-Q and all. NextAfterimageStare at a surreal landscape, then see full color in a picture that is pure gray.

Related visualizations

  • Euclidean RhythmsSound Risograph bead rings play world rhythms made by a neutron accelerator timing algorithm.
  • Shepard StaircaseIllusions A procession climbs Penrose's impossible stairs while a Shepard tone rises forever.
  • Music BoxSound A pinned brass drum plucks cantilever tines from a punched strip you can edit.
  • Difference EngineRetro Brass figure wheels tabulate a polynomial with nothing but addition and rippling carries.
  • RingmakerAstronomy Backlit planetary rings with shepherd moons, wavy gap edges, propellers and waves.
  • Marimba Bar TunerPhysics Carve a rosewood bar while a finite element solver retunes its overtones to 1:4:10.
  • Chord OrbifoldMath Tymoczko's geometry of chords: a twisted prism and a Mobius strip you can hear.
  • Catalan BijectionsMath One Catalan object drawn five ways at once, linked piece by piece as it morphs.
  • Siteswap JugglerMath Juggling notation made physical: true parabolas, a ladder diagram and the state graph.

Use ← and → to move between demos. While the canvas has focus, keys go to the demo instead.

← More from Emergent Mind Labs