DE
Esc

← All projects

Looking back, dated two days after the last commit.

A website for takeøff in five days, with a night sky and no tracking

Our cultural collective in Potsdam needed a website. I built it in five days, bilingual, with my own Canvas scene engine and a data layer that can take a database later.

The moon on the home page shows today’s actual moon phase. Calculated, not an image.

takeøff is a volunteer cultural and rave collective in Potsdam, founded in June 2024, about 20 people today. We needed a website that is bilingual, works without tracking and has an internal area for the crew. And that someone who doesn’t code can maintain later. I built it from September 2 to 7, 32 of 33 commits, live on Vercel. The work was heavily agent-assisted, with clear contracts in AGENTS.md and CLAUDE.md about what the agents may and may not do.

Technically it’s Next.js 16 with TypeScript and plain CSS, no UI library. The most visible part is the background. For that I wrote a small scene engine on Canvas 2D, without any outside library: a starfield with the real moon phase, Mars, a beach and a daytime sky. Three themes, each in a day and a night version. Plus three effect levels, and if you’ve turned on reduced motion in your operating system, you get the calm version. A nice scene that stutters on an old phone would be worse than none.

The more important part is invisible. No page loads its own data. Everything goes through one central access point, a single file that has JSON files behind it today and can have a database behind it later without touching a single page. And every data type has a contract: a JSON description of its fields. The editing forms are meant to be generated from that description later. That convention is now a fixed rule in all my projects.

Then there are check scripts: a UI check across eight screen widths, a check for German text left on the English pages, a scroll-performance measurement against a saved baseline, and a mobile audit. The crew area with shift procedures and an emergency plan runs separately.

The site isn’t finished yet. Part of the content is placeholder, and the legal pages are still missing. But the structure stands, and once the forms exist, new content won’t need code.

What I’m taking away: on a project other people are supposed to maintain, the data layer matters more than the looks. And effects only with an off switch. People who don’t cope well with motion should still be able to read everything.

Tools and skills: Next.js 16, TypeScript, CSS without a framework, Canvas 2D, Vercel, an adapter pattern for the data, contract-driven data types, accessibility with prefers-reduced-motion, automated UI and performance checks, and agent-assisted work.

One more thing from last autumn: for our events I also wrote a small Python generator that builds tokens as STL files for the 3D printer. 45 millimetres, ridged edge, printable without supports.