UI/UX specialist - creates beautiful, functional interfaces
38
Quality
22%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/pixel/SKILL.mdQuality
Discovery
14%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 description is too vague and lacks the specificity needed for Claude to reliably select it from a pool of skills. It fails to list concrete actions, omits trigger guidance entirely, and uses subjective language ('beautiful') rather than actionable terms. The description would benefit significantly from explicit capabilities and clear 'Use when...' triggers.
Suggestions
Add a 'Use when...' clause with specific trigger terms like 'design UI', 'create mockup', 'wireframe', 'user interface design', 'layout', 'prototype'
Replace vague language with concrete actions such as 'Creates wireframes, designs component layouts, builds responsive interfaces, implements design systems'
Specify the scope more clearly to distinguish from general frontend coding (e.g., focus on design aspects vs implementation, or specify tools/frameworks used)
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | The description uses vague language like 'beautiful, functional interfaces' without listing any concrete actions. It doesn't specify what actions are performed (e.g., design wireframes, create mockups, implement responsive layouts). | 1 / 3 |
Completeness | The description weakly addresses 'what' (creates interfaces) but completely lacks any 'when' guidance or 'Use when...' clause. There are no explicit triggers for when Claude should select this skill. | 1 / 3 |
Trigger Term Quality | Contains some relevant keywords ('UI/UX', 'interfaces') that users might mention, but misses common variations like 'design', 'mockup', 'wireframe', 'prototype', 'user interface', 'frontend design', or file types. | 2 / 3 |
Distinctiveness Conflict Risk | Very generic description that could easily conflict with frontend development skills, design skills, or general coding skills. 'Interfaces' is too broad and doesn't carve out a clear niche. | 1 / 3 |
Total | 5 / 12 Passed |
Implementation
29%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill functions more as a persona definition and reference sheet than actionable implementation guidance. While it includes useful code examples and checklists, it lacks clear workflows for translating designs into code, has no validation steps, and doesn't leverage progressive disclosure for its extensive content. The persona framing and philosophical quotes waste tokens without adding value.
Suggestions
Add a clear step-by-step workflow for implementing a design (e.g., 1. Analyze design specs, 2. Create component structure, 3. Implement styles, 4. Test accessibility, 5. Verify responsiveness) with validation checkpoints
Remove persona framing, the Steve Jobs quote, and 'Core Expertise' list - Claude already knows these concepts
Split detailed content (component patterns, accessibility checklist, design tokens) into separate reference files with clear links from the main skill
Add concrete examples of input (design description) to output (implemented component) to make the skill more actionable
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill contains useful reference material but includes unnecessary elements like the Steve Jobs quote, persona framing ('You are Pixel'), and some verbose sections. The design principles and expertise lists explain concepts Claude already knows. | 2 / 3 |
Actionability | Provides concrete code examples (Button component, CSS breakpoints, design tokens) that are executable, but lacks clear instructions on when/how to use them. The skill reads more like a reference document than actionable guidance for specific tasks. | 2 / 3 |
Workflow Clarity | No clear workflow or sequence for implementing UI components. The 'Always deliver' list mentions outputs but provides no process steps, validation checkpoints, or feedback loops for the implementation process. | 1 / 3 |
Progressive Disclosure | Monolithic content with no references to external files for detailed topics like accessibility guidelines, component patterns, or framework-specific implementations. Everything is inline despite being a comprehensive topic that warrants splitting. | 1 / 3 |
Total | 6 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
fab464f
Table of Contents
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.