AI-assisted software development 2026
Keeping a design system and its code aligned
AI-assisted workflows that connect the reusable component library in Figma with the product code.
The situation
Design systems lose value when the reusable component library and the code drift apart. Teams then spend time translating, checking and repairing the same decisions in different tools.
My role
I designed and built the AI-assisted workflow, including a skill around the Figma MCP server that can read the Design System and create product mockups from the existing reusable component library.
The approach
The workflow connects the Figma library and product code through AI-assisted tooling. An automated assistant can produce product mockups from the internal library of reusable components, while people retain responsibility for review and product decisions.
At a high level, the flow is:
Product intent → AI assistant → Figma MCP → Design System components → editable mockup → human review
The principle
Automation is useful here as a coordination layer: it reduces repetitive translation work without replacing the judgement needed to decide whether a component is right for the product.
The outcome
Mockup creation moves from a predominantly manual design task to an assisted workflow built on the same components used by the product team, reducing repetitive exploration work while keeping the resulting design editable and reviewable.