MCPで実現できる、Webサービス利用体験について

MCPは当たり前になるのか？　〜流行から普及への可能性〜 @ROSCAFE の発表資料です！
https://rosca.connpass.com/event/359497/

Transcript

1. MCP で実現できる、Web サービス利用体験について syumai MCP は当たり前になるのか？　〜流行から普及への可能性〜 @ROSCAFE (2025/7/23)
2. 自己紹介 syumai ECMAScript 仕様輪読会 / Asakusa.go 主催 株式会社ベースマキナで管理画面のSaaS を開発中 Go でGraphQL サーバー (gqlgen) や TypeScript でフロント エンドを書いています Software Design 2023 年12 月号から2025 年2 月号まで Cloudflare Workers の連載をしました Twitter ( 現𝕏): @__syumai Website: https://syum.ai
4. https://tech.basemachina.jp/entry/llms-full-txt-ai-support-chat
5. 今日話すこと 今回は、ややライトな内容です Web サービスの機能のMCP Tool 化 MCP Tool 利用方法の紹介 MCP Tool 化したWeb サービスの利用体験 MCP はWeb サービス開発企業に浸透するか？（本日のテーマ）
6. Web サービスの機能のMCP Tool 化
7. MCP 、どう活用する？ Web サービス開発企業の「MCP 活用」文脈は以下の2 つ 1. Web サービスの機能提供での活用 2. プロダクト開発での活用 今回は、機能提供での活用の話
8. Web サービスの機能をMCP で提供するとは？ 従来、UI 経由で提供していた機能をMCP Tool 化すること 例 EC サイト: 商品一覧、購入 ニュースサイト: 記事の閲覧 SNS: ポストの閲覧、投稿
9. MCP Tool で提供した機能の使い方 AI チャットサービスからの実行 Claude, ChatGPT ( 現在はDeep Research のみ) など 一般向けの用途は現状はほぼこれ AI ワークフローからの実行 Dify など 業務用途ではこれ
10. MCP Tool で提供した機能の使い方 将来的には: OS 組み込みAI アシスタントからの実行 Windows のMCP 対応がアナウンスされている Windows 向けの独自MCP Registry も計画されている https://www.publickey1.jp/blog/25/windowsmcpaiwindows.html
11. Web サービスの機能のMCP Tool 化のメリット ( 最重要) AI チャットから呼べる 今後、Web サービスの操作方法の一つとしてAI チャットの勢力が増すのは確実 → UI しかないと、利用窓口が減る OS 組み込みのAI アシスタントもMCP を採用するはず AI チャットやワークフロー上で、他のWeb サービスと組み合わせられる LLM が動的にWeb サービスの機能をTool の一つとして選択し、組み合わせて使え るように
12. MCP Tool 利用方法の紹介
13. Claude のMCP 連携 Anthropic のClaude はMCP 連携で一歩進んでいる Anthropic → MCP の提案元 Claude → AI チャットのサービス Web 版、Desktop 版、スマートフォンアプリ版がある Claude には 「コネクタ」 設定がある
16. リモートMCP と、ローカルMCP 「Web 」コネクタ Google Calendar 、Notion 、PayPal など リモートのMCP サーバーで動作 Claude のWeb 版でも使える 「デスクトップ拡張機能」コネクタ ファイル操作や、Chrome の操作など ローカルのMCP サーバーで動作 Claude Desktop だけで使える 俗に、前者をリモートMCP 、後者をローカルMCP と呼ぶ
17. リモートMCP と、ローカルMCP 、どっちを使う？ Web サービスの機能提供としては、リモートMCP 一択と言っていい ローカルMCP では、 デスクトップ拡張のインストールが必要 スマートフォンアプリ、Web ブラウザから実行不可 リモートMCP なら、Claude の「コネクタ」のように、 「+ 」ボタンを押すだけで連 携できる体験になる ( 多くの場合、初回利用時のWeb サービス利用の認証操作は必要)
18. MCP Tool 化したWeb サービスの利用体験
19. シナリオ例 フードデリバリーサービス ユーザーは以下の操作が可能 店舗一覧の表示 店舗のメニュー一覧の表示 注文 配達状況の確認
20. MCP Tool 一覧 list-shops ( 店舗一覧の表示) get-shop-menu ( 店舗のメニュー一覧の表示) place-order ( 注文) check-delivery-status ( 配達状況の確認)
21. Claude での利用例 ( デモ動画)
23. MCP の仕様上、Tool の実行はユーザーの許可を得るべきであると明記されている
24. Claude での利用例 AI アシスタントとの会話形式で自然に注文が可能 Tool の使用は、常に確認が入る ( 常に許可しない限り) ので安全
25. Elicitation
26. Elicitation 2025-06-18 の仕様で新たに入った機能 サーバー側からユーザーに、対話形式で、インタラクティブに情報を要求できる Tool 呼び出し時点で、情報が全て揃っていなくてもよくなった
27. Elicitation の利用例 ( デモ動画)
29. Elicitation でできること リクエスト内容に応じて、追加で要求する情報を分岐可能になった 例: ピザならトッピングをチーズ、サラミから、チキンナゲットならソースをケチ ャップ、マスタードから選択など ユーザーに要求する情報が、Tool 利用開始時点で決まっていなくてもよくなった Tool の裏側で別のAI エージェントを動かして、そこで追加要求内容を決めてもいい
30. Elicitation の課題 まだクライアントがほとんど対応していない デスクトップアプリとして使えるのはVS Code (Copilot) くらい https://modelcontextprotocol.io/clients#feature-support-matrix サーバーの実装が複雑化する Tool は単純なRequest / Response 形式だったが、その間にElicitation で取得した情 報に応じた分岐が沢山入ってしまう可能性がある
31. MCP はWeb サービス開発企業に浸透するか？
32. MCP はWeb サービス開発企業に浸透するか？ LLM からWeb サービスの機能を呼ぶ標準的な方法は実質MCP だけ 利用窓口を狭めないための機能提供が有力 既に、海外の多くの企業がMCP サーバーで機能提供している Claude のコネクタ一覧から見てとれる 自社のWeb サービスの機能のMCP Tool 化は、生成AI との相乗効果が見込める限り、検 討を進めるべき
33. まとめ Web サービスの機能をMCP Tool 化すると、AI チャットから呼べるようになる Web サービスの機能提供は、リモートMCP で行う MCP のTool は、Elicitation の仕様の追加により柔軟になった 生成AI との相乗効果を狙うなら、MCP Tool 化を進めていくべき
34. ご清聴ありがとうございました！