humans & agents
A design system Unica can read, and so can their AI agents.
One system, two readers.
For years a design system had one reader: people. They browse it, reuse what fits, and bend a rule when the product needs it. They forgive the gaps, fill in what's missing from memory, and keep the thing alive through sheer judgement.
Lately there's a second reader, and it works nothing like the first.
Agents don't browse; they parse and execute. What the repo and the spec say is what gets built. A missing token or a component that only lives in Figma isn't a gap to route around, it's simply the truth, shipped.
So the bar moves. The same system now has to read the same way to a person and a machine, without flattening the taste and history that made it worth building. That's the work.
Work
View case
built to be adopted
Embedded as the design-system expert: a new foundation, a strategy, and the training to make teams adopt it.
a language that adapts
One token system that flexes across products and age groups, all from one core.
change without code
Design tokens, a Figma library, and a live doc site, so a theme change ships without a developer rebuild.
one team, every brand
Design leadership and hands-on craft: shaped the team, built the unbranded tokens and components underneath.
I work through CreateNew, a designer-owned cooperative I co-founded. Recent design-system engagements include:
-
Design Engineer · UnicaBuilding Unica's design system to be read by humans and agents alike: tokens, paired components, machine-verifiable specs.
-
Design Systems Lead · ExactUX strategy and component architecture for the design system at the Dutch business-software company.
-
Design Systems Strategy Lead · ANWBTwo engagements: first rethinking the system's foundation and strategy, then returning to refine it and train the product teams to run with it.
-
Design Systems Lead · Infinitas LearningA new visual language across their products for teachers and pupils: token structure, components, and the Figma-to-code pipeline.
-
Design Systems Consultant · BrenntagDesign-system work for the digital products of the global chemical-distribution group.
-
Design Lead · E.ON DriveMulti-brand design system: one React-and-tokens codebase, two brands in light and dark, live across the Nordics.
Beyond client work, I curate Design System Designers — a feed of links from the Dutch design systems WhatsApp community.
Lab
The work I make when nobody asked. If something could be smarter or faster, I build it. Partly for the love of building, mostly because it sharpens what I'm paid to do. Most of it starts inside real work: a shortcut for my own process, or a custom tool left behind on a client project. Some is still on the bench; a few may become repos. These are experiments, not products, so expect rough edges.
live demo
Background shade from a cover
A background that derives a balanced color scale from an image, so the page takes its tone from the content.
extract a dominant hue, build a perceptual ramp in OKLCH, expose it as design tokens
live demo
Cursor-tracking 3D dither bust
A 3D bust that follows your cursor and renders as theme-aware ordered dots in real time.
offscreen Three.js GLB render, neck-pivot yaw/pitch with spring cursor tracking, 4×4 Bayer CPU dither
live demo
Motion tokens
Motion treated as tokens, the same as color or spacing, so easing and timing stay consistent and portable.
easing, duration and delay captured as named tokens, previewed live; brand variants on top are a bonus
live demo
Theme-aware dithering
A photo rebuilt as ordered dots that recolor with the active theme.
4×4 Bayer ordered dither on an offscreen canvas, recomputed on resize
live demo
WebGL warp carousel
A carousel that bends and blurs its cards in a shader as they move.
OGL shaders for warp, progressive blur and chromatic aberration, fed by DOM rasterization
Framer plugin
Framer token sync
Pull design tokens into Framer and create variables from them.
a Framer plugin that maps a token file onto Framer variable collections
Figma plugin
Token sync, Figma to Git
Two-way sync between Figma variables and a token repo, with a diff before anything lands.
three-way diff across repo, Figma and conflicts; pushes edits back as a pull request
live site
Shared links, published
A WhatsApp group for design-system people, with a live site that collects every link shared in it.
links dropped in the group are published to the site automatically, no manual curation step
in development
CNDS npm consumer
A reference app that builds UI only from published design-system npm packages, for agent-driven design and dev workflows.
npm install @createnew/tokens and @createnew/ui-react, compose templates and components with agent guardrails
Contact
If you've read this far,
we should talk.
A system to build, a foundation to modernize, a team to get running on its own: that's the work I like best. A system two readers depend on is never really finished, so I also work on retainer, keeping it current as the brand and the tooling move while the team stays focused on the product. If that's the problem on your desk, let's have a coffee.
