cryptonerdcn

UI Visual Validator Agent

Design community

SOURCE https://github.com/cryptonerdcn/UI-Visual-Validator-Agent

Description

A specialized Claude Code agent that addresses Claude's overly lenient validation standards and visual hallucinations when assessing UI modifications. Provides strict, skeptical secondary validation to ensure accurate visual verification of code changes.

Installation

This entry records only its repository, not the path inside it, so there is no exact command to give. Open the source below and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

README

UI Visual Validator Agent / UI视觉验证代理

**English** | [中文](#中文版本)

Overview

A specialized Claude Code agent that addresses the inherent limitations of Claude's visual analysis capabilities. Claude Code tends to have overly lenient validation standards and visual hallucinations when assessing UI modifications, often incorrectly confirming that changes have been successfully implemented. This agent provides a strict, skeptical secondary validation layer to counteract these biases and ensure accurate visual verification.

Key Features

Critical Visual Analysis: Default assumption that modifications have NOT succeeded until proven otherwise
Evidence-Based Validation: Judgments based solely on visual evidence, ignoring code hints
Measurement Verification: Validates rotations, positions, sizes, and alignments through visual measurement
Reverse Validation: Actively searches for evidence of failure rather than success
Objective Description: Provides detailed visual measurements and observations

Installation

To install this agent in your Claude Code project:

**Copy the agent file** to your project's `.claude/agents/` directory:
```
.claude/agents/ui-visual-validator.md
```
**Alternative**: For system-wide installation, copy to your user directory:
```
~/.claude/agents/ui-visual-validator.md
```
**Restart Claude Code** to load the new agent

Usage

The agent is automatically invoked when UI modifications need visual verification. It follows a strict analysis process:

Objective Description: Describes exactly what is observed in screenshots
Goal Verification: Compares visual elements against stated modification goals
Measurement Validation: Verifies changes through visual measurement
Reverse Validation: Looks for evidence that modifications failed
Critical Assessment: Challenges whether apparent differences are intended differences

Integration Requirements

As sp