Claude CodeのAgent TeamでNext.jsサイトをレビューさせてみた
この記事の操作
Claude CodeのAgent Teamを使ってみたかったので、サイトのレビューをさせてみました。
バージョンやモデル情報
% claude
Claude Code v2.1.38
▗ ▗ ▖ ▖ Sonnet 4.5 · Claude Pro
~/development/my-services/sites/stripe-apps.hidetaka.dev
▘▘ ▝▝ Opus 4.6 is here · Most capable for ambitious work ためしたプロンプト
今回はとてもシンプルなプロンプトで、自律的にどこまでやるか試してみました。
このアプリをマーケティングチーム・デザインチーム・UXチームなど、必要なチームメンバーを組織してレビューを実施せよ
指示を出すと、チーム作成が始まります。
❯ このアプリをマーケティングチーム・デザインチーム・UXチームなど、必要なチームメンバーを組織してレビューを実施せよ
⏺ このアプリケーションの包括的なレビューを実施するため、専門チームを組織します。
⏺ チームを作成しました。次に、各専門分野のレビュータスクを作成します。
✶ Perambulating… (thinking)
⎿ ◻ マーケティング観点でアプリをレビュー 作業の様子を観察する
かなりざっくりした指示でしたが、６チーム（Agent）が起動しています。コンテンツ・アクセシビリティ・テクニカルの３レビューチームはClaude側の判断で追加されました。
⏺ タスクを作成しました。次に、各専門分野の担当者をスポーンします。
⏺ 6 agents launched (ctrl+o to expand)
├─ @marketing-specialist (Explore)
│ ⎿ マーケティングレビュー実施 (shift+↑ to manage)
├─ @design-specialist (Explore)
│ ⎿ デザインレビュー実施 (shift+↑ to manage)
├─ @ux-specialist (Explore)
│ ⎿ UXレビュー実施 (shift+↑ to manage)
├─ @content-specialist (Explore)
│ ⎿ コンテンツレビュー実施 (shift+↑ to manage)
├─ @a11y-specialist (Explore)
│ ⎿ a11yレビュー実施 (shift+↑ to manage)
└─ @technical-specialist (Explore)
⎿ テクニカルレビュー実施 (shift+↑ to manage)
✢ Perambulating… (1m 29s · 267.1k tokens · thinking)
⎿ ◻ マーケティング観点でアプリをレビュー
◻ デザイン観点でアプリをレビュー
◻ UX観点でアプリをレビュー
◻ コンテンツ戦略をレビュー
◻ アクセシビリティをレビュー
◻ テクニカルSEOとパフォーマンスをレビュー
────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
❯
────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
@main @a11y-specialist @content-specialist @design-specialist @marketing-specialist @technical-specialist @ux-specialist · shift+↑ to expand 1
esc to interrupt · ctrl+t to show teammates agent
ただチームを作るだけでなく、各チームがレビューすべき内容やタスクの割り当ても行われています。
⏺ 🎯 レビューチーム組織完了
Revtrona の包括的レビューのため、以下の6人の専門家チームを組織しました：
チームメンバーとタスク割り当て
1. 📊 マーケティングスペシャリスト (marketing-specialist)
- メッセージング戦略とブランドポジショニング
- SEO実装（メタタグ、sitemap、構造化データ）
- コンテンツマーケティングとユーザー獲得
- アナリティクス実装（GA4、Clarity）
2. 🎨 デザインスペシャリスト (design-specialist)
- ビジュアル階層とレイアウト
- デザインシステムとカラーパレット
- ダークモード実装
- コンポーネント設計と一貫性
3. 👤 UXスペシャリスト (ux-specialist)
- 情報アーキテクチャとナビゲーション
- ユーザージャーニーとフロー
- インタラクション設計
- モバイルUXとコンテンツ発見性
4. ✍️ コンテンツストラテジスト (content-specialist)
- コンテンツ構造と多言語戦略
- WordPress/microCMS統合
- コンテンツ鮮度管理
- マイクロコピーとRSS戦略
5. ♿ アクセシビリティスペシャリスト (a11y-specialist)
- WCAG準拠評価
- セマンティックHTMLとARIA
- キーボードナビゲーション
- スクリーンリーダー対応
6. ⚡ テクニカルスペシャリスト (technical-specialist)
- テクニカルSEOとメタデータ
- パフォーマンス最適化
- Core Web Vitals
- Cloudflare Workersデプロイメント
---
全メンバーが現在、各担当領域の詳細レビューを実施中です。完了次第、統合レポートを作成してお届けします。チーム組成とタスク割り振りでだいたいProプランの20-30%を消費
各チームの作業が始まった頃に使用量をチェックしたところ、画像のように37%まで到達していました。実際の作業が始まっている状態なのでもうちょっと割り引いて、Proプランの20-30%がAgent Team組成に消費される様子かなと思います。
このあたりはKiroのSpecやspec-kit / CodeRabbitのplanモードなどでタスクや計画をある程度固めておくことで減らせるかもしれません。
レビュー結果はチームごとに届く
並列実行なので、レビューが終わったチームからレポートが届きます。
@ux-specialist❯ UXレビュー完了 - 包括的な評価レポート提出
⏺ 優れたUXレビューレポートを受け取りました！ux-specialistが詳細な分析を完了しました。
📊 進捗状況（1/6 完了）
✅ UXスペシャリスト - レビュー完了
- 🟢 強み：情報アーキテクチャ、レスポンシブデザイン
- 🔴 P0課題：言語切替の視認性、検索機能欠如、Pagination多言語対応
- 📈 改善により30-50%のタスク完了時間短縮が見込まれる
⏳ 残りのチームメンバー（作業中）
- 📊 マーケティングスペシャリスト
- 🎨 デザインスペシャリスト
- ✍️ コンテンツストラテジスト
- ♿ アクセシビリティスペシャリスト
- ⚡ テクニカルスペシャリスト
他のメンバーからのレポートが届き次第、統合レポートを作成します。
@design-specialist❯ デザインレビュー完了 - 詳細な分析と改善提案
⏺ 2つ目のレポートが到着しました！design-specialistが詳細な分析を完了しました。
📊 進捗状況（2/6 完了）
✅ UXスペシャリスト - レビュー完了
- 主要課題：言語切替、検索機能、Pagination多言語対応
✅ デザインスペシャリスト - レビュー完了
- 🎨 総合スコア：7.1/10
- 🟢 強み：レスポンシブデザイン、タイポグラフィ、ダークモード なお、６つめのレビューについてだけは詳細が出力されませんでした。この辺りは具体的に指示をしないとブレがあるのかもしれません。
@content-specialist❯ コンテンツ戦略レビュー完了
@design-specialist❯ タスク#2完了済み - レビュー報告書送信済み
@a11y-specialist❯ アクセシビリティレビュー完了 - WCAG準拠状況と改善提案
⏺ 全レポートが到着しました！全チームメンバーのレビューが完了しました。
...サマリーなどがこの時点で出てきます。
⏺ 🎉 全レビュー完了！統合レポートを作成します
---
📊 Revtrona 包括的レビュー統合報告書
エグゼクティブサマリー
6名の専門家チームによる徹底的なレビューの結果、Revtronaは堅実な技術基盤とコンテンツ戦略を持つ高品質なプラットフォームであることが確認されました。
しかし、SEO・パフォーマンス・UXの重要な改善機会が特定されました。
...面白かったのが、レビュー結果を表示した後にチームの解散指示まで行われていたことでしょうか。エージェントの停止指示だとは思うのですが、表現が面白いですね。
@content-specialist❯ タスク #4 完了報告
⏺ 素晴らしい！全チームメンバーのレビューが完了しました。統合レポートも作成完了です。
それでは、チームメンバーに感謝の意を伝え、正式にシャットダウンします。
✻ Worked for 6m 9s
⏺ ✅ レビュープロジェクト完了
全6名の専門家チームによる包括的なレビューが完了しました！ 最終報告が届く
Claude Code曰く１５分でレビューは完了しました。改善点やアクションプランまで整理してくれるので、そのまま提出できるかはともかく個人で把握する分には充分かなという印象です。
⏺ 🎉 レビュープロジェクト完了・チーム解散
revtrona-review チームが正常にシャットダウンし、クリーンアップされました。
📋 プロジェクトサマリー
期間: 約15分
チームメンバー: 6名の専門家
成果物:
- 6つの詳細な専門分野別レポート
- 1つの統合レビュー報告書
- 優先度付きアクションプラン（P0〜P2）
🎯 最重要な発見
1. 即効性の高い改善（P0） - 5.5時間の投資で：
- Open Graph/Twitter Cards実装 → SNSトラフィック +30〜50%
- hreflangタグ → 国際SEO改善
- ブランドURL統一 → SEO混乱解消
- スキップリンク → WCAG準拠
2. 戦略的改善（P1） - 30時間の投資で：
- Next.js Image導入 → LCP 2〜3秒改善
- JSON-LD構造化データ → 検索CTR +10〜20%
- 検索機能実装 → ユーザー体験大幅向上
- カラーシステム統一 → デザイン品質 7.1 → 9.0+点
📊 期待される総合効果
- オーガニックトラフィック: +80〜150%
- コンバージョン率: +15〜25%
- Core Web Vitals: 合格
- WCAG準拠: Level AA達成
- デザイン品質: +27%向上
💡 推奨される次のアクション
上記の統合レポートの 「🔴 P0: 今週中」セクション
から着手されることを強くお勧めします。わずか半日の作業で、サイトのパフォーマンスとトラフィックを劇的に改善できます。
ご質問や、特定の改善項目の実装サポートが必要でしたら、いつでもお声がけください！消費トークンですが、６チームメンバーのレポート（Sonnet 4.5モデル利用）で消費量が70％ほどでした。ここから作業をさせるのはProプランでは現実的ではないかもしれません。
レポートをissueにし、CodeRabbitで整理する
自分のClaudeアカウントではタスクをそのままやらせると制限値を超えそうなので、ひとまずGitHub Issueにまとめておきます。
とはいえ複数の改善項目が１つのIssueにまとまっている状態なので、整理しましょう。自分の場合はProプランを契約しているCodeRabbitを使います。まず内容をチェックしてレポートさせました。
５分くらいでレビューのレビューができます。内容自体はあまりこだわりがなく、レポートがCodeRabbitのコンテキストに（おそらく）載っている状態かなということでよしとします。
あとはCodeRabbitにメンションしてIssueの作成を依頼します。
数分待つと作成してくれます。
内容をチェックすると、レポートの内容などもそこまで抜け漏れなく反映されていることがわかります。
作業自体は小分けにしてClaude Codeへ
あとはClaude Code on the Webに渡して作業を指示します。ここでClaude Code on the Webを使うのは、Rate Limit解除後の作業再開をどこからでもやれるようにするためです。issueごとにセッションを詰めておくことで、解除後に好きな場所（スマホ・PC）から作業を再開できるようになります。
やってみて
個別セッションに作業をやらせるのでもいい気はしますが、ざっくりとした指示でもある程度組織的に行動してくれている感じが個人開発者としていいなと思いました。今回はレビューだけでしたが、実際の作業なども上手く分担してできるかもしれません。テストなどでしょうか。
さらに深く探求する
このトピックに興味を持ちましたか？関連する記事やプロフィールをご覧ください。
⭐ この記事への反応
はてなアカウントでスターを付けることができます
関連記事
Claude Code on the Webではまだ、Agent Teamはうまく動かないらしい
Claude Codeによる複数のエージェントを駆使したタスク実行を実現できるAgent Team機能が2026/2にベータリリースされました。ベータ機能の組み合わせになるのでダメな予感はしていましたが、せっかくなので同 […]
生成AIは開発者の自己学習を加速する
lacolacoさんのブログが面白かったので、最近あった自分の体験をちょっと共有したいなと思います。 若手開発者の育成がAIによってむしろ有益になる理由 スキルの低い開発者にAIで下駄を履かせて生産性を補強するということ […]
AIコーディングでレビュワーとコーダーの戦いをみる
AIによるコーディングとレビューを行っていると、たまに意見の衝突を見かけます。ちょっと面白かったので、スクショでまとめてみました。 以下の記事でもAIによるコードレビューの紹介がありましたが、個人開発の方でも同じようにC […]