visual-dev

Coordinate visual QA for dashboards using Patchright-based screenshot checks.

182|19|Updated Mar 23, 2026
One-click install
npx skills add https://github.com/adam-s/intercept --skill visual-dev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: visual-dev
Source: https://github.com/adam-s/intercept/tree/main/.claude/skills/visual-dev
Command: npx skills add https://github.com/adam-s/intercept --skill visual-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Visual development helps teams verify UI layouts and screenshot-driven quality for dashboards.

Core Features & Use Cases

  • Built-in loop for design, screenshot, evaluation, and iteration until issues are resolved.
  • 7-criteria visual validation, multi-viewport checks, and Patchright-driven automation for screenshots.
  • Use case: Verify that a new dashboard page renders correctly across viewports and meets layout and interaction expectations.

Quick Start

Run the visual development loop to build, screenshot, judge, fix, and re-screenshot until zero issues are identified.

Frequently Asked Questions about visual-dev

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate visual UI QA for dashboards using screenshots?

Automate visual UI QA for dashboards using a Patchright-based workflow that drives screenshot capture, evaluates layout correctness against 7 visual criteria, and iterates until zero issues remain. It collects state evidence across multiple viewports during design iterations.

What is the best way to verify dashboard layout correctness across multiple viewports?

Verifying dashboard layout correctness across multiple viewports is handled by running a visual development loop that captures screenshots at different screen sizes, evaluates them against a predefined 7-criteria visual validation, and outputs documented state evidence.

Can I use Patchright for automated screenshot-driven checks during UI development?

Yes, you can use Patchright for automated screenshot-driven checks. The Skill coordinates a Patchright-based workflow to capture screenshots, evaluate visual layouts, and iterate on design fixes until all identified visual issues are resolved.

How does the visual validation loop handle UI layout defects?

The visual validation loop handles UI layout defects by executing a continuous cycle of building, screenshotting, judging against 7 visual criteria, fixing identified issues, and re-screenshotting until the dashboard meets layout and interaction expectations with zero remaining issues.

Do I need any specific dependencies or components to run multi-viewport visual checks?

No specific dependencies or components are required to run multi-viewport visual checks. The Skill operates independently using its built-in Patchright-based workflow to perform screenshot-driven evaluations and collect evidence without external component integrations.