How this site
was made.

A living instrument, not a brochure

The brief: a deep-space sky-survey institute whose website behaves like one of its own instruments. So the hero is a real-time simulation, the numbers tick like a control room, and the chrome (hairline rules, tick marks, coordinates pinned in the corners) borrows from telescope engineering drawings. Two colors only: cyan #7be8ff for starlight and instrumentation, solar orange #ff9a3c for the institute's namesake. Type is Space Grotesk for prose and Space Mono for every number, served from fonts.bunny.net.

What is actually running

• 100 000-point particle galaxy: a three.js (v0.160, ES modules off jsdelivr) BufferGeometry rendered as Points with a custom GLSL shader: 3-arm logarithmic spiral distribution, per-point size attenuation, additive blending, and a soft-disc fragment falloff.
• Curl-noise drift: a simplex-noise field sampled six times per vertex builds a divergence-free curl vector, so the galaxy breathes instead of jittering. Differential rotation (inner stars orbit faster) runs on top.
• Gravity well: the pointer is raycast onto the galactic plane; a Gaussian force with a tangential swirl term pulls and brightens nearby stars.
• Scroll parallax: two background star layers translate at different rates while the camera dollies back, all driven by window.scrollY.
• Constellation navigation: inline SVG lines with measured stroke-dasharray lengths animate stroke-dashoffset to draw themselves; each star is an anchor into the page.
• Fake telemetry: plain JS intervals random-walk photon rates, seeing, RA pointing, and alert counts inside believable physical bounds. The moon illumination is genuinely computed from the synodic month. Everything respects prefers-reduced-motion by freezing to a single honest frame.

Three passes, screenshot-verified

The site was built in a loop: write, serve locally, screenshot at desktop and 390 px mobile widths with a headless browser, read the images, self-critique, fix. Three full passes ran before deploy.

PASS 1 · STRUCTURE

All sections written with real copy, galaxy shader running, console clean. Critique: the live-alert ticker was an empty box, and reveal animations exposed a glowing gap behind the mission cards.

PASS 2 · HIERARCHY

Fed the alert stream with generated transients, fixed the card-reveal artifact, added a radial scrim so the hero copy stays legible over the galaxy's orange core, gave anchors scroll margins.

PASS 3 · POLISH

Mobile pass at 390 px: swapped the truncating pointing cell for seeing, verified contrast on every label, confirmed Space Grotesk and Space Mono actually rendered, checked reduced-motion, then shipped.

Prompting an agent to build this

Any capable coding agent with a browser-screenshot tool can build this. The prompt that matters is specific about physics, palette, and verification:

The honest secret is the loop, not the prompt: an agent that looks at its own output, names five flaws, and fixes them will beat one perfect first draft every time.