SkillsAdd

smithery/blacktop

screenshot-analyzer

Find and analyze screenshots from ~/Downloads/Screenshots/ for UI/UX review.

Installation

$ npx skills add smithery/blacktop --skill screenshot-analyzer
View on skills.sh ↗ Website ↗

Summary

  • Find and analyze screenshots from ~/Downloads/Screenshots/ for UI/UX review.
  • Use when asked to look at screenshots, review UI designs, inspect interface errors, analyze layout issues, or examine visual problems.
  • Triggers on "check my latest screenshot", "review my UI", "analyze this screen capture".

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

agent-browser Shared topics
vercel-labs/agent-browser

Browser automation CLI for AI agents. Use when the user needs to interact with websites, includ…

810.4K installs
azure-diagnostics Shared topics
microsoft/azure-skills

Debug Azure production issues on Azure using AppLens, Azure Monitor, resource health, and safe …

568.9K installs
azure-validate Shared topics
microsoft/azure-skills

Pre-deployment validation for Azure readiness. Run deep checks on configuration, infrastructure…

567.7K installs
supabase-postgres-best-practices Shared topics
supabase/agent-skills

Postgres best practices maintained by Supabase, for Postgres running anywhere. Load this skill …

391.6K installs
screenshot Similar name
openai/skills

Use when the user explicitly asks for a desktop or system screenshot (full screen, specific app…

5.2K installs
update-screenshots Similar name
microsoft/vscode

Update the committed blocks-ci screenshot hashes after the "Screenshots & Tests" check fails, o…

2.6K installs

Also in this package

Other skills from smithery/blacktop.

npx skills add smithery/blacktop
rust-profiling 0 ratatui-tui 0 apple-native-dev 0

Browse all from smithery/blacktop

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,281 B
  • docs SUMMARY.md 327 B

History

  1. First recorded snapshot · 0 installs

SKILL.md

Screenshot Analyzer

Find and analyze screenshots from ~/Downloads/Screenshots/ with focus on UI/UX review.

Workflow

1. Find Screenshots

List recent screenshots sorted by modification time:

ls -t ~/Downloads/Screenshots/*.png | head -5

Adjust -5 to show more/fewer files as needed.

2. Read and Analyze

Use the Read tool to view the screenshot image:

Read: ~/Downloads/Screenshots/<filename>.png

The Read tool renders images visually for analysis.

3. UI/UX Review Checklist

When analyzing, evaluate:

Visual Hierarchy

  • Clear focal points and content prioritization
  • Logical flow of information
  • Appropriate use of size, color, and spacing to guide attention

Layout & Spacing

  • Consistent margins and padding
  • Proper alignment of elements
  • Balanced whitespace usage

Typography

  • Readable font sizes and line heights
  • Appropriate font choices and hierarchy
  • Sufficient contrast for legibility

Color & Contrast

  • WCAG-compliant contrast ratios
  • Consistent color palette
  • Meaningful use of color (not just decorative)

Interactive Elements

  • Clear affordances for buttons/links
  • Visible focus states
  • Appropriate touch/click target sizes

Error States & Feedback

  • Clear error messaging
  • Helpful guidance for resolution
  • Appropriate visual indicators

Consistency

  • Consistent patterns across similar elements
  • Adherence to design system (if applicable)
  • Predictable interaction patterns

Output Format

Structure findings as:

## Screenshot Analysis: <filename>

### Summary
[1-2 sentence overview of what the screenshot shows]

### Findings

#### Strengths
- [Positive observation 1]
- [Positive observation 2]

#### Issues
- **[Issue Type]**: [Description] → [Suggested fix]
- **[Issue Type]**: [Description] → [Suggested fix]

### Priority Recommendations
1. [Most critical fix]
2. [Second priority]
3. [Third priority]