CtrlK
BlogDocsLog inGet started
Tessl Logo

design-first-ui-prompting

Use when you need design-first, spec-driven, skimmable prompts for UI generation. Covers prompt structure, constraints, variations, typography/spacing rules, and iteration workflow for consistent UI outputs.

68

Quality

81%

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

87%

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

A tight, actionable instruction-only skill whose prompt skeleton and rules are immediately usable; its main weakness is a workflow that lacks explicit validation checkpoints or an error-recovery feedback loop. Organization is clean and needs no external references.

Suggestions

Add an explicit validation checkpoint to the iteration workflow (e.g., "after each variant, check spelling/hierarchy before changing the next variable") so the sequence has a clear feedback loop.

Make the 2-pass workflow's error recovery explicit (e.g., "if text is still garbled after pass 2, regenerate with a larger reserved text-safe area") rather than only describing the two passes.

DimensionReasoningScore

Conciseness

The body is lean and domain-specific (a copy-paste skeleton, four short rules, a checklist, and questions) with no padding of concepts Claude already knows; every section earns its place.

3 / 3

Actionability

It provides a concrete fill-in-the-blank prompt skeleton, explicit rules ("change ONE variable at a time", a numbered 2-pass workflow), and a constraints-card example that are effectively copy-paste ready.

3 / 3

Workflow Clarity

A sequence is present (lock one system, then iterate; numbered 2-pass workflow) plus a tweak checklist, but validation/checkpoints are only implicit and there is no explicit feedback loop for error recovery.

2 / 3

Progressive Disclosure

The skill is a single self-contained file with no bundle references needed and is organized into clearly labeled sections (Core principle, Prompt Structure, Rules, Checklist, Questions), matching the simple-skill allowance for well-organized content.

3 / 3

Total

11

/

12

Passed

Description

75%

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 reasonably specific, well-triggered description for a narrow niche, but the second-person voice costs specificity and the trigger vocabulary is somewhat jargon-heavy. Both "what" and "when" are present and explicit.

Suggestions

Rewrite the trigger in third person (e.g., "Use when the user needs design-first, spec-driven, skimmable prompts for UI generation") to remove the second-person "you" and recover the specificity voice penalty.

Add natural trigger terms users would actually say, such as "UI mockups", "wireframes", "design prompts", or "Figma-to-prompt", to broaden trigger coverage beyond skill jargon.

Lead with concrete action verbs (e.g., "Turns fuzzy ideas into spec-driven UI prompts covering structure, typography, spacing, and iteration") instead of the single verb "Covers".

DimensionReasoningScore

Specificity

The description lists multiple specific capabilities ("prompt structure, constraints, variations, typography/spacing rules, and iteration workflow"), which would anchor at 3, but the trigger is written in second person ("Use when you need...") so the voice penalty reduces specificity by 1.

2 / 3

Completeness

It explicitly answers both what ("Covers prompt structure, constraints, variations...") and when ("Use when you need design-first, spec-driven, skimmable prompts for UI generation").

3 / 3

Trigger Term Quality

It includes relevant terms ("UI generation", "prompts") but leans on skill jargon ("spec-driven", "skimmable") and omits common natural variations a user might say (e.g., "UI mockups", "wireframes", "design prompts").

2 / 3

Distinctiveness Conflict Risk

It carves a clear niche (design-first UI prompt authoring) with distinct triggers unlikely to collide with other skills.

3 / 3

Total

10

/

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.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
MengTo/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.