wireframe

Produce low-fidelity black-and-white UI wireframes as SVGs or viewer pages. Use when asked to wireframe, sketch a screen, draft a layout, make a low-fi mockup, or publish wireframes.

Quality

92%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

85%

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

A highly actionable, well-structured skill with clear workflows and excellent one-level-deep progressive disclosure backed by verified reference and asset files. Its only weakness is conciseness: the viewer-page and publish subsections are more detailed than an overview SKILL.md needs.

Suggestions

Move the detailed viewer-page anatomy (page sections, responsive breakpoint table, CSS variables) into a reference file such as references/viewer-page.md, keeping only the trigger, file layout, and a pointer in SKILL.md.

Tighten the here-now publish section to a short delegation pointer plus the few non-obvious gotchas (root index.html, --slug for updates, read publish_result.* not state.json), trimming the step-by-step repetition.

Add a one-line self-check to the core wireframe workflow (e.g., confirm the SVG opens and coordinates snap to 8px) so validation is explicit for the primary deliverable, not only the viewer.

Dimension	Reasoning	Score
Conciseness	The body is dense and free of concept-explaining fluff, but the inline viewer-page anatomy (sticky TOC, hero, per-screen grid, lightbox, four responsive breakpoints, verification) and the here-now publish delegation are accurate yet verbose and could be tightened or moved to a reference — matching 'mostly efficient but could be tightened'.	2 / 3
Actionability	Provides a copy-paste-ready minimal SVG, an exact house-style token table, concrete file paths like 'wireframes/<slug>.svg', and exact CSS variables and breakpoints — fully executable guidance.	3 / 3
Workflow Clarity	A clear six-step sequence is paired with an explicit verification checkpoint ('open the file in a browser and walk it at 1440×900, 768×1024, and 390×844') and a scope-confirming 'ask one question' guard, satisfying the clear-sequence-with-validation anchor.	3 / 3
Progressive Disclosure	The body keeps only essential rules inline and pushes primitives to references/components.md, grid/palette to references/grid-system.md, and worked examples to references/examples.md — all real, one level deep, and clearly signaled, with templates under assets/.	3 / 3
	Total	11 / 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.

A concise, well-constructed description in third-person voice that states concrete deliverables, gives an explicit 'Use when' trigger with natural terms, and occupies a clearly distinct niche. It satisfies every dimension at the top of the scale.

Dimension	Reasoning	Score
Specificity	Lists multiple specific concrete actions and deliverable formats — 'Produce low-fidelity black-and-white UI wireframes as SVGs or viewer pages' — plus wireframe, sketch, draft, and publish actions, matching the score-3 anchor.	3 / 3
Completeness	It clearly answers both 'what' (produce B&W wireframes as SVGs/viewer pages) and 'when' with an explicit 'Use when...' trigger clause, so it is not capped at 2.	3 / 3
Trigger Term Quality	The 'Use when asked to wireframe, sketch a screen, draft a layout, make a low-fi mockup, or publish wireframes' clause covers natural phrasings a user would actually say, meeting the good-coverage anchor.	3 / 3
Distinctiveness Conflict Risk	'Low-fidelity black-and-white UI wireframes as SVGs' carves a clear niche with distinct triggers unlikely to fire for hi-fi or production-UI skills.	3 / 3
	Total	12 / 12 Passed

Validation

93%

Warnings & errors only

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

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	15 / 16 Passed

Repository: paperclipai/paperclip
Path: packages/skills-catalog/catalog/bundled/product/wireframe/SKILL.md
Commit: 14f20be

Reviewed: 4 days ago

Table of Contents

Discovery Implementation Validation

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.