community-automations/screenshot-analyzer

DevOps＆コード

PublicClaude サブエージェント

スクリーンショット分析ツール

ビジュアルバグはテストをすり抜けます。技術的にはエラーが出ず、ページの見え方がおかしいだけだからです。このアナライザーは任意の URL をレンダリングし、人間が確認するようにレビューします。

sonnet3日以内URLboxOpenAI VisionSlackS3
ClaudeClaude
ROI for
README.md

このサブエージェントを選ぶ理由

ビジュアルバグはテストをすり抜けます。技術的にはエラーが出ず、ページの見え方がおかしいだけだからです。このアナライザーは任意の URL をレンダリングし、人間が確認するようにレビューします。

URLbox でページ全体のスクリーンショットを撮影し、監査チェックリストとともにビジョンモデルに渡し、はみ出し、画像の破損、コントラスト不足をページ上の位置とともに検出します。構造化された所見リストとスクリーンショットが得られ、QA の一斉点検や本番ページの経時監視に活用できます。

動作の流れ

    • Read

      Used at step 01 to kick off the pipeline.

    • Write

      Used at step 01 to kick off the pipeline.

    • WebFetch

      Used at step 01 to kick off the pipeline.

    • WebSearch

      Used at step 01 to kick off the pipeline.

出力サンプル

json
// Sample output
// (generated when the pipeline finishes)

Given a URL and viewport, capture a screenshot and return a JSON findings list of visual issues with element locations and severity.

Unlock the rest

The full agent definition, install snippet, and starter task are gated for community members.

Members get the full `.md` agent file, the npm / pnpm install one-liners, a starter prompt that we've tuned against real runs, and the open-source repo when this automation ships there. One email, magic link, done.