# Review Visual Outputs Automatically

Visual issues are easy to miss when an AI creates pages, documents, or presentations. This skill captures previews, checks design details, and guides focused fixes.

## Install

```bash
npx skillstore add barry-liu-888/visual-reviewer
```

## Metadata

- Status: approved
- Slug: barry-liu-888-visual-reviewer
- Skillstore revision: r1
- Version status: missing
- Tree hash: 5ffcfad1a499647199bc9219ba3bc686f61f1663e658007b3f2e04662274ea9c
- Author: Barry-Liu-888
- GitHub username: Barry-Liu-888
- License: MIT
- Repository: https://github.com/Barry-Liu-888/ai-skills/tree/master/visual-reviewer
- Ref: c4231f0153ccd2a2ed62274c5a372bf8f2386d3f
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: confirmation\_required
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: external\_commands, filesystem, network
- Quality score: 38
- Quality tier: warning
- Public page: https://skillstore.pages.dev/skills/barry-liu-888-visual-reviewer
- Manifest: https://skillstore.pages.dev/api/skills/barry-liu-888-visual-reviewer/manifest

## Capabilities

- Defines screenshot workflows for HTML pages, documents, presentations, and visible application windows.
- Includes Python and PowerShell scripts for fullscreen, active window, named window, process, and region captures.
- Uses a checklist for layout, spacing, typography, color contrast, interaction states, data display, and edge cases.
- Provides a repair loop that asks the agent to inspect, modify, and re-check visual changes.
- Documents local preview steps for serving static HTML during visual review.
- Provides a structured visual review report template with severity and status fields.

## Use Cases

- Validate Generated UI: Catch layout, spacing, and responsive defects after AI-assisted UI changes.
- Review Client Documents: Inspect exported documents or presentations for typography, spacing, and color issues before delivery.
- Check Internal Dashboards: Verify tables, charts, empty states, and loading states in internal tools.

## Prompt Templates

### Review a Page

```
Open the generated HTML page, capture the target preview window, and report visible layout, spacing, typography, and color issues.
```

### Fix Visual Defects

```
Review the current UI screenshot, identify the top three visible defects, apply safe style fixes, and re-check the result.
```

### Compare Responsive States

```
Capture the page at mobile, tablet, and desktop widths. Compare alignment, overflow, touch targets, and readable hierarchy.
```

### Audit a Complex Workflow

```
Review the dashboard through normal, loading, empty, error, and long-content states. Fix visual defects and summarize remaining risks.
```

## Limitations

- The screenshot scripts target Windows desktop APIs and may not work on other platforms.
- Python dependencies such as mss and pygetwindow must be installed before scripted capture works.
- Fullscreen and active window capture can include sensitive information outside the intended artifact.
- It does not replace automated browser tests, accessibility audits, or human design approval.

## Best Practices

- Capture only the target artifact window whenever possible.
- Review the screenshot before changing code, then verify again after each fix.
- Keep visual fixes scoped to layout, style, and presentation unless the user asks otherwise.

## Anti Patterns

- Do not use fullscreen capture when a window or region capture is enough.
- Do not serve broad project directories over a local HTTP server.
- Do not change business logic while fixing visual presentation issues.

## Security Audit

- Audited at: 2026-07-06T03:44:31.161\+00:00
- Summary: The audit confirms real privacy and execution risks: the skill directs agents to run local screenshot scripts, capture windows or screen regions, start a local HTTP server, and collect process metadata. Many markdown backtick and entropy findings are false positives from documentation formatting and readable Chinese markdown. Because the workflow auto-triggers visual capture, publication should require confirmation, scoped capture, and safer local preview defaults.

## Stats

- Views: 12
- Downloads: 8
- Favorites: 0
- Popularity score: 0