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
410
AIエージェントの支払い基盤 AgentCore Payments概要
kmiya84377
2
570
AG-UIとStrandsAgents・AgentCoreを<br>絡めたAIエージェント周りの話
kmiya84377
1
140
AIエージェントがUIを生成する「Generative UI」を広く浅く理解したい
kmiya84377
2
620
全てAWSで完結!AWS AmplifyとViteで始めるスモールスタートなAIエージェント開発のススメ
kmiya84377
7
7.7k
Amazon Bedrock AgentCoreのフロントエンドを探す旅 (Next.js編)
kmiya84377
2
800
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
Nav2、Nav3 ... はたまた自作?〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
yanzm
0
140
AWSとGitHub Actionsの責任境界と 組織で安全に使用する取り組み
nealle
1
240
Bet AI Day 2026丨AIを「使う」から、AIが「働く」へ ― LayerXが進める「組織AI」の社会実装
layerx
PRO
2
1.4k
AIで開発は速くなったのに、なぜ現場は楽にならないのか 〜あなたの組織のボトルネックを突き止めるワークショップ〜
jacopen
1
110
分割40%キーボードにスムーズに入門するには
hoto17296
1
210
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
20k
markdown-poster Introduction
kazamori
0
460
APIセキュリティを組織で実現するには~注力する点と設計・実装に入れたい対策~
riiimparm
3
860
本番に近いテストをもっと手軽に - Postmanで広がるAPIテストの世界 / Expanding the World of API Testing with Postman
yokawasa
1
210
Hub & Spoke 環境のネットワークルーティングを分解してみる
tsuyataku
1
500
AI駆動開発をチームに根付かせる - 「1行も書かない」チームがHarnessを育てた1年 -
kenichirokimura
6
3.6k
「面白い!」を信じ抜け。激動の時代を貫く、オンリーワン・エンジニアの条件
kizawa2020
2
630
Featured
See All Featured
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
260
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.4k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
2
410
The Cult of Friendly URLs
andyhume
79
7k
Leo the Paperboy
mayatellez
8
2.2k
4 Signs Your Business is Dying
shpigford
187
23k
Code Reviewing Like a Champion
maltzj
528
40k
How GitHub (no longer) Works
holman
316
150k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
510
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
57k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
260
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