Serendie Design System (SDS) では、AIを活用した開発・デザインにおいて、SDSが提供するガイドラインや各種アセットを、AIエージェントから効率的に利用できるようにするための仕組みを提供しています。

新しいアイデアをラフにプロトタイピングしたい

Figma MakeなどをSerendie MCPサーバーに接続することで、クイックなプロトタイピングと「Serendieらしさ」を両立することができます。

Figma上のデザイン案をもとにプロダクトを実装したい

Claude CodeやCursorなどのコーディングエージェントをSerendie MCPサーバーに接続したり、Agent Skillsを使うことで、Serendie UIを使った実装が効率的に実現できます。 また、デザイン案がSerendie UI Kitをベースに制作されている場合は、Figma MCPを併用することで、より精度の高い実装が可能です。

エンジニアにハンドオフすることを想定した精緻なデザインをしたい

Figmaプラグイン Serendie UI Pluginを使うことで、Serendie UI Kitの活用した構造化されたデザインを効率的に実践できます。 Figmaコンポーネントとコードコンポーネントが対応付けられているSerendie UI Kitをベースとすることで、AIが理解しやすいデザインを実現できます。

上記はSDS for AIの一例です。その他にも、Serendie UIへのコンポーネント追加、ドキュメントのアップデートなど、SDSの運用シーンにおいてもAIを積極的に活用しています。