TITLE
Where the Primes Fall

PROMPT
An interactive data visualization of prime numbers, all computed in the page with a sieve: the integers 1…N laid out in several arrangements that reveal hidden structure, with animated morphs between them. Concept: the same dots, re-arranged, suddenly line up into diagonals and curves; the wow is the morph.

Mood: austere Swiss-poster mathematics; exact, black and white with one hot accent. Palette: paper white #FAFAF7, ink #111111, single accent red-orange #FF3B00 (used for highlighted primes, the cursor ring, twin-prime links and one headline word), light rule grey #D8D8D2. Light page.

Layout: a large square canvas (the field) with an asymmetric Swiss grid around it: a narrow left column carrying an enormous rotated, stacked headline in a tight grotesk (Helvetica/Arial bold, lowercase: "where the primes fall", with "primes" in the accent), and a slim control rail and readout in small monospace. On phones the headline lies flat above a full-width canvas with the controls in a compact strip beneath. Strict baseline rhythm, thin rules, numerals in tabular mono.

Arrangements (all for the same N, default 40,000 on desktop, 16,000 on phones, adjustable from 1,000 up to 250,000 with a custom slider): 1) "Line": numbers wrapped in rows of a chosen width like text (an adjustable wrap width, with presets 6, 30, 210 and √N, shows stripes appearing at multiples of 6, 30 …). 2) "Ulam": the square spiral, where primes cluster on diagonals. 3) "Sacks": the Archimedean spiral with squares on the east axis (r = √n, θ = 2π√n), where primes form sweeping curves. 4) "Polar": the point (n, n) in polar coordinates, i.e. radius n and angle n radians, which yields galaxy-like arms at different zoom levels. Each number is a small square: primes in ink, composites invisible by default or faint grey by toggle. Zoomed in far enough, every square carries its number.

Signature moment: switching arrangement animates every point along its own eased path (staggered by n so the morph unspools from the centre outward, about 1.8s, cubic-bezier(.65,0,.2,1)); between the two spirals the points travel in polar coordinates, so the square spiral visibly coils into the Sacks spiral and the diagonals bend into curves. On load, the page plays the opening itself: a single ink line of all the numbers draws across the field, wraps into a solid black Ulam square, and a red front then sieves outward from the centre, dropping the composites and leaving only the primes in ink.

Interaction: hover/touch a point to read it: a crisp tooltip in mono gives n, whether prime (and its rank, and its twin if it has one), its factorisation if composite, its gap to the next prime, and if it sits on a famous prime-rich polynomial (Euler's k² + k + 41 and k² + k + 17, Legendre's 2k² + 29); the accent highlights the structure through that point: in Ulam the richer of its two diagonals with the quadratic 4t² + bt + c it follows, in Sacks the curve k² + k + c, in Line its column (a residue class mod w), in Polar its arm or ray (mod 44 or mod 710), each with a count of how many of its numbers are prime. Scroll-wheel/pinch zooms and drag pans the canvas (contained, so the page itself does not get trapped: zoom only when the pointer is over the canvas, no modifier needed, and at full view wheeling outward scrolls the page on; + / − / fit buttons too). Arrow keys on the focused canvas step through the numbers and primes; keys 1–4 switch arrangement. Toggles: twin primes linked in red; colour by last digit; Euler's k² + k + 41 polynomial stitched as a red thread through the spiral; composites in grey. A live readout shows the count of primes ≤ N and N / ln N beside it, with the ratio, the number of twin pairs and the widest gap, plus a small bar chart of gaps between neighbouring primes, all updating as N changes.

Copy: three short, precise paragraphs in small type explaining what one is seeing (Ulam doodled the spiral during a dull talk in 1963; diagonals correspond to quadratic polynomials; nobody has proved why some are so rich), written plainly. Performance: draw with ImageData, typed arrays, DPR capped at 2. Reduced motion: no opening sequence, and arrangements switch with a short cross-fade.

DESCRIPTION
A white sheet set like a Swiss mathematics poster: an enormous lowercase grotesk headline runs up the left edge with one word in red-orange, a hairline-framed square field fills the height of the window, and a narrow monospace rail of rules, sliders and tabular figures sits to its right. The field holds every integer up to N as one small square. It opens by drawing all of them as a single black line, reeling that line into a solid black square spiral, and then sieving it from the centre outward behind a red front until only the primes remain, scattered along unmistakable diagonals. Choosing another arrangement sends every dot along its own path, centre first, so the square coils into the Sacks spiral, flares into the polar galaxy, or falls into rows whose columns stripe at widths like 30 and 210. Pointing at any dot produces a black label with its arithmetic and lights the diagonal, curve, column or arm it belongs to in red; zooming in far enough turns the dots into numbered tiles.

VISUAL TECHNIQUES
- Sieve of Eratosthenes with prefix tables (prime count, twin pairs, widest gap) computed once in typed arrays
- Direct pixel plotting of up to 250,000 squares into a Uint32 view of canvas ImageData, with culling and DPR capped at 2
- Per-point staggered morphing with a tabulated cubic-bezier(.65,0,.2,1) ease; unwrapped polar interpolation between the Ulam and Sacks spirals, shortest-arc polar interpolation to and from the (n, n) plot, Cartesian elsewhere
- Opening choreography: progressive line draw, wrap into the spiral, radial red sieve front with a grey trailing band
- Vector overlays on the same canvas: twin-prime links, Euler's polynomial thread with filled/hollow markers, the highlighted quadratic or residue class, a sprung cursor ring with tick marks
- Level-of-detail numerals drawn inside each square once cells are large enough
- Anchored exponential zoom smoothing so the point under the cursor stays put
- Rotated vertical headline in tight bold grotesk with clip-path wipe entrance; rules that draw in along the rail
- Custom sliders, square toggles, inverted radio rows and a live gap histogram built from plain elements
- Cross-fade via a snapshot canvas for reduced motion

INTERACTION MODEL
The four arrangement rows (or keys 1–4) morph the field between Line, Ulam, Sacks and Polar. The N slider (logarithmic, 1,000–250,000) redraws the field and updates π(N), N / ln N, their ratio, twin pairs, widest gap and the gap histogram live; the wrap-width slider and its presets (6, 30, 210, √N) re-wrap the Line arrangement. Four toggles (or keys T, D, E, C) link twin primes in red, colour primes by last digit, stitch Euler's k² + k + 41 through the field, and show composites in grey. Moving the pointer over the field (or tapping / dragging a finger) snaps a red ring to the nearest number and opens a label with its value, primality and rank, factorisation, next prime and gap, any famous polynomial it lies on, and the diagonal, curve, column or arm through it, which is drawn in red with its prime count. The wheel or a pinch zooms about the pointer, dragging pans, and the − / + / fit buttons (or − / + / 0 keys) do the same; at full view an outward wheel passes through to scroll the page. With the field focused, left/right arrows step number by number and up/down jump prime to prime. Hovering a bar of the gap histogram reads out its count.