community-automations/screenshot-analyzer

DevOps 與程式碼

PublicClaude 子代理

截圖分析器

視覺上的 bug 會溜過測試,因為技術上什麼都沒出錯——頁面只是看起來不對。這個分析器會轉譯任何 URL,像真人一樣去檢視它。

sonnet3 天URLboxOpenAI VisionSlackS3
ClaudeClaude
ROI for
README.md

為什麼選擇此子代理

視覺上的 bug 會溜過測試,因為技術上什麼都沒出錯——頁面只是看起來不對。這個分析器會轉譯任何 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.