Unified Vision-First UI & UX Audit (audit-ui-ux)

An authoritative, vision-first audit skill that evaluates running Web and Mobile interfaces purely from captured visual pixels. It merges visual design precision (spacing, contrast, typography, tokens) and cognitive human-computer interaction (Nielsen's 10 Heuristics, scientifically grounded Laws of UX) without code inspection bias.

1. Core Mental Model: Strict Vision-First Air-Gap

The central architectural rule is the Strict Vision-First Air-Gap (references/vision-air-gap.md):

Evaluation agents must NEVER inspect application source code, DOM trees, CSS classes, or internal selectors.

Eliminating Omniscience Bias

Human users experience digital products through light emitted from display pixels, not by reading source code. When evaluators read component source files, they suffer from omniscience bias—assuming layout rules work, forgiving poor contrast, and missing visual rendering flaws. The audit evaluates purely from rendered screenshots.

Visual-Spatial Grounding Framework

To eliminate reliance on internal component names, IDs, or class names, evaluators ground every finding using dual-layer visual-spatial coordinates (references/vision-air-gap.md):

1. Directional Landmark Hierarchy: [Screen Region] > [Container Landmark] > [Relative Flow Position] > [Visual Feature Anchor] (e.g. Sticky Header > Right Utility Actions > Notification Bell Button).
2. Normalized Bounding Coordinates: Normalized percentage coordinates [top%, left%, width%, height%] and 3×3 screen quadrants ([Top-Right], [Mid-Center], etc.).