A board-approved pilot I led to fix the most expensive gap in enterprise delivery: moving an approved design into a different production stack without losing behaviour.
Role
Led from Product Experience Design side
Context
Enterprise B2B · design-to-dev method
Status
Closed · approved as the standard handoff
Stack
React prototype → Angular production · Claude Code
Confidentiality note: company, people & product under NDA.
Approved designs were handed to developers as static Figma files. Static files show what a screen looks like, but not how it behaves — so behaviour was lost on the way to production.
Before
Static Figma files
Screens without behaviour
After
Blueprint handoff
Coded prototype + structured behaviour
The prototype (React) and the production app (Angular) use different toolkits. The code could not simply be copied across; the feature had to be rebuilt.
The approved design existed as a working, coded prototype in React — the reference for how the feature behaves, not only how it looks.
Alongside the prototype I wrote a structured blueprint: behaviour, states, component mappings, phased implementation slices, and acceptance criteria.
I authored the main implementation prompts that drove the build, so a developer could rebuild the feature in production with Claude Code.
The rebuild ran slice by slice. Each phase was reviewed against its acceptance criteria before the next began, with Design QA closing the loop.
Because React and Angular use different toolkits, the component mappings told the developer what each prototype element becomes in production.