I build design systems, polished UI, and the guardrails that let teams — and agents — ship them.
Ten years shipping production frontends, from startup studios to the booking funnel of Rail Europe. I care about the last 10% (interaction details, accessibility, perceived speed) and about making the right path the easy one for whoever builds next.
Before code, I was a journalist. I still write docs as if someone is actually going to read them.
Rail Europe · 2025 — now
Instead of a rewrite, a revamp — a legacy Rails monolith moved toward modern Rails and Hotwire, the mobile apps brought onto the same codebase, and booking pages made to feel faster.
A case study teaser in the “Selected work” grid: cover, eyebrow, title, summary, impact.
.cards .card .card-cover .is-portrait .is-wide .card-title .card-link .card-summary::after stretches the hit area over the whole card.<article>, so the article holds the teaser only.::after.--color-fg on --color-surface ≥ 4.5: title and summary--color-muted on --color-surface ≥ 4.5: eyebrow and impact labels
From src/system/contracts.ts · checked by
tests/system.test.ts ·
Card on /system
Rail Europe · 2024
First in-house engineer on a from-scratch rebuild of the B2C booking site, alongside a team of consultants. Developer, Scrum Master and facilitator — and, for months, a bit of the missing roles too.
A case study teaser in the “Selected work” grid: cover, eyebrow, title, summary, impact.
.cards .card .card-cover .is-portrait .is-wide .card-title .card-link .card-summary::after stretches the hit area over the whole card.<article>, so the article holds the teaser only.::after.--color-fg on --color-surface ≥ 4.5: title and summary--color-muted on --color-surface ≥ 4.5: eyebrow and impact labels
From src/system/contracts.ts · checked by
tests/system.test.ts ·
Card on /system
Side project · 2026
A framework-free static site generator for data stories, built with Claude Code in a few days. The interesting part isn't the speed — it's the frame that kept the agent honest.
A case study teaser in the “Selected work” grid: cover, eyebrow, title, summary, impact.
.cards .card .card-cover .is-portrait .is-wide .card-title .card-link .card-summary::after stretches the hit area over the whole card.<article>, so the article holds the teaser only.::after.--color-fg on --color-surface ≥ 4.5: title and summary--color-muted on --color-surface ≥ 4.5: eyebrow and impact labels
From src/system/contracts.ts · checked by
tests/system.test.ts ·
Card on /system
Holivia · 2022 — 2024
The whole frontend of a mental-health platform, designed and rebuilt — including a calming audio player and video calls with therapists, in vanilla JavaScript, CSS and HTML.
A case study teaser in the “Selected work” grid: cover, eyebrow, title, summary, impact.
.cards .card .card-cover .is-portrait .is-wide .card-title .card-link .card-summary::after stretches the hit area over the whole card.<article>, so the article holds the teaser only.::after.--color-fg on --color-surface ≥ 4.5: title and summary--color-muted on --color-surface ≥ 4.5: eyebrow and impact labels
From src/system/contracts.ts · checked by
tests/system.test.ts ·
Card on /system
Tokens, documented components and Storybook as a shared language between design and code. Now making them readable by AI agents too — starting with this site.
Semantic HTML, keyboard and focus first, inclusive states, reduced motion. Perceived performance is craft too — optimistic rendering, progressive enhancement, no layout shifts.
Tests, performance budgets, linting and CI that encode the conventions, so nobody has to be the bottleneck. And proof of improvement — measured before and after, so a refactor shows its value.
I build with Claude Code. Most of the work is the frame — CLAUDE.md conventions, phased plans compacted into logs, decisions recorded as ADRs, and test gates that fail when the agent drifts.
Scrum Master and team facilitator for a 21-person SvelteKit rebuild, often filling the gaps of missing roles. Pairing, reviews, docs and conventions that let a team contribute with confidence.