Developer toolsValidation prototype

BluePainter

Design and code, one surface.

Role
Founder. Concept, design and build.
Team
Solo
Timeline
MVP late 2025; validation prototype 2026
Stack
Vite and React, AST-preserving code sync, Electron desktop apps for Mac, Windows and Linux, a Capacitor iPad app, local and cloud model routing, a VS Code extension, an Astro site, an MCP server
Year
2025 to 2026
8 sessions
is the go/no-go bar: the prototype exists to be interviewed against
Validation plan
AST
preserving write-back, so developers keep their own code
Technical bet

The problem

Design tools export code nobody keeps. Code-first teams lose the visual layer. BluePainter is a workflow bet rather than an LLM wrapper: AST-preserving bidirectional sync and team-configurable design policy inside existing repositories.

Key decisions

Constraint

Generated code that replaces a developer’s file gets reverted.

Options

Regenerate components from the canvas, or write back into the existing AST.

Decision

AST-preserving write-back. Canvas edits change the nodes they touch and nothing else.

Trade-off

Much harder to build. It is the only version developers would keep.

Constraint

The idea is big enough to waste a year on.

Options

Build the product, or build the thing that tests the product.

Decision

A validation prototype that opens straight into the canvas, with an interview guide, in-app feedback, facilitator mode and session export, and a go/no-go after eight sessions.

Trade-off

No revenue yet. Also no year wasted.

The work

Live demo
BluePainter app: the dashboard on the canvas with its TSX beside it and the Designer’s Receipts panel open, scoring design, buildability and accessibility
The canvas and the TSX it writes to, with Designer’s Receipts scoring the page against team policy. Each issue has a one-click fix.
Live demo
BluePainter AI Generate panel with Edit selection, Add section and Write copy tabs and a model picker for Auto, Local, Claude, OpenAI and Other
AI edits are operations on the layer tree, not generated files. The model is the user’s choice: Auto routing, a local model, Claude or OpenAI with their own key, or any compatible API.
Live demo
BluePainter export dialog offering a Vite, React and TypeScript project as a zip, to GitHub or to Vercel
Export a Vite, React and TypeScript project as a zip, push it to GitHub or deploy it to Vercel.
Live demo
The BluePainter marketing site hero: Design, code, ship, one surface
The redesigned marketing site, with an interactive canvas-and-code demo below the fold.
Live demo
BluePainter marketing site comparing a 41-line regenerated diff with BluePainter’s one-line change
The pitch in one comparisonA regenerated file changes 41 lines, an AST patch changes one.
Live demo
BluePainter download page with desktop apps for macOS, Windows and Linux
Desktop apps for macOS, Windows and Linux, with local models and auto-update. An iPad app and a VS Code extension sit alongside.

How it was built

  1. 01DiscoverCalls and walk-throughs with the people who would use it
  2. 02CompileTranscripts, files and constraints in one requirements brief
  3. 03SpecifyA detailed, sourced spec from Perplexity, reviewed and locked
  4. 04BuildDesigned and built with the latest AI models, in the production stack
  5. 05TestUser testing on every preview, with real users on real tasks
  6. 06IterateFindings turned into the next round of changes, worst problems first
  7. 07ShipTests, security review and release, then back to testing and iterating↻ Back to Test
How I work, step by step →

Where AI was used

The sync is deterministic by design. AI assists authoring and the distribution site’s guides; the position is explicitly “not an LLM wrapper”.

What’s next

Go/no-go after the validation sessions, then the VS Code extension to the Marketplace and signed desktop builds.