FigmaからSwiftUIコードを生成するためのAI Agent使いこなし術 by Kichiemon

AI Agentの進化によって、「Design to Code」への期待値が大きく高まっています。

その動きを受けて、Figmaで作成されたデザインを元に、GitHub Copilot Agentを活用してSwiftUIコードを自動生成する取り組みを行いました。
精度向上のためにコンテキスト整備（ディレクトリ構造、コード規約、TCAの実装パターンなど）やプロンプト最適化（実装計画や注意事項の指示追加など）を試みましたが、リスト表示の消失やアイコンがそのまま残るなど、UIの再現度が著しく下がってしまい、期待通りにAgentが動いてくれないこともしばしばでした。

これらの課題をどのように解決し、どのような結果が得られたのか、AI Agentを使いこなすために得られたヒントをお話しします。

• The Composable Architecture（TCA）を用いた SwiftUI のコード生成は可能か
• デザイン再現性を高めるための GitHub Copilot Agent 使いこなし術
• Figmaデザインデータの作り方と生成コードの品質は相関するのか