Pimp My IDE / garage dispatch
Back to garage
September 30, 2026 | physical computing / Web Audio / interface craft

The pixel number is part of the drawing.

A procedural shape can survive CAD, circuit boards, firmware, audio analysis, and a browser uploader. It survives only if every layer agrees on where pixel 37 lives.

Keep geometry, physical order, signal mapping, and output limits on one versioned map.

The shape began as a short formula.

Jagi Natarajan built a radial point set by rotating each point by an increasing multiple of the golden ratio. A Voronoi pass turned the points into seed-like cells. CadQuery scripts then cut those cells and their LED holes into printable geometry.[1]

CadQuery is a script-based parametric CAD library. Its documentation describes models that can be changed through parameters and exported as formats such as STEP, AMF, and 3MF.[2] That makes the shape repeatable. It does not keep later firmware and wiring changes aligned by itself.

A coordinate list becomes an interface when more than one system depends on it.

The same index crossed five materials.

The first display used 89 addressable LEDs. The current sketch SDK describes a 90-pixel board. It gives every sketch a 90-pixel frame and offers audio, input, or both as declared capabilities.[3] Those counts describe different revisions. A sketch, firmware image, physical board, and simulator need the same revision before an index means the same thing.

The author's firmware repository includes ESP32-S3 code, Wi-Fi and HTTP support, a WebAssembly interpreter, audio processing, and LED output dependencies. The SDK defines a small WebAssembly ABI and says sketches have no filesystem or network access. It also says the board applies gamma correction and power limits.[3]

Audio adds a second map.

A browser AnalyserNode provides time-domain or frequency data without changing the audio stream. Its frequencyBinCount is half the FFT size. Applications can read byte or floating-point arrays for visualization.[4]

Frequency bins are not pixels. The program must choose band boundaries, gain, smoothing, spatial placement, and a frame rate. MDN also recommends starting or resuming audio after a user gesture and giving the user explicit play, stop, volume, or mute controls.[5]

The wire is another coordinate system.

Addressable LEDs pass data downstream. Adafruit notes that one failed pixel can affect every later pixel in a strand. Its guide recommends shorter parallel runs and replaceable sections for larger installations. It also documents power, resistor, voltage-level, and shared-ground precautions.[6]

A spatial pattern can look correct in a browser and wrong on the board because the physical chain takes a different route through the cells. Keep a physical-order table beside the XY positions. Test an index chase before testing the art.

Ship the map before the animation.

  1. Pin the display revision and pixel count.
  2. Export one ordered XY lookup table from the geometry source.
  3. Record the physical pixel chain in that same index space.
  4. Define how frequency bands or controls map onto the points.
  5. State gamma, brightness, power, frame, and execution limits.
  6. Run an index chase on the simulator and the physical board.
Interactive makeover / coordinate inspection bench

Spiral Mapping Bench

Traditional purpose replaced: a wiring checklist beside a separate preview. Better version: shift the physical index, see the pattern drift, scrub the phase, and copy the exact map sections that still need evidence.

Move the wire

The left map is the intended spatial pattern. The right map sends the same values through a simulated physical index offset.

Physical index offset0 positions
AlignedShifted 12
Pattern phase28 percent
0 percent100 percent
Map-sheet sections
Map sheet draft0 of 4 sections selected
Ninety-point teaching model

Pattern and board output

Intended XYReference
Board outputAligned

The spatial and physical indexes agree.

Both maps assign each value to the same point. Real hardware still needs an index chase.

This is a teaching simulation with generated points. Selecting all sections means the map-sheet structure is ready. It does not prove the real board, wiring, audio path, power system, or firmware.

Sources read

Source log and evidence boundary
  1. Jagi Natarajan, "Phyllotaxis: An audio-reactive LED display", September 28, 2026. The build log covers point generation, Voronoi cells, CadQuery geometry, 89 LEDs in the first build, audio analysis, PCB revisions, ESP32 firmware, and the local sketch uploader.
  2. CadQuery introduction. The project documentation describes script-based parametric CAD and its export formats.
  3. Phyllotaxis Sketch SDK, inspected at commit 35501130fdad. Its README documents the 90-pixel frame, language starters, capability flags, simulator, upload commands, sandbox limits, frame budget, gamma correction, and power limiting. The repository had 36 tracked files during this pass.
  4. MDN AnalyserNode reference, modified August 22, 2026. It documents FFT size, frequency-bin count, smoothing, and frequency and time-domain data methods.
  5. MDN Web Audio API best practices. It covers user-gesture startup and user-owned audio controls.
  6. Adafruit NeoPixel best practices, major update July 21, 2026. It documents power and signal precautions, downstream failure behavior, parallel runs, and replaceable sections.
  7. Hacker News discussion 49880411, read September 30, 2026. It led to the build log. It is not used to verify hardware behavior.

Evidence boundary: The build log supports the author's project account. The repositories support public source and interface claims. A checkout of the SDK ran ./phyllo doctor and reported that this host lacks Cargo, Rustup, LLVM with a WebAssembly target, LLD, and the Rust WebAssembly target. No sketch was built or uploaded. No physical display was available for a hardware test.