community-automations/screenshot-analyzer

DevOps & Code

PublicClaude-Subagent

Screenshot-Analyzer

Visuelle Bugs rutschen an Tests vorbei, weil technisch nichts fehlschlägt; die Seite sieht einfach falsch aus. Dieser Analyzer rendert jede URL und prüft sie so, wie ein Mensch es täte.

sonnet3 TageURLboxOpenAI VisionSlackS3
ClaudeClaude
ROI for
README.md

Warum dieser Subagent

Visuelle Bugs rutschen an Tests vorbei, weil technisch nichts fehlschlägt; die Seite sieht einfach falsch aus. Dieser Analyzer rendert jede URL und prüft sie so, wie ein Mensch es täte.

Er erstellt über URLbox einen Ganzseiten-Screenshot, übergibt ihn mit Ihrer Audit-Checkliste an ein Vision-Modell und markiert Überlauf, kaputte Bilder und schwachen Kontrast samt Stelle auf der Seite. Sie bekommen eine strukturierte Liste an Funden plus den Screenshot, praktisch für QA-Durchläufe oder die Beobachtung einer Live-Seite über die Zeit.

So läuft er

    • 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.

Beispiel-Output

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.