CtrlK
BlogDocsLog inGet started
Tessl Logo

visual-qa

MUST USE after building/changing any UI or when asked whether a page, component, or TUI looks right. Rigorous visual QA across web/page and terminal UIs. Prefer browser:control-in-app-browser for unauthenticated browser/page QA in Codex, then Playwright/agent-browser/dev-browser. Captures screenshot/TUI evidence with bundled diff scripts, runs design-system/functional and visual-fidelity/CJK reviewer passes, then synthesizes a good/bad verdict. Triggers: visual QA, screenshot/pixel diff, UI looks wrong, reference fidelity, design system check, responsive check, CJK text clipping, TUI alignment, box-drawing drift.

72

Quality

88%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

81%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A highly actionable, well-sequenced skill body with strong validation feedback loops and a real, clearly-signaled reference bundle. Its main weakness is conciseness: substantial duplicated guidance and verbatim inlined prompt templates that could be offloaded to reference files.

Suggestions

Move the two full reviewer prompt templates (Pass A, Pass B) and the Step 5 reference-fidelity prompts into separate files under references/ and link to them, eliminating the largest source of inline redundancy.

Collapse the Codex Harness Tool Compatibility preamble (lines 6-27) and the repeated 'If a code block below conflicts with this section, this section wins' clauses into a single short routing note; the per-call spawn_agent translations already cover the cases.

Trim the duplicate statement of the 'reference evidence is not the verdict' principle that appears both as a Step 4 completion-gate rule and again as a closing section.

DimensionReasoningScore

Conciseness

The body is mostly efficient but carries real redundancy: the Codex harness-compatibility section repeats routing guidance already implied by the prompt blocks, 'If a code block below conflicts with this section, this section wins' appears three times, and both full oracle prompts plus the reference-fidelity prompts are inlined verbatim rather than referenced. This is more than the minor trimming the 4-anchor describes.

3 / 5

Actionability

Provides fully executable, copy-paste-ready commands ('node "$SKILL_DIR/scripts/visual-qa.mjs" image-diff <reference.png> <actual.png>', 'tui-check ... --cols N', 'agent-browser set viewport 1280 720'), complete reviewer prompt templates, and locked JSON field names covering the common web and TUI cases.

5 / 5

Workflow Clarity

A clear 5-step sequence with explicit validation checkpoints - capture hygiene validation before dispatch, a hard 'loop until an independent pass on fresh evidence' completion gate, and the [product] vs [evidence] feedback-loop distinction - matching the anchor's standard for explicit validation and error-recovery loops.

5 / 5

Progressive Disclosure

Structure is good: the body is an overview that points to the bundled scripts and to references/agent-browser-setup.md (a verified real, one-level-deep reference) with clear signaling. It is capped at 4 because the large inlined oracle-prompt templates (~150 lines) and the duplicated Codex-compat block arguably belong in separate reference files.

4 / 5

Total

17

/

20

Passed

Description

96%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong, concrete description that answers both what the skill does and when to use it, with a comprehensive explicit trigger list. Slightly capped on distinctiveness because it mixes execution-routing guidance into what should be a trigger-focused description.

DimensionReasoningScore

Specificity

Lists multiple concrete actions - 'visual QA across web/page and terminal UIs', 'Captures screenshot/TUI evidence with bundled diff scripts', 'runs design-system/functional and visual-fidelity/CJK reviewer passes, then synthesizes a good/bad verdict' - with comprehensive coverage of the domain.

5 / 5

Completeness

Clearly answers what ('Rigorous visual QA across web/page and terminal UIs... synthesizes a good/bad verdict') and when ('MUST USE after building/changing any UI or when asked whether a page, component, or TUI looks right' plus the explicit Triggers list), both with concrete trigger phrases.

5 / 5

Trigger Term Quality

The explicit 'Triggers:' list covers natural user phrases and synonyms comprehensively - 'visual QA, screenshot/pixel diff, UI looks wrong, reference fidelity, design system check, responsive check, CJK text clipping, TUI alignment, box-drawing drift' - matching the anchor's standard for synonyms and natural terms.

5 / 5

Distinctiveness Conflict Risk

It occupies a clear visual-QA niche with distinct triggers, but the description embeds execution-routing detail ('Prefer browser:control-in-app-browser...then Playwright/agent-browser/dev-browser') that is not a trigger and risks overlap with generic review/UI skills; it is mostly distinct with minor overlap risk.

4 / 5

Total

19

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
code-yeongyu/lazycodex
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.