Speak at The Fifth Elephant 2026 Annual Conference
Share you work with the community
Jul 2026
13 Mon
14 Tue
15 Wed
16 Thu
17 Fri 09:00 AM – 06:00 PM IST
18 Sat 09:00 AM – 06:00 PM IST
19 Sun
Omkar Sabade
Submitted Jun 17, 2026
Every design system has the same expensive seam: the handoff from Figma to code. A designer ships a pixel-perfect screen, and an engineer spends hours inspecting layout, colors, spacing, and variants, then hand-writing it into the codebase over and over, across every platform the design system targets. At PhonePe we built FigGen, an agentic pipeline that turns a selected Figma node into production-ready code for Mint - our 150+ component design system. It generates the individual components and then composes them into full screens. But the interesting part isn’t “LLM writes UI code.” It’s everything we had to build around the model to make the output trustworthy: a deterministic component classifier, a five-layer architecture contract enforced by a code-review agent, a compile-time token validator, and an MCP layer that bridges Figma and our component catalog.
This talk walks through the real architecture and the engineering decisions that made it reliable. We will show how a conductor agent orchestrates a four-stage pipeline: design analysis, implementation, code review, finalize - and how the same backbone scales up from a single component to a whole screen by mapping Figma layers onto catalog components. Why we deliberately split analysis and implementation into separate agents to clear accumulated Figma API context before any code is generated. We’ll dig into the parts that actually move accuracy - a decision tree that classifies every design into one of four component tiers (each mapping to a specific code pattern), per-variant token resolution tables, a token validator that we compile against the real design-system library to catch invalid tokens before generation, and BLOCKER gates that stop the pipeline when generated code hardcodes a color or skips an enum variant. Every run is isolated, versioned, and instrumented so the agent’s work is inspectable and auditable.
Lalchand Rathore is an Architect and Member of Technical Staff at PhonePe. He specializes in driving cross-platform application stability and performance at scale. Currently, Lalchand is focused on building AI-driven solutions that enhance both platform development workflows and end-user experiences.
Omkar Sabade is a Software Engineer and Member of Technical Staff at PhonePe. Working with the payment app core team, he specializes in iOS application stability and performance at scale. Omkar also focuses on integrating AI capabilities that enhance platform development experiences.
Engineers and platform teams building production agents that generate code or other structured artifacts, design-system and frontend-infrastructure owners, and anyone wiring up MCP servers and multi-agent workflows who needs the output to be reliable enough to ship.
Draft slides (PDF/PPT, comments access):
TODO
2-min elevator pitch video:
TODO
{{ gettext('Login to leave a comment') }}
{{ gettext('Post a comment…') }}{{ errorMsg }}
{{ gettext('No comments posted yet') }}