ui-designer
Extract design systems from reference UI images and generate implementation-ready UI design prompts. Use when users provide UI screenshots/mockups and want to create consistent designs, generate design systems, or build MVP UIs matching reference aesthetics.
59
67%
Does it follow best practices?
Impact
—
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./ui-designer/SKILL.mdQuality
Discovery
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 a strong description that clearly communicates specific capabilities, includes natural trigger terms, and explicitly states both what the skill does and when to use it. The description is concise yet comprehensive, occupying a distinct niche that minimizes conflict risk with other skills.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'Extract design systems from reference UI images' and 'generate implementation-ready UI design prompts'. These are clear, actionable capabilities. | 3 / 3 |
Completeness | Clearly answers both what ('Extract design systems from reference UI images and generate implementation-ready UI design prompts') and when ('Use when users provide UI screenshots/mockups and want to create consistent designs, generate design systems, or build MVP UIs matching reference aesthetics'). | 3 / 3 |
Trigger Term Quality | Includes strong natural keywords users would say: 'UI screenshots', 'mockups', 'design systems', 'MVP UIs', 'reference aesthetics', 'consistent designs'. Good coverage of terms a user would naturally use when needing this skill. | 3 / 3 |
Distinctiveness Conflict Risk | Occupies a clear niche combining UI image analysis with design system extraction and prompt generation. The specific focus on extracting from reference images and generating design prompts is distinct and unlikely to conflict with general UI or image skills. | 3 / 3 |
Total | 12 / 12 Passed |
Implementation
35%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
The skill provides a reasonable multi-step workflow for extracting design systems from UI images, but suffers from significant verbosity—particularly the redundant Template Assets descriptions and generic Best Practices that Claude already knows. Actionability is moderate: the workflow structure is clear but lacks concrete tool invocation examples and validation checkpoints between steps. The content could be roughly halved while improving clarity.
Suggestions
Remove the 'Template Assets' section entirely or reduce to a one-line-per-template table—Claude will read the actual template files and doesn't need their contents summarized.
Remove generic best practices Claude already knows (e.g., 'Be systematic', 'Engage user interactively') and keep only project-specific guidance like file naming conventions.
Add validation checkpoints between steps, e.g., verify design system covers all template sections before proceeding to Step 4, and verify the composed prompt includes both design system and PRD content.
Provide a concrete example of the Task tool invocation with actual prompt content rather than abstract descriptions like 'Use Task tool with general-purpose subagent, providing prompt template from assets/design-system.md'.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is very verbose with significant redundancy. The 'Template Assets' section re-describes what the templates contain (information Claude doesn't need since it would read the actual files). The 'Best Practices' section contains generic advice Claude already knows (e.g., 'Be systematic', 'Engage user interactively'). The 'Notes' section adds little value. Much of the content could be cut in half without losing actionable information. | 1 / 3 |
Actionability | The workflow steps provide a reasonable sequence with specific file paths and template references, and Step 5 includes executable bash commands. However, most steps describe what to do abstractly ('Use Task tool with general-purpose subagent') rather than providing concrete, copy-paste-ready examples of the actual Task tool invocations or substitution code. The template substitution instructions use placeholder names but don't show the actual mechanics. | 2 / 3 |
Workflow Clarity | The 6-step workflow is clearly sequenced with logical progression and conditional branching (skip Step 3 if PRD exists). However, there are no validation checkpoints between steps—no verification that the design system extraction is complete/correct before proceeding, no check that the PRD meets quality standards, and no validation of the final composed prompt before implementation. For a multi-step workflow involving subagent delegation and file generation, this is a significant gap. | 2 / 3 |
Progressive Disclosure | The skill references three template assets in `assets/` and organizes outputs into `documents/` subdirectories, showing good structural intent. However, no bundle files were provided, so the referenced templates cannot be verified. The 'Template Assets' section redundantly describes template contents inline rather than letting the templates speak for themselves, and the 'Best Practices' section is lengthy content that could be in a separate reference file. | 2 / 3 |
Total | 7 / 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.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
- Repository
- daymade/claude-code-skills
- Commit
bbf87f3
- 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.