This is how I use AI for Design Systems at Monday.com

By Sneak Peek Design

Categories: Design, Product

Summary

Monday.com's design team has automated its handoff process with AI-powered specs that eliminate 90% of manual documentation, allowing them to build faster and more consistently while reducing developer overhead.

Key Takeaways

  1. Monday.com uses Figma MCP and internal tooling to automatically generate highly detailed, technical specifications from Figma designs, removing the need for manual annotation.
  2. The AI-generated specs provide full visibility into component props, structure, and usage, enabling developers to implement designs accurately without back-and-forth.
  3. By writing specs for the AI instead of humans, Monday.com's design team can capture internal design system rules and philosophies that would otherwise be lost in manual handoffs.
  4. The AI-powered spec generation process allows the design team to scale their output and responsiveness, as they no longer have to wait for developers to implement and provide feedback.
  5. Monday.com has reduced developer overhead by 80% and sped up implementation by 3x through the use of AI-generated design specifications.
  6. The AI-powered spec generation process allows the design team to capture and enforce their design system's philosophies and guidelines, ensuring consistency across the product.

Topics

Transcript Excerpt

What was your process like for managing design systems with AI? >> Yeah, so before we had to do you can see a lot of annotations, a lot of this is a two pixel gap, this is a background. Now it's just like a simple document. It can be as long as we want. We can we still write it but instead of writing for [music] a person we write for AI. For example, all the spacings are visible. It helps the AI to see the spacing in cursor. I can show it and we use Figma MCP. So Figma MCP helps us a lot to get ...