visual-verdict

Compare generated screenshots with reference images and return JSON pass/fail verdicts.

Updated Mar 11, 2025

Search Tags:#visual consistency #UI testing #screenshot comparison #QA verification #feedback tool

Ready to run

npx skills add https://github.com/MohammedSaudAlsahli/dotfiles --skill visual-verdict-mohammedsaudalsahli

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: visual-verdict
Source: https://github.com/MohammedSaudAlsahli/dotfiles/tree/main/ai/agents-skills/visual-verdict
Command: npx skills add https://github.com/MohammedSaudAlsahli/dotfiles --skill visual-verdict-mohammedsaudalsahli

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This skill automates the process of comparing visual UI screenshots to their reference images, providing immediate feedback for potential revisions.

Core Features & Use Cases

Visual Comparison: Automatically match and assess generated screenshots against one or more reference images.
Determined Verdict: Generates a strict JSON verdict that helps decide if a screenshot needs revisions or passes the check.
Use Case: For UI designers or developers ensuring visual fidelity of applications or web interfaces before launch.

Quick Start

Use the /visual-verdict skill with the 'generate screenshot' and 'compare with reference.png'.

Frequently Asked Questions about visual-verdict

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

FAQPage Schema

How do I automate visual consistency testing for UI screenshots?▼

Automate visual consistency testing by comparing generated UI screenshots against reference images to return a strict JSON verdict with detailed discrepancies. This validates UI fidelity and provides immediate feedback for potential revisions before launch.

What is visual verdict for UI fidelity validation?▼

Visual verdict is a strict JSON pass/fail determination generated by comparing screenshots to reference images. It automates UI fidelity validation by highlighting detailed discrepancies between the generated output and the expected design.

How do I compare generated screenshots with reference images?▼

Compare generated screenshots with reference images by processing them through the visual-verdict skill, which automatically matches the inputs and outputs a detailed JSON verdict indicating whether the UI passes or needs revisions.

Can I use screenshot comparison for QA verification of web interfaces?▼

Yes, you can use screenshot comparison for QA verification of web interfaces. The skill assesses visual consistency against one or more reference images, helping developers ensure visual fidelity before launch.

Does the screenshot comparison output a strict pass or fail verdict?▼

Yes, the screenshot comparison outputs a strict JSON verdict for pass or fail. It provides determined results alongside detailed discrepancies, helping you decide if a screenshot needs revisions or passes the check.

What are the limitations of automated screenshot comparison?▼

Automated screenshot comparison is limited to visual fidelity validation by matching pixels against reference images. It returns a JSON verdict for pass/fail and detailed discrepancies, but does not assess interactive functionality or underlying code quality.