skills.rest
eaglhuang
eaglhuangCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-preview-judge

Compare UI previews against reference proofs and export zone verdicts.

3|Updated Mar 6, 2026
Search Tags:#automation#ui#screenshots#qa#diff#visual-review#proof-drafts
One-click install
npx skills add https://github.com/eaglhuang/cocos_new --skill ui-preview-judge
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-preview-judge
Source: https://github.com/eaglhuang/cocos_new/tree/main/.github/skills/ui-preview-judge
Command: npx skills add https://github.com/eaglhuang/cocos_new --skill ui-preview-judge

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the visual comparison between Cocos Editor Preview screens and reference proofs, enabling consistent, repeatable UI verification for asset QC.

Core Features & Use Cases

  • Zone-based verification: compares per-zone layout, typography, color, and spacing against design references.
  • Automated verdicts: generates runtime-verdict.json with confidence scores and PASS/FAIL status, plus a captured preview screenshot.
  • Workflow integration: fits into a UI asset QA pipeline by consuming proof drafts and producing structured outputs for review.

Quick Start

Run the ui-preview-judge skill to compare the current Editor Preview against the reference draft and generate a visual verdict.

Frequently Asked Questions about ui-preview-judge

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

FAQPage Schema
How do I automate visual comparison between Cocos Editor Preview screens and design proofs?▼

Automate visual comparison by loading reference proof drafts and capturing editor preview screenshots to generate a structured runtime-verdict.json with zone-by-zone PASS/FAIL status and confidence scores.

What is zone-based UI verification for asset QC?▼

Zone-based UI verification compares per-zone layout, typography, color, and spacing of editor previews against design references to produce structured verdict data for repeatable asset QC.

How do I generate a runtime-verdict.json file for UI visual review?▼

Generate a runtime-verdict.json file by running an automated visual review skill that compares preview screenshots against loaded proof drafts and exports the structured verdict data with confidence scores.

Does automated UI visual review work with Cocos Editor Preview and proof drafts?▼

Yes, automated UI visual review works with Cocos Editor Preview by consuming proof drafts, capturing screenshots via the cocos-screenshot workflow, and exporting structured verdict data and a preview image.

Can I integrate visual review verdicts into an existing UI asset QA pipeline?▼

Yes, you can integrate visual review verdicts into a UI asset QA pipeline by consuming proof drafts as inputs and outputting structured runtime-verdict.json data and captured preview screenshots for downstream review.

What's the best way to capture Cocos Editor Preview screenshots for visual diff comparison?▼

The best way to capture Cocos Editor Preview screenshots for visual diff comparison is using the cocos-screenshot workflow, which feeds the captured preview image into an automated zone-by-zone verification process against reference proofs.

Related Skills

Explore More Design & Creative Skills→
eaglhuangeaglhuang
3

cocos-screenshot

Capture the Cocos Creator Editor window as a PNG via PowerShell.

Community
Intermediate
berlinguyincaberlinguyinca
3

autospec-release

Compute deterministic PASS/PARTIAL/FAIL release verdicts from QA evidence.

Community
Advanced
eaglhuangeaglhuang
3

ui-runtime-verify

Refresh Cocos asset-db, run UI validation scripts, and produce runtime-verdict artifacts.

Community
Intermediate
NITISH-gitbitNITISH-gitbit

p5js

Generate interactive visual art and data visualizations with p5.js.

Community
Advanced