🤖

生成AI活用通信 #4 Devinの成果とMCP活用

に公開

ごきげんよう🙋‍♀️あっきー(@kuronekopunk)です。
私たちツクリンクの生成AI活用推進委員会では、生産性を上げ、より早く高品質なプロダクトをユーザーさんにお届けすることを目指し、様々なAIツールの導入・検証を進めています。
今回はその活動レポート第4弾として、AI活用の広がりと新たなツールの導入状況についてお届けします。

サマリー

今回のレポートのポイントは以下の3つです。

  1. Devinの活用成果: 具体的なPR作成数やコード品質への貢献が見えてきました。
  2. MCPの検証開始: テストやデザインプロセスにおけるAI連携の可能性を探っています。
  3. AIエージェント活用Tips: 効果的なAIとの協業ノウハウを共有します。

活動報告

1. Devinの活用事例と成果

前回のレポートで紹介したAIソフトウェアエンジニア「Devin」ですが、様々なタスクでの活用が進んでいます。

成果報告

.rubocop_todo.yml のLint課題改善
Devinは1ヶ月弱で約40件の小規模な改善のPRを作成し、そのうち約30件がマージされました。これにより、これまで時間が取れずに後回しになっていた .rubocop_todo.yml のLint課題解消などが進み、着実にコード品質が向上しています。
マージされていないPRについても、品質の問題ではなく、主にレビュー待ちの状態です。

PRレビュー支援
DevinがPRの内容を理解し、コメントを付けることで、レビュー担当者の負担を軽減しています。
特にDependabotによるライブラリアップデートのPRでは、変更内容の調査、現行アプリケーションへの影響分析といった定型作業の自動化に大きな可能性が見えています。
また、コードレビューにおいても、Devinからの指摘や提案が取り込まれ、部分的にコード品質の向上に繋がるケースも出てきています。

Featureトグルの削除
利用されなくなったFeatureトグルの削除作業もDevinに依頼しています。
関連するコード箇所の特定、条件分岐の削除、不要になった設定ファイルのクリーンアップといった一連の作業を指示し、PR作成まで自動で行うことを試みています。

Devin活用の現状と課題

人間がボトルネックになる
Devinは手離れのよい単純なタスクでは効果を発揮しますが、少し複雑な指示や修正が必要な場面では、まだ人間による確認や介入が必要です。
人間が直接作業した方が早いケースもあります。しかし、今後LLMの性能が向上すれば、ほとんどの作業をAIに任せる未来が来ると考えています。その場合は人間がボトルネックになる可能性が考えられます。
現状でもPRを量産することはできてもレビュー待ちでPRが溜まる懸念もあります。AIにレビューをさせることもできますが全工程をAIに任せた場合の品質をどのように担保するのかが今後の課題になると考えています。

Cursorとの比較
開発者のローカル環境で動作するCursorとMCPを活用した開発に比べると、インタラクティブな修正や速度の面では、まだローカルツールに分がある場面も多くあります。
今後DevinにもMCPが入ると思われますが、現状では適したタスクを見極めることが重要です。

ナレッジ管理の課題
Devinの学習や設定はWebのGUIベースで行われるため、Cursor Rulesなど他のツールで管理しているナレッジとの二重管理が発生する可能性があります。
こちらも将来的にはDevinがファイルベースでのナレッジ管理に対応すると思われますが、現状では二重管理のまま進めるしかないと考えています。

2. MCP(Model Context Protocol)の検証開始

開発プロセスにおけるAI連携を強化し、さらなる生産性・品質向上を目指すため、MCP(Model Context Protocol)の活用検証を開始しました。
MCPは、AIモデルが特定のツールやアプリケーションのコンテキストを理解し、より的確な操作や支援を提供するためのプロトコルです。

Playwright MCP

Playwright MCP を利用し、ローカル環境でのE2Eテスト実行をAIが支援する検証を進めています。

現在、RSpecによるE2EテストはSeleniumを使用しているため、Playwrightのテストケース作成自動化の恩恵はまだ直接受けられません。
しかし、自然言語によるテストケースの指示や実行が可能になるなど、将来的にはテスト作成・実行の効率化が期待されます。Playwrightへの移行も視野に入れ、検証を進めています。

Figma MCP

Figma MCP を用いて、AIによるデザインレビューと、Figmaのデザインデータからコードへの変換(Design to Code)の検証を行っています。

AIによるデザインレビュー
Figma MCPを活用したデザインレビューのデモンストレーションを行いました。
今回は既存のデザインルールなどを詳細に設定せず、単に「レビューして」と依頼したため、指摘項目は網羅的ではありませんが、AIはデザインの一貫性(例:ボタンラベルのテキストスタイルが他のボタンと異なっている箇所を指摘)やアクセシビリティの問題(例:背景色に対するテキストのコントラスト比が基準を満たしていない箇所を検出)などを指摘します。
人間のデザイナーによるレビューと組み合わせることで、より客観的かつ効率的に、質の高いUIを実現できる可能性を感じています。
AIによるデザインレビュー結果
AIがデザインの一貫性やアクセシビリティの問題を指摘しているキャプチャ

効果と課題
AIレビューは、特にLinterのようなルールベースのチェックやデザインシステム遵守の観点で有効です。
一方で、AIにデザインルールを正確に伝えるためのドキュメント整備や、指摘内容の妥当性を判断する人間のスキルも、より一層重要になると感じています。

AIエージェント活用Tips

小さいステップで完了条件を明確にして指示することが大事です。
これは特定のツールに限らず、多くのAIエージェントに共通する考え方ですが、コンテクストウィンドウ(AIが一度に処理できる情報量)が大きくなりすぎると、AIエージェントの挙動が不安定になったり、指示の意図からずれたりすることがあります。

そのため、一度に大きなタスクを依頼するのではなく、「設計」と「実装」を分けるなど、タスクを小さなステップに分割し、それぞれのステップの完了条件を明確にして指示することが、AIエージェントを有効活用するコツです。

例えば、Cursor Agentを使う場合:

  1. 「〇〇機能を追加したいので、xx.md に機能要件と主要な処理フローをまとめてください」のように、まず設計を依頼し、一つのタスクとしてセッションを完了させます。
  2. 次に、新しいセッションを開始し、「xx.md の内容に基づいて、実装をしてください」のように、実装を別のタスクとして依頼します。

このようにステップを分けることで、各ステップでコンテキストを限定し、AIがタスクに集中しやすくなります。

要件が大きい場合は、マークダウンファイル内にタスクリスト(チェックリスト)を作成し、AIに1タスクずつ実行させ、完了したらチェックを入れさせる、といった手法も有効です。
また、エージェントがエラーで堂々巡りになってしまう場合も、新しいセッションでエラー箇所や関連コードだけを与えて調査させることで、問題解決の糸口が見つかることがあります。

今後の展望

MCPの有効活用

MCPは非常に強力な連携を可能にする一方で、MCP Security Notification: Tool Poisoning Attacks でも指摘されているように、意図しない操作や情報漏洩などのリスクも存在します。
公式に提供されているMCPや、導入前に通信内容や実行権限などを十分に検証し、安全性を確認できたMCPを慎重に選択・活用していく必要があります。
安全性を確保した上でMCPの活用を加速させ、さらなる生産性向上を目指していきます。

AI活用スキルの向上

AIツールを最大限に活用するためには、ツールの機能を知るだけでなく、効果的な活用方法や、AIの出力結果を適切に評価・検証する方法など、AIとの効果的な協業スキルが不可欠です。
今後、開発者向けに、勉強会やドキュメント整備、そしてこのブログのような形での情報発信を通じて、AI活用スキル向上のための知見共有やトレーニングを計画しています。

さいごに

このブログもAIに書かせようとしているのですが、AIが生成した文章にはまだ馴染めず、テーマのアウトライン作成と校正だけに留め、ほとんどの部分を自分でリライトしています。コードはAIが書いたものでも気にならないのに不思議ですね。

生成AI活用について社外の方とも情報交換させていただいています。もしご興味があれば、XのDMなどでご連絡いただけると嬉しいです。

Discussion