← Selected work

Creative coding / 2025

Interval instrument

An adjustable drawing instrument made from one repeated rule.

The question

Interval is a browser drawing study about the space between repeated lines. The starting point was a printed sheet of parallel marks. Rotating another sheet above it produced an interference pattern that was more interesting than either sheet alone. I wanted to reproduce the relationship without turning the page into a decorative animation that nobody could control. The result is a small instrument with named inputs and an exportable output.

The decision

The controls describe quantities that actually change the drawing: line count, rotation and ink. There is no fictitious playback timeline and no randomness disguised as precision. A person can return to a configuration and receive the same geometry. The lab page includes a live version of the instrument. It is deliberately still until someone changes a control, which makes its behavior easier to inspect and removes unnecessary movement for readers who are sensitive to animation.

The implementation

The preview is drawn on a native canvas with a square logical coordinate system. Its CSS size adapts to the available width, while the backing store follows the display pixel ratio. Export uses a separate fixed-size surface, so the saved image does not depend on the width of the browser window. The same rendering function draws both surfaces. Input values are validated and constrained before they reach the drawing loop.

What changed

The most useful refinement was separating the instrument from its surrounding portfolio. A visitor can understand the project without interacting, and someone who does interact gets a complete small tool. The export contains only the drawing, with no interface labels or hidden branding. I chose not to persist the settings automatically: the reset control is predictable and the page begins with a considered composition every time. This study demonstrates an implementation approach rather than claiming a production client outcome.

Try the drawing instrument ↗