CtrlK
BlogDocsLog inGet started
Tessl Logo

design-exploration

Use Design for UI/UX exploration, side-by-side design directions, interactive prototype previews, user selection, iteration, and design-to-code handoff through the hosted Design MCP app.

60

Quality

75%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./.agents/plugins/agent-native-design/skills/design-exploration/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

81%Weight 40%Scale 1-5

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

The body is a strong, opinionated, highly actionable instruction set with a clear workflow, explicit error recovery, and a design-quality bar Claude could not infer on its own. Its main flaws are the near-verbatim duplication of the variant-pick procedure across two sections and a long Cross-App Use troubleshooting section that slightly bloats the main file.

Suggestions

Deduplicate the variant-pick procedure: state the snapshot -> edit-design -> replace-file flow once and reference it from 'Exploration Defaults' instead of repeating it nearly verbatim.

Move the connector/auth troubleshooting in 'Cross-App Use' (session-terminated handling, reconnect commands, token redaction) into a separate reference file, keeping only a one-line pointer in SKILL.md.

Tighten the 'Design Quality Bar' by merging overlapping bullets (e.g., the font/palette/layout refusals) so each rule appears once.

DimensionReasoningScore

Conciseness

The body is mostly directive with little padding, but the full variant-pick procedure ("call `get-design-snapshot` with that screen's `fileId`, then calling `edit-design` ... `mode: "replace-file"` ... Do not call `generate-design` after a variant pick") is repeated nearly verbatim in both 'Choose The Path' and 'Exploration Defaults'. The duplication is more than a minor trim, so it sits below the 4 anchor.

3 / 5

Actionability

Fully concrete guidance: named tool calls (create-design, present-design-variants, get-design-snapshot, edit-design, export-coding-handoff), exact counts (2-5, three by default), specific hex codes to refuse (#6366F1/#8B5CF6/#A855F7), and copy-ready commands such as `npx -y @agent-native/core@latest reconnect https://design.agent-native.com`. Instruction-only but every step is executable.

5 / 5

Workflow Clarity

The sequence is explicit (create-design -> variants -> present-design-variants -> pick -> delete unchosen -> get-design-snapshot -> edit-design -> export-coding-handoff) with error-recovery loops (auth failure handling, fallback when chat choice buttons are unavailable) and a pre-ready validation checkpoint ('inspect the rendered Design surface ... before calling it ready').

5 / 5

Progressive Disclosure

No bundle files exist and the body is well-sectioned with clear headers, but at ~118 lines the 'Cross-App Use' connector/auth troubleshooting block and the duplicated variant procedure could be split out or consolidated. Good structure with minor organization gaps rather than a fully clean split.

4 / 5

Total

17

/

20

Passed

Description

58%Weight 40%Scale 1-5

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

The description clearly states what the Design skill does with several concrete capability phrases, but it lacks any explicit 'Use when...' trigger guidance and misses natural synonyms like mockup or wireframe. It is distinct from most other skills but somewhat jargon-heavy ('hosted Design MCP app').

Suggestions

Add an explicit trigger clause, e.g. 'Use when the user wants visual/UI design exploration, mockup variants, or a design-to-code handoff' — its absence currently caps completeness at 3.

Include natural user phrasings and synonyms such as 'mockups', 'wireframes', 'look and feel', and 'design directions' so trigger matching catches how users actually ask.

Trim jargon like 'hosted Design MCP app' in favor of user-facing language, keeping the technical detail in the skill body.

DimensionReasoningScore

Specificity

Lists several concrete capabilities ("side-by-side design directions, interactive prototype previews, user selection, iteration, and design-to-code handoff") though "UI/UX exploration" and "iteration" are somewhat generic. Not 5 because coverage has minor gaps; not 3 because more than 1-2 concrete actions are named.

4 / 5

Completeness

The "what" is clear ("Use Design for UI/UX exploration...") but there is no "Use when..." clause or equivalent explicit trigger guidance, which caps completeness at 3 per the judging guidelines.

3 / 5

Trigger Term Quality

Contains relevant keywords ("design", "prototype", "UI/UX") but misses common natural variations users would say, such as "mockup", "wireframe", or "visual design". "hosted Design MCP app" leans technical rather than user-natural.

3 / 5

Distinctiveness Conflict Risk

The niche is fairly distinct — anchored to "design-to-code handoff through the hosted Design MCP app" — with minor overlap risk against generic design or frontend-implementation skills. Not 5 because the broad term "design" could still collide with other design-related skills.

4 / 5

Total

14

/

20

Passed

Validation

93%

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

CriteriaDescriptionResult

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
BuilderIO/agent-native
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.