概要
https://zenn.dev/pksha/articles/82d7ebc8496c32
詳細内容
## Cursor・MCPを活用した画面刷新プロジェクトにおける開発サイクルと教訓
https://zenn.dev/pksha/articles/82d7ebc8496c32
PKSHA Technologyは、CursorとMCPを統合したAI中心の開発フローを構築することで、開発サイクル全体の速度と品質を大幅に向上させました。
**Content Type**: ⚙️ Tools
**Language**: ja
**Scores**: Signal:5/5 | Depth:4/5 | Unique:4/5 | Practical:5/5 | Anti-Hype:4/5
**Main Journal**: 89/100 | **Annex Potential**: 87/100 | **Overall**: 88/100
**Topics**: [[AI開発ワークフロー, Cursor, Model Context Protocol (MCP), 開発者体験 (DX), フロントエンド開発]]
PKSHA Technologyのソフトウェアエンジニアが、社内問い合わせ管理ソフトウェア「PKSHA AI ヘルプデスク」のチャット画面刷新プロジェクトにおいて、CursorとModel Context Protocol (MCP) を活用したAI中心の開発フローを構築した経験とその教訓を共有します。このプロジェクトでは、「AIにコードを書かせる」だけでなく、タスク起票から仕様参照、フィードバック反映、QA、PR作成までの一連のサイクル全体をAIフローとして再構築し、開発の速度と品質の向上を実現しました。
この開発フローの核は、SWE (ソフトウェアエンジニア) の役割シフト、MCPによる一次情報への直アクセス、そしてSlash Commandによる半自動化の3点です。SWEは仕様の解釈と実装をAIに任せ、AI出力の品質保証や複雑な課題解決に集中できるようになりました。MCPを通じて、CursorはLinear (チケット)、Notion (議論・指示)、Figma (デザイン)、GitHub (コード)、Chrome DevTools (実行時情報) などの一次データに直接アクセスします。これにより、調査・理解・実装の間に発生していた転記や要約のコストが削減され、開発ループが劇的に短縮されました。さらに、PR概要の自動生成（`/createpr`）やlint/test修正（`/lint`）などの定型作業をSlash Commandで半自動化することで、開発前工程の品質と速度が安定しました。
結果として、フィードバックから修正までの反復が高速化し、チケット起票から翌朝には修正が反映されるほどのスピードが実現可能になりました。
一方で、AIの限界も明らかになりました。ビジュアル比較（余白のズレ、アニメーションの不自然さ）や、CSSのような細かいフロントエンドの調整、既存コードの暗黙の仕様や副作用の考慮は、依然として人間の判断が不可欠です。筆者は、AIを効果的に活用するためには、「人間側の言語化能力」と「AIに明確な指示を与えるための知識」が重要であると強調しています。
最終的な教訓として、入力設計（チケットの背景・完了条件・修正ポイントを丁寧に構造化すること）が成功の鍵であり、AIが実装を高速化するほど、SWEの価値は設計・アーキテクチャの検討、UI/UXの違和感の言語化、AIが提示した変更の品質保証といった高次な領域にシフトすると述べています。今後はStorybook MCPやビジュアルプロンプト性能の高いモデル（Gemini 3.0など）、デザイナーが直接コードにフィードバックできる仕組みを導入することで、さらなる改善と拡張を目指しています。