No handoff. I designed each page and merged it myself.
17 pages designed and shipped to production as reviewed PRs; thirteen-plus live on withsurface.com. As a contract design engineer I designed each page in Claude, built it in the production Next.js repo with Claude Code, and merged it as a reviewed pull request.
Surface Labs is a YC company building an AI-native GTM platform. It reports converting up to 30 percent more visitors into demos for the B2B teams it serves. That is their product claim, not my result.
On-brand by construction.
The pages are a system, not one-offs. Content lives in a typed file: headline, stats, links. The template reads that file and composes the finished page, so staying on brand is a property of the build rather than something I re-apply by hand.
The competitor pages run one formula: the headline is an argument, exactly three reasons, an honest capability matrix, one CTA. I built it once, then drove every rival from a data file.
Style comes only from the Surface kit, so every page passes as a withsurface.com page. A design-token check rejects raw hex in review, which is what stops a rushed page from drifting off the kit. Same engine, different data.
The set: strategy guides, persona pages, competitor pages, an industries directory. I composed with the team's component kit. I shipped the pages, not the kit.
I also ship interactive lead tools. This one finds where a B2B funnel leaks, stage by stage. The live, clickable version runs at withsurface.com/lp/pipeline-diagnosis.
I reverted six of my own merges.
Early on, work of mine reached main before review had cleared it: six merges. I backed all six out and rebuilt the same work into three pull requests that went through review properly.
Nobody on the team had to untangle my history afterwards. That was worth more to them than the merges I gave up.
The films are built, not recorded.
I also build motion systems. Each film is a Remotion composition fed by a typed data file, and every aspect ratio comes out of that same composition. Change a number and the type, the timing, and the sound cues all move with it (films play silent here).
Everything is rebuilt in code with Remotion; no screen recordings. First brief: the AI Visibility Index, an honest leaderboard where a competitor wins and Surface is the CTA.
Same system, a different brief. Four AI models answer the same prompt. The divergence is the story.
Live on withsurface.com.
The role: the designer who ships the last mile in code, via Claude Code, on the team's Next.js repo.
Open the ones that are live: