Back to projects

Horizons Portfolio
2019 to 2026 · Website · Personal project
This site. Besides the parallax night scene at the top, it runs my quote form, an admin inbox and invoicing, and a portal where clients manage the sites I host for them.
What it does
The home page is a night scene drawn in layers: twinkling and shooting stars, clouds, mountains, a wind-blown forest, a lake with ripples and fog, and a campfire at the end of the page. Each layer moves at its own depth as you scroll.
Phones can't hold all of it, so the page decides before it first paints how much of the scene a device can afford, adds the rest a tier at a time while timing frames, and steps back down if scrolling slows.
Highlights
- Scene tiers chosen before first paint from the screen and memory, so phones never load more than they can hold
- Layers moved by CSS scroll timelines where the browser supports them, which made scrolling smooth on phones
- A client portal for the deploys, backups, domains and analytics of the sites I host
- Quote form, admin inbox and scheduled invoicing, on Postgres with Prisma
- Self-hosted in Docker, deployed on every push by my own Actions runner
Built with
Next.jsReactTypeScriptTailwind CSSPostgreSQLPrismaDocker
About half by hand and half with Claude