Kiro Web プレビュー版を触ってみた

こんにちは、サーバーワークスで生成AIの活用推進を担当している針生です。

Kiro のブラウザ版である Kiro Web がプレビュー版としてリリースされました。これまで Kiro は IDE 版と CLI 版の 2 形態で提供されてきましたが、これに加えて 3 つ目の選択肢として、ブラウザから直接使えるエージェントが登場しました。

ローカル環境を立ち上げる必要がなく、ブラウザで app.kiro.dev を開いてリポジトリを選ぶだけで、エージェントがコードを書き、PR を作成するところまで完結します。実際に触ってみたので、操作感をご紹介します。

なお本記事は AWS Identity Center 経由（組織アカウント）で Kiro を利用している前提で書いています。

Kiro Web とは

IDE 版がローカルでの対話的な開発に、CLI 版が手元のターミナルやスクリプトからの呼び出しに最適化されているのに対し、Web 版は「ローカル環境を持ち出さずに、ブラウザだけでエージェントに作業を任せたい」という用途に向いています。チャットで目的を伝えると、エージェントが Kiro 側で用意される隔離実行環境（Sandbox）の中でコードを書き、プルリクエストを開くところまで進めてくれます。

サインインからホーム画面まで

まずは app.kiro.dev にアクセスします。サインイン方法は 4 種類用意されていました。

Google
GitHub
AWS Builder ID
Your organization（AWS Identity Center 経由）

今回は組織アカウントで利用するため「Your organization」を選んで AWS Identity Center 経由でサインインします。

サインインすると画面中央にバナーが表示され、Sandbox のネットワーク設定の現状を示しています。デフォルトでは外部 Web やパッケージダウンロードが遮断された状態です。

組織アカウントは管理者による有効化が必要

最初にサインインしたところ、Send ボタンが無効化されていて、

Kiro Web is not enabled for your enterprise

というメッセージが出ました。AWS Identity Center 経由で利用する場合、管理者側で Kiro Web を有効化していないと使えません。

AWS マネジメントコンソールから Kiro の管理画面に入り、Autonomous agents をオンにすることで有効になりました。

Sandbox のネットワーク設定

ホーム画面のバナー右にある「Repository access only」をクリックすると、Sandbox のネットワークアクセスレベルを切り替えるメニューが開きます。

選択肢は 3 段階で、デフォルトが最も制限の強い「Repository access only」になっています。

Open internet: 制限なしのフルアクセス
Common dependencies: 一般的なパッケージレジストリや開発リソースに限定
Repository access only: 接続済みリポジトリのみ、外部ネットワークアクセス不可

モデルの選択

入力欄の右下の「Auto」をクリックすると、利用するモデルを切り替えられます。

リポジトリの認可は GitHub App のインストールも必要

入力欄の下にある「Select repo」を押すとリポジトリの検索ボックスが出ます。

Kiro Web は GitHub の OAuth 認証だけでなく、Kiro 専用の GitHub App をインストールしてアクセス対象のリポジトリを明示的に認可する必要があります。最初のサインイン時に OAuth 認可画面が出ます。

ここを通っただけではリポジトリは出てきません。「Settings」から「Agent」を選択して、「Install Kiro app on GitHub」からインストールします。

インストール画面でアクセスを許可する組織とリポジトリを選べば、検索ボックスに候補が出るようになります。

Agent 設定画面の全体像

Agent 設定画面には Sandbox 周りの設定が一通り揃っています。

Pull request: PR を自分のユーザー名義で作成するか、kiro-agent[bot] 名義にするかの切り替え
Data collection: Kiro Web のコンテンツを AWS のサービス改善に利用させるかの許可
Steering: コーディング規約やアーキテクチャ判断などを markdown でエージェントに渡す
Memory: エージェントが学習した内容の管理
Sandbox: Powers（MCP ツール）、Environment variables、Secrets などの設定

デフォルトモードで対話しながら進める

Autonomous トグルは OFF のまま、デフォルトモードで動かします。サンプル用の Todo アプリのリポジトリを対象に、まずは設計の相談から始めてみました。

Todo アプリにタスクのカテゴリ分類機能（例: 仕事 / プライベート / 勉強）を追加したい。実装に入る前に、UI と内部データ構造の設計案を提案してほしい。

Kiro はまず既存コードを読みに行き、データ構造・UI レイアウト・状態管理・マイグレーション方針・将来の拡張ポイントを含む設計案を返してきます。最後に「この設計でよければ実装に進みます」と確認が入るので、ここで方針を微調整したり、別案に振ることもできます。

そのまま「この設計でよさそうです。実装してください。feature ブランチを切って、PR まで作ってください。」と返すと、feature ブランチを切って実装、コミット、push、PR 作成までを一気に進めてくれました。

完了時には画面右に「Reviews」パネルが現れ、このセッションで作られた PR がそのまま並びます。PR の説明文には、PR コメントで /kiro fix と書けば指定したフィードバックの修正を、/kiro all で全コメントの修正をそれぞれ依頼できる旨の案内も添えられていました。

設計フェーズと実装フェーズを合わせて、所要時間は約 2 分 40 秒でした。

Autonomous モードで自走させてみる

今度は Autonomous トグルを ON にして、明確なお題を投げてみます。

なお、Autonomous モードではエージェントがモデルを自動選択するため、ユーザー側でモデルを指定することはできません。

Todo アプリにタスクをドラッグ&ドロップで並び替えできる機能を追加してください。並び順は localStorage にも保存してください。feature ブランチを切って PR を作成してください。

Autonomous モードではオーケストレーター型の構成になっており、親エージェントがタスクの複雑さに応じて自分でやるか coder サブエージェントに委任するかを判断します。今回は「既存の HTML/CSS/JS ファイルへの変更で完結する明確なタスクなので、coder に直接委任します」と判断し、子エージェントへ Task / Context / Requirements の構造で指示を出していました。