2/5 slots open for November
I design the interface, then build it in code so nothing gets lost.
Product interfaces, design systems and motion, designed in Figma and shipped as accessible React.
Shipped with teams at
Lumen
Fieldnote
NORTHWIND
halcyon
Parcel.
Selected work.
Three builds, each with the problem, the decisions and what changed. Names changed where NDAs apply.
01
Lead design engineer
8 months, 2023
Lumen design system
One token pipeline, 140 components, zero drift between Figma and code.

02
Designer and builder
6 weeks, 2025
Fieldnote marketing site
A fast Framer site the founders update without a developer.

03
Design engineer
3 months, 2024
Onboarding that teaches itself
From a ten-step wizard to a first project in four minutes.

See all case files
The lab.
Small interaction studies and component experiments. Most end up in client work.

Motion
Magnetic buttons
Buttons that lean toward the cursor, with spring physics tuned to feel heavy, not floaty.

Shader
Gradient shader study
A WebGL gradient that responds to scroll speed. Under 4 kB, with a static fallback.

Component
Spring-loaded tabs
A tab bar where the indicator stretches between targets before it settles.

Rive
Rive state toggle
A theme toggle built as a Rive state machine, driven by real props from React.
From the pixels to the pull request.
Seven years across product design, front-end and design systems.
2024–Now
Independent Design Engineer
Contract for 9 product teams
Designed and shipped design systems, marketing sites and product UI for Seed to Series C teams.
Every component ships with tokens, Storybook docs and an accessibility check.
Teams keep the Figma library and the code in sync long after I leave.
2021–2024
Design Engineer
Lumen, Series B
Rebuilt the Lumen design system: 140 components and one token pipeline from Figma to code.
Cut Figma-to-production time from three weeks to three days.
Led the motion language across web and mobile, now used by 40 engineers.
2019–2021
Front-end Developer
Fieldnote
Built the marketing site and onboarding flow in React and Motion.
Raised the Lighthouse performance score from 54 to 98.
2018–2019
Product Designer
Studio Kiln
Designed apps and identities for twelve clients, then started prototyping them in code.
Learned React to stop losing details in handoff, which is where all this started.
Certs and schooling
2024
Web Accessibility Specialist
IAAP
2023
Framer Expert
Framer
2018
B.Des. Interaction Design
Design Academy Eindhoven
Toolkit
Figma
Framer
React
TypeScript
Tailwind
M
Motion
Rive
Storybook
Kind words.
Recommendations from managers, clients and teammates, all on LinkedIn.
P.S.
If your Figma file and your product have drifted apart, let’s fix that.
Twenty minutes, no deck. Bring a screen you’re stuck on and I’ll tell you how I’d design and build it, even if we never work together.



