Screenshot

未導入時の対応

勝手にインストールせず、必ずユーザーに確認を取ること。

コマンドが未導入の場合（終了コード 1）:

ユーザーに「agent-browser をインストールしてよいですか？」と確認し、許可を得てから実行する:

npm install -g agent-browser && agent-browser install

スキルが未導入の場合（終了コード 2）:

ユーザーに「agent-browser スキルをプロジェクトにインストールしてよいですか？」と確認し、許可を得てから実行する:

npx skills add vercel-labs/agent-browser --skill agent-browser --agent claude-code cursor --yes

インストール後、チェックスクリプトを再実行して全て通ることを確認する。

基本的なスクリーンショット撮影

1. 撮影前: ユーザーと撮影計画を合意する

スクリーンショットを撮る前に、必ずユーザーに以下を確認する:

• 何を撮るか: どのページ・画面のスクリーンショットか
• 何が映っていればよいか: 撮影の目的と、画像に含まれるべき内容
• 用途: PoC の記録用か、ブログ記事に掲載するか

この合意なしに撮影しない。目的が曖昧なスクリーンショットはノイズになる。

例:

ユーザーへの確認: 「Lambda 関数の一覧画面のスクショを撮ります。
デプロイした関数が一覧に表示されていることが確認できれば OK です。
ブログ記事の『デプロイ確認』セクションで使います。よろしいですか？」

2. 撮影

agent-browser open "https://example.com"
agent-browser screenshot /tmp/<説明的な名前>.png
agent-browser close

3. 撮影後: 内容の確認

撮影したら Read ツールで画像を確認し、撮影前に合意した内容が映っているか判定する:

• OK: 合意した内容が映っている → ステップ 4 に進む
• NG: 意図した内容が映っていない → 再撮影する（ページの読み込み待ち、スクロール位置の調整など）
• 不要: 撮ってみたが情報量が少ない、他の画像で代替できる → /tmp/ の画像を削除して終了

4. 機密情報チェック（自動・必須）

内容確認と同時に、画像に機密情報が含まれていないか必ずチェックする。ユーザーの指示を待たず、撮影のたびに自動で行うこと。ユーザーが機密情報の映り込みに気づいていない可能性があるため、エージェント側で能動的に確認する。

チェック対象:

• AWS アカウント ID（12桁の数字）
• メールアドレス
• IAM ユーザー名 / ロール名
• API キー / トークン / パスワード
• IP アドレス
• 個人を特定できる情報

機密情報が見つかった場合:

ユーザーに具体的に報告し、画像パスを添えてユーザー自身が確認できるようにする。その上でマスクするかどうかを確認する:

この画像に以下の機密情報が映っています:
- AWS アカウント ID（右上ヘッダー）
- メールアドレス（ユーザー名の横）

画像を確認してください: /tmp/aws-lambda-function-list.png
マスク処理しますか？

ユーザーが許可したら、マスク処理を実行する。 詳細は references/mask-sensitive-info.md を参照。

機密情報が見つからなかった場合: そのままステップ 5 に進む。

5. 保存と記録

AGENTS.md の「スクリーンショット画像」セクションに従って、正式な保存先に移動し、NOTES.md に記録する。

移動後、保存先パスをユーザーに伝えて最終確認できるようにする:

スクリーンショットを保存しました: poc/images/aws-lambda-function-list.png

AWS マネジメントコンソールのスクリーンショット

AWS マネコンのスクショは認証が必要なため、フェデレーションサインイン URL を生成してからブラウザで開く。 詳細は references/aws-console-screenshot.md を参照。 撮影後の流れ（ステップ 3〜6）は基本フローと同じ。