CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

ui

Produces distinctive production UI and screenshot-grounded visual polish. Use when building or restyling pages, components, or typography. Not for backend logic or data pipelines.

Quality

91%

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

92%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 well-engineered instruction skill: opinionated and concrete guidance, a clearly gated workflow with validation checkpoints, and exemplary progressive disclosure that pushes the 31KB reference material into conditionally loaded files. The only meaningful improvement space is trimming restated routing and ban rules scattered across sections.

DimensionReasoningScore

Conciseness

The body is dense rule-bearing prose with no explanation of concepts Claude already knows, and heavy detail (31KB design reference, mode files) is correctly offloaded to references. It is not a 5 because several rules are stated more than once (routing logic appears in both the Mode Picker and the Chinese gut-feel paragraph; bans recur in Hard Rules and the AI Slop Test) and a few long paragraphs could be tightened.

4 / 5

Actionability

For an instruction-only skill the guidance is fully concrete: five named direction dimensions with resolution rules, exact reference-site properties to extract ("button radius philosophy, surface depth treatment, accent color family"), exact token filenames to read ("theme.ts, colors.ts, tokens.css, _variables.scss"), named viewport states to test ("minimum width, minimum height, their combination, and normal size"), and a gotchas table with specific fixes. This matches the top anchor once the instruction-only adaptation is applied.

5 / 5

Workflow Clarity

The sequence is explicit and gated: mode pick, direction lock ("Do not write code until all five are resolved"), three-line thesis, build, aesthetic review with the AI Slop Test, viewport verification, handoff, stop. Validation checkpoints and feedback loops are present ("If any check fails, fix first"; a contradictory answer "must be resolved before that deliverable proceeds"), and the fallback when the host cannot render is named.

5 / 5

Progressive Disclosure

The body is an overview that splits detail into seven real, one-level-deep reference files, each loaded under a stated condition via the mode-picker table and exception routes. All referenced paths exist in references/, and named sections cited from design-reference.md ("App shell rules", "Absolute Bans", "Options Guide", "Aesthetic Review Checks") are present in that file, making navigation easy.

5 / 5

Total

19

/

20

Passed

Description

87%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 description: third-person, concise, with an explicit Use-when clause covering concrete objects and an explicit negative boundary. The only softness is that a few capability words ("distinctive", "visual polish") lean abstract rather than enumerating actions.

DimensionReasoningScore

Specificity

"building or restyling pages, components, or typography" plus "screenshot-grounded visual polish" lists several concrete actions across multiple object types, matching the several-specific-actions anchor. It stays below 5 because "distinctive" and "visual polish" are partially abstract claims rather than enumerated capabilities.

4 / 5

Completeness

It explicitly answers both parts: the what ("Produces distinctive production UI and screenshot-grounded visual polish") and an explicit "Use when building or restyling pages, components, or typography" clause with concrete trigger objects. This matches the anchor that clearly answers both with concrete trigger phrases; score 4 would require the when-clause to be less explicit than it is.

5 / 5

Trigger Term Quality

Natural trigger terms are present ("building", "restyling", "pages", "components", "typography", "UI"), so users phrasing a UI request would plausibly match. Common variations such as "design", "frontend", or "make it look good" are missing, keeping it short of comprehensive synonym coverage.

4 / 5

Distinctiveness Conflict Risk

The niche is clear (production UI and visual polish for pages, components, typography) and the exclusion clause "Not for backend logic or data pipelines" actively prevents wrong-skill triggering. Conflict risk with adjacent skills is minimal, matching the clear-niche anchor.

5 / 5

Total

18

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository

tw93/Waza

Path

skills/ui/SKILL.md

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.