Serial Permutation Canvas

Total serialism is the systematic application of serial technique to all musical parameters: pitch, duration, dynamics, timbre. The technique is most commonly associated with Pierre Boulez and the post-Webern serialists. The core idea is that a series (a permutation of the 12 chromatic pitches) is not just a melody. It is a structure that can be transformed in four ways: prime, retrograde, inversion, and retrograde inversion.

This demo visualizes those transformations as particle geometry.

The live artifact: Open Serial Permutation Canvas

The Series

The demo generates a random 12-tone series: a permutation of the numbers 0-11. Each number is mapped to a pitch class, but the pitch is not audible. It is visible. Each number is mapped to a color (hue), a position (angle on a circle), and a particle size.

The Permutations

The demo implements all six permutation types:

• Prime: the original series
• Retrograde: the series reversed
• Inversion: each interval is inverted (if the original goes up a major third, the inversion goes down a major third)
• Retrograde Inversion: reversed and inverted
• Rotation: the series is rotated, so each element becomes the first element in turn
• Random: a new random permutation

The Visual Mapping

Each element of the series is a particle. The particle's position is determined by its value in the current permutation. The value maps to an angle on a circle. The particle moves toward that angle, with a spring force that pulls it back if disturbed.

The mouse attracts particles. Moving the cursor pulls nearby particles toward it, distorting the circular arrangement. The particles return to their positions when the mouse moves away.

The trail: each particle leaves a trail of its recent positions. The trail color is the particle's hue. The trail length is adjustable. Long trails create a web of lines. Short trails create a constellation of dots.

The Ring

The 12 values are displayed as a ring of circles at the center of the canvas. Each circle shows its current value. Lines connect adjacent values in the series. The ring updates in real-time when the permutation changes.

The Design Decision

The visual mapping is arbitrary but consistent. The value maps to angle, hue, and size. The angle is the most important mapping: it makes the series visible as a circular arrangement. The hue is secondary: it makes each value distinguishable. The size is tertiary: it adds a subtle variation.

The consistency is what matters. If the value 0 is always at angle 0, hue 0, and size 3, then the audience learns the mapping. The permutation becomes visible as a rearrangement of known elements.

What It Teaches

The lesson is about making abstract structure visible. A 12-tone series is an abstract mathematical object. The permutation transformations are abstract operations. The demo makes them concrete by mapping them to space and color. The audience can see the inversion. They can see the retrograde. The abstract becomes sensory.

This is the bridge between algorithmic art and music theory: take a formal structure, map it to visual parameters, and let the audience explore. The structure is no longer theoretical. It is visible.