CtrlK
BlogDocsLog inGet started
Tessl Logo

ui-final-polish

Final visual polish for an existing UI without redesigning it. Use after structure is clear, when asked to improve spacing, alignment, text hierarchy, readability, shadows, highlights, effects, action placement, or overall production feel. For screen structure, layer naming, code handoff, preview scenes, or animation planning, use pencil-ui-structure first.

68

Quality

81%

Does it follow best practices?

Impact

No eval scenarios have been run

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Quality

Content

62%

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

This is a well-structured and thoughtful skill that provides clear guardrails and decision frameworks for UI polish work. Its main strengths are the explicit workflow sequencing, verification steps, and concrete numeric guidelines for effects. Its weaknesses are moderate verbosity from repeated 'do not redesign' constraints across multiple sections, lack of executable code examples, and a monolithic structure that could benefit from splitting reference material into separate files.

Suggestions

Consolidate the repeated 'do not redesign' constraints — they appear in Goals, Non-Goals, Default Stance, Anti-Patterns, and Polish Decision Rules. A single authoritative statement with a brief reference elsewhere would save significant tokens.

Add concrete before/after code or markup examples showing a specific polish fix (e.g., a CSS diff for spacing adjustment, or a Pencil node property change) to improve actionability.

Consider splitting the Pencil Starting Presets and Effects Best Practices sections into separate reference files to reduce the main skill's token footprint and improve progressive disclosure.

DimensionReasoningScore

Conciseness

The skill is thorough and mostly well-organized, but it's quite long (~300+ lines) with some redundancy. Several sections repeat the 'do not redesign' constraint in slightly different ways across Goals, Non-Goals, Default Stance, Anti-Patterns, and Polish Decision Rules. The Pencil Starting Presets section is detailed but could be more concise. However, most content is genuinely instructive rather than explaining things Claude already knows.

2 / 3

Actionability

The skill provides concrete heuristics, specific numeric values for shadows/highlights/opacity, and clear decision rules. However, it lacks executable code examples or copy-paste-ready commands. The guidance is specific (e.g., 'blur = y * 2', opacity ranges) but remains instructional prose rather than executable snippets. The Pencil workflow steps are concrete but not tied to specific tool commands.

2 / 3

Workflow Clarity

The Review Order section provides a clear numbered sequence. The Pencil Workflow section has explicit before/after screenshot verification steps with a concrete validation question ('Is this still the same design, just cleaner?'). The Polish Decision Rules establish a clear decision framework before editing. The Final Verification section serves as a comprehensive checklist. The Change Budget section provides clear escalation levels.

3 / 3

Progressive Disclosure

The content is entirely self-contained in one file with no bundle files. While sections are well-organized with clear headers, the document is quite long and could benefit from splitting detailed reference material (like Pencil Starting Presets, Effects Best Practices) into separate files. The reference to 'pencil-ui-structure' as a prerequisite skill is good, but the monolithic structure makes this a large context load.

2 / 3

Total

9

/

12

Passed

Description

100%

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

This is an excellent skill description that clearly defines its scope (visual polish for existing UIs), provides rich trigger terms covering common user requests, and explicitly delineates its boundary with a related skill. The inclusion of both positive triggers and negative routing guidance makes it highly effective for skill selection in a multi-skill environment.

DimensionReasoningScore

Specificity

Lists multiple specific concrete actions: improve spacing, alignment, text hierarchy, readability, shadows, highlights, effects, action placement, and overall production feel. These are clearly defined visual polish tasks.

3 / 3

Completeness

Clearly answers both what ('Final visual polish for an existing UI without redesigning it') and when ('Use after structure is clear, when asked to improve spacing, alignment...'). Also includes explicit negative triggers directing to a related skill, which strengthens the 'when' guidance.

3 / 3

Trigger Term Quality

Excellent coverage of natural terms users would say: 'spacing', 'alignment', 'text hierarchy', 'readability', 'shadows', 'highlights', 'effects', 'action placement', 'production feel', 'visual polish'. These are terms designers and developers naturally use.

3 / 3

Distinctiveness Conflict Risk

Highly distinctive with a clear niche (visual polish, not structural design). Explicitly differentiates itself from 'pencil-ui-structure' by listing what belongs to the other skill (screen structure, layer naming, code handoff, etc.), minimizing conflict risk.

3 / 3

Total

12

/

12

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.

Validation11 / 11 Passed

Validation for skill structure

No warnings or errors.

Repository
JohnWayneeee/ai-agent-skills
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.