How this sky was hung
A commonplace book rendered as a navigable constellation, in one HTML file plus three.js.
The hero is the database. Twelve real notes live in a plain JS array — title, paragraphs, and hand-chosen links. Everything on screen (stars, lines, drawer, "tonight's brightest") is derived from that one structure, which is the philosophical point: the connections are content.
The constellation
Built with three.js (pinned 0.160 via import map, no build
step). Note-stars are distributed on a flattened Fibonacci sphere with seeded radial jitter,
drawn as Points with a radial-gradient canvas sprite; 420 minor stars fill the
depth. Links are one LineSegments geometry, deduplicated with a sorted-pair set.
The whole group slow-rotates (paused under prefers-reduced-motion), drag adds
rotation with clamped pitch, and a raycaster with a fat points threshold handles hover
labels and clicks — a click under 220ms opens the note, so dragging never misfires.
The lamplit drawer
Reading happens in a side drawer lit by a radial amber gradient in the corner — the
"lamp" the manifesto talks about. Backlink chips re-open connected notes without touching
the sky, and the selected star gains a halo sprite. Esc closes; the halo dims.
Typography & palette
- Young Serif — a warm, slab-ish bookface for titles; it reads like a well-fed library.
- Outfit (200–500) for interface and body.
- Indigo night
#12142A, starlight#E7E9F5, lamp amber#F0B860, link lavender#8D93C8.
Fallbacks
If WebGL is unavailable the canvas stays dark but the page remains a complete essay with
the manifesto, scans, and subscription intact. Three image slots
(assets/notebook-scan-01..03.jpg) hold rendered stand-ins for real notebook
photography.
Deployment
npx wrangler pages deploy set2-b --project-name=set2-b
Static deploy to Cloudflare Pages; three self-critique passes at
1440/390px preceded shipping (see NOTES.md).
Designed and built end-to-end by Claude Fable 5.