The Serendie Design System (SDS) provides mechanisms that enable AI agents to efficiently utilize the guidelines and various assets offered by SDS in AI-driven development and design.

Quickly prototype new ideas

By connecting tools like Figma Make to the Serendie MCP Server, you can achieve both quick prototyping and a consistent “Serendie look and feel.”

Implement products based on Figma designs

By connecting coding agents such as Claude Code or Cursor to the Serendie MCP Server, or by using Agent Skills, you can efficiently build implementations with Serendie UI. When designs are created based on the Serendie UI Kit, combining with Figma MCP enables even more precise implementation.

Create precise designs for engineer handoff

Using the Figma plugin Serendie UI Plugin, you can efficiently create well-structured designs that leverage the Serendie UI Kit. By basing designs on the Serendie UI Kit—where Figma components are mapped to code components—you can produce designs that are easy for AI to understand.

These are just some examples of SDS for AI. Beyond these, we actively leverage AI across SDS operations, including adding components to Serendie UI and updating documentation.