Blackline — An operating system for agencies building client sites
Design-system governance, AI-assisted generation and Figma integration in one product. Designed, architected and shipped end to end.
[ The problem ]
AI made it trivial to generate a website and no easier to ship one that holds up. Agencies gained speed and lost the structure underneath it — design systems that drift from code, generated changes nobody reviewed, and handover documents nobody trusts. Blackline exists because I kept solving the same problem for clients by hand.
[ Goals ]
Governance — every AI change enters as a reviewable proposal, never an unaccountable edit. One source of truth — Figma variables, the design system and production code held as one artefact. Handover — built for agencies running work they did not personally draw. Velocity with a floor — fast generation that cannot fall below a quality threshold.
Approach
Blackline was built by solving the problem for real clients first and productising the pattern second. Intake was designed as a single question — what are we building — rather than a wizard. Generation was modelled as a proposal with explicit gates and provenance, never an unaccountable edit. The design system was wired as a token pipeline through a custom Figma plugin, so a variable change in Figma is the same event as a token change in code. Every surface was designed mockup-first at fidelity, then dispatched to build, then reviewed on production — the same governed loop the product enforces for its own users.
[ Scope and constraints ]
[ The work ]
The surfaces.
Project intake
Let an agency describe a job in plain language and have the system understand it.
Designed the intake as a single question — what are we building — with attachments, a Figma link and a type selector, rather than a multi-step wizard.
A brief becomes structured input the pipeline can act on, without a form nobody wants to fill in.
Review and approval
Make every AI-generated change something a human signs off before it reaches a client site.
Modelled generation as a proposal rather than an edit, with explicit gates, provenance on every change, and a review surface that shows what would change before it does.
Generation stays fast, and nothing ships that nobody looked at.
Design system governance
Hold Figma variables, the design system and production code as one artefact instead of three drifting copies.
Built a token pipeline with a custom Figma plugin, so a variable change in Figma is the same event as a token change in code.
The system stops being documentation and starts being the thing that actually ships.
[ The system underneath ]
[ Results ]
1 | Source of truth, Figma to code 0 | Unreviewed changes reach a client site 7 | Pipeline stages, brief to delivery
Teams can generate a site in a day and no longer spend three months making it survive contact with real content, real users and real handover. The product turns that judgment into infrastructure — gates, provenance and a token pipeline — so the speed is kept and the fragility is not. The system stops being documentation and starts being the thing that actually ships.
What I carry forward
Building the tool I wished I had taught me that governance is a feature, not a tax. The agencies who move fastest are the ones whose speed has a floor.