Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
StrandsAgentsで構築したAIエージェントにMCP Apps機能を追加してみた
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
たけのこ
February 14, 2026
Technology
240
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
StrandsAgentsで構築したAIエージェントにMCP Apps機能を追加してみた
たけのこ
February 14, 2026
More Decks by たけのこ
See All by たけのこ
Generative UI × A2UI で AI エージェントを作った話 AI-DLC も使ってみた!
kmiya84377
1
400
AIエージェントの支払い基盤 AgentCore Payments概要
kmiya84377
2
540
AG-UIとStrandsAgents・AgentCoreを<br>絡めたAIエージェント周りの話
kmiya84377
1
130
AIエージェントがUIを生成する「Generative UI」を広く浅く理解したい
kmiya84377
2
580
全てAWSで完結!AWS AmplifyとViteで始めるスモールスタートなAIエージェント開発のススメ
kmiya84377
7
7.7k
Amazon Bedrock AgentCoreのフロントエンドを探す旅 (Next.js編)
kmiya84377
2
790
Amazon Q Developer for GitHubとAmplify Hosting でサクッとデジタル名刺を作ってみた
kmiya84377
0
3.8k
AWS_Amplify_AI_Kitで始めるRAGアプリ開発.pdf
kmiya84377
0
2.9k
Other Decks in Technology
See All in Technology
今こそ聞きたいソフトウェア設計 ドメイン駆動設計再入門
masuda220
PRO
17
7.3k
FDEの心得
noriakioji
4
5.5k
生成 AI の基礎 〜 サンプル実装で学ぶ基本原理
enakai00
7
4.4k
【CEDEC2026】『ウマ娘 プリティーダービー』 英語版のキャラクターの方言や口調をローカライズするための創造的アプローチ
cygames
PRO
2
760
Breaking the Seal: Static Deobfuscation of Compiled V8 JavaScript Bytecode Malware
hshrzd
0
750
侵入は突然に 〜 IoTマルウェアと悪用される家庭の機器 ~ / When Intrusion Strikes: IoT Malware and the Abuse of Home Devices
nttcom
0
2.2k
Bill One 開発エンジニア 紹介資料
sansan33
PRO
7
19k
Data Hubグループ 紹介資料
sansan33
PRO
0
3.2k
事業価値と Engineering 2026年度版
recruitengineers
PRO
49
23k
カートの信頼性を担保するWireMockを使ったe2eテスト
ykagano
0
260
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
19k
SO-101×VLAによる3色キューブのピック&プレース
abeja
0
200
Featured
See All Featured
A designer walks into a library…
pauljervisheath
211
24k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.5k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.1k
How GitHub (no longer) Works
holman
316
150k
Balancing Empowerment & Direction
lara
6
1.2k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.6k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
200
Java REST API Framework Comparison - PWX 2021
mraible
34
9.6k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
480
Transcript
StrandsAgents で構築した AI エージェントに MCP Apps 機能を追加してみた 2026/2/13( 金) 第47
回 JAWS-UG 札幌 勉強会 コンテナ特集! 宮崎 健太 ( たけのこ) 1
宮崎 健太 ( たけのこ) 業務: Web フロント開発 or 最近はAWS メイン 所在地: 札幌
趣味: ゲーム、お酒( クラフトジン) 好きなAWS サービス: ・AWS Amplify ・Amazon Bedrock AgentCore X :@K5ARULtkUA4594 自己紹介 2
話すこと Generative UI や MCP Apps 周りの概要の話 StrandsAgents で構築したAI エージェンにMCP
Apps を追加する話 話さないこと AI エージェントやMCP Apps の業務活用など応用的な話 話すこと / 話さないこと 3
1. Generative UI と 実装アプローチ (MCP Apps / A2UI) 2.
AWS におけるAI エージェント開発 3. AWS を活用したAI エージェント+MCP Apss 構築例 4. まとめ アジェンダ 4
Generative UI と 実装アプローチ 5
AI が動的にユーザーインターフェース(=UI) を生成するという手法 ・従来の課題:AI とテキストベースの対話は、ユーザーの手間が多く体験が悪い ・解決する方法:AI とユーザーがUI を介して対話する → 場所が知りたい:地図で表示
→ 統計が知りたい:グラフで表示 Generative UI とは 6
① MCP Apps ・ 2026 年1 月26 日にリリースした公式のMCP 拡張によるアプローチ ・
MCP のプリミティブであるTool とResource が拡張されている ・ Tool の実行結果をもとに、Resource でTool に紐づくUI を表示する ② A2UI ・ AI がJSON 形式でUI 定義を生成する宣言的UI プロトコルによるアプローチ ・ 2/13 時点でv0.8 のプレビュー公開状態 ・ Google 開発なのでAngular 、Flutter あたりが対応済み / React は対応中 AI エージェントにGenerarive UI を実装する2つのアプローチ 7
MCP Apps のざっくりとした流れ 8
AWS におけるAI エージェント開発 9
StrandsAgents ・AWS が提供するAI エージェントを構築するためのSDK Amazon Bedrock AgentCore ・AI エージェントをAWS 上で構築/
運用できるマネージドサービス ・Runtime を使うことで、MCP サーバー、AI エージェントをホスト可能 AWS 上でAI エージェントを構築するための仕組み 10
・CopilotKit は、AI エージェントと統合してアプリ構築するためのフレームワーク ・StrandsAgents にも対応しており、フロントエンドとAG-UI で通信が可能 ・AG-UI は、フロントエンドとエージェントが非同期で通信するプロトコル CopilotKit と
StrandsAgents によるAI エージェント構築 11
・MCP Apps に対応したMCP サーバーに接続すれば、CopilotKit がいい感じに処理する CopilotKit はMCP Apps に対応 12
AWS を活用した AI エージェント+MCP Apss 構築例 13
Amazon Bedorck AgentCore と AWS Amplify で構築 14
まとめ 15
・費用 対 効果 を考えると、まずはテキストベースのAI エージェントで始める → 費用:学習コスト + システムとしての複雑性... → 効果:ユーザー体験の向上! ...
本当に求められてる? ・ニーズやサービスの限界を感じたらGenerative UI の実装を検討する → ニーズ:ユーザーの声を聞く → 限界:機能要件をテキストベースでは満たせない ・Generative UI にも複数のアプローチがあり、選定が必要 → 主に MCP Apps 、A2UI のいずれを選択するか どうやってシステムに組み込んでいくか 16
・ Generative UI を組み込めばユーザー体験が向上が狙える ・ MCP Apps というMCP の拡張が登場し、Generative
UI が実装しやすくなった ・ 現状、 「MCP Apps 」と「StrandsAgents 」と組み合わせるならCopilotKit が必要 ・ CopilotKit やMCP サーバーの追加が必要なので、どうしてもシステムは複雑になる ・ 「複雑になることによるデメリット」vs 「ユーザー体験のメリット」で決めていく まとめ 17
ありがとうございました!! 18