Deco: A shared design language born from deep collaboration
Decagon, a customer experience platform now in its third year, builds AI agents that handle voice, chat, and email support. The company’s rapid growth earned it a spot on the CNBC Disruptor 50 list—a feat its team attributes not just to the product, but to the way they build it.
When product designer Jennifer Xu joined, there was no design system in place. The platform was growing quickly, and the absence of shared standards was becoming a bottleneck. Inconsistencies across the UI undermined the polish enterprise customers expected, and back-and-forth revisions between design and development consumed time and effort.
The team decided to solve the problem collaboratively from day one. Designers and engineers worked together to build Deco, a system that anticipates edge cases and aligns with what already exists in code. They tackled questions early that would have been costly to address later: behavior in focus mode, required states for each component (disabled, read-only, error, warning), and whether placeholders should exist.
The outcome is an org-wide Figma library with hundreds of components, styles, and variables, covering most use cases across multiple teams. According to Figma’s library analytics, it has logged tens of thousands of inserts in 30 days. "With a built-in library, we aren’t debating styles or implementation," says Xu. "Engineers have a clear view of which button or table should be used. It also means we have a shared vocabulary."
Bridging design and code with MCP
Coding agents only work with what they are given; inconsistent design files produce inconsistent output. At Decagon, the old handoff process meant designers exported specs, developers interpreted them, and mismatches were only caught later during review. The Figma MCP server changed that loop.
The engineering team moved Deco’s components into Storybook and gave coding agents a skill to pull the correct components when implementing designs. Designers got a complementary skill to add new components, which keeps Figma and code in continuous parity. Using the Figma MCP, agents can access specs, code, and canvas in a single loop.
"With MCP, I can just copy and paste a link of my Figma into the coding agent, and it’ll not only use the skill of getting design context, but also map it to our design system components," says Xu. The flow yields high-fidelity results with far fewer iteration cycles than before.
Customer-driven prototyping with Figma Make
Roughly 70 percent of Decagon’s product roadmap comes directly from customers. The team runs hands-on roadmap sessions with clients, and being able to show mockups and working prototypes in Figma is central to those conversations. Figma Make, along with connectors to internal tools, helps "raise the ceiling on the products we’re building," says Bihan Jiang, director of product.
Teams no longer gather requirements in a doc and present an end product later. They build 10 different prototypes and show them to 10 different customers, resulting in a faster build process and a better-aligned product.
One product manager used Make to prototype new graphs and redesign pages—prompting for style changes in the context of a screenshot of an existing page. This approach let the team test whether a new visualization was useful before investing heavy design and engineering resources. In another case, a PM took an original chart, described desired changes into Make, and sent the output to a developer, cutting out several translation steps.
"It was a lot simpler than the process of translating that to a designer, a designer creating a mock, and then the engineer developing it. It cut down on development time," Xu notes.
Prototyping visually from the start aligns with how the team thinks about analytics problems. "As a designer, I’m thinking visually, and when you’re working on analytics, the problem is visual," Xu explains. "So starting to think in the modality the end product is in, from the very beginning, is useful." For Decagon, that instinct—to stay concrete and collaborative early on—means design decisions never become siloed, and quality stays consistent as the team scales.
