resume

~/root/blog_posts.log/why-the-star-moves

Why the star moves

22 Oct 2026, 2 min read

I rebuilt this site in October 2026. The old one was a Vite single-page app with thick borders and hard shadows. It worked, but it never felt like it belonged to anyone in particular, so I started over.

I kept one thing exactly: the star in the title. It sits where the I would be in a word I'd rather not spell out, and when you scroll it carries the whole title up into the navbar. That motion is the site's handshake, so it stays. It now also runs when you change pages, which is why the title glides instead of snapping.

The site is a circuit board

The star is the one LED on the board. Behind the page there's a field of small registration crosses, dormant until something happens. Click, navigate, or hover a project and a ping leaves the star and lights up whatever it passes. Each project gives the field its own signature while you're looking at it: spectrogram bands for the Sanskrit ASR, a radar sweep for the canine vitals work, packet routes for the network projects, and an eye that blinks.

It's all one fragment shader rendered at a deliberately low resolution and dithered, so it reads as printed rather than glowing.

The tree is real navigation

Press ⌘K (or /) and you get a prompt that understands cd, cat and ls. The tree on the left is the same data the prompt and the sitemap read from, so there's only one place to add a page.

What's under the hood

// Everything that changes every frame lives in one tiny store,
// so React never re-renders for pointer or scroll.
bus.on(20, (t, dt) => renderField(t, dt));
  • Next.js (App Router) and TypeScript
  • three.js for the field and the 3D star
  • Variable fonts: Anybody (its width axis is why headings swell on hover), Newsreader for reading, JetBrains Mono for anything that's a terminal

Posts live in plain MDX files for now.