CtrlK
BlogDocsLog inGet started
Tessl Logo

building-ui-ux

Use when implementing user interfaces or user experiences - guides through exploration of design variations, frontend setup, iteration, and proper integration

61

Quality

71%

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

Fix and improve this skill with Tessl

tessl review fix ./.agency/plugins/nori/skills/building-ui-ux/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

67%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.

A well-structured, actionable skill body with a clear five-phase workflow, an executable code example, and an integration checklist. Its main weakness is conciseness — the todo block and phase descriptions duplicate each other — which keeps it at the 3-anchor on token efficiency while the other dimensions score 4.

Suggestions

Remove the redundancy between the <required> TodoWrite block and the Phase 1-5 sections: keep one authoritative sequence rather than restating the seven steps twice.

Tighten obvious padding such as 'Plan to implement all variations in a way that allows easy comparison' — the subsequent bullets already specify how.

Add a brief error-recovery checkpoint in Phase 2 (e.g., 'If the dev server fails to start, check the port and package manager before proceeding') to push workflow clarity toward the top anchor.

DimensionReasoningScore

Conciseness

The body is mostly efficient and avoids explaining basic concepts Claude already knows, but the <required> todo block and the five Phase sections restate the same steps, and lines like 'Plan to implement all variations in a way that allows easy comparison' add noticeable padding that could be trimmed.

3 / 5

Actionability

Provides a complete, executable React/TSX example for stacking variations plus concrete commands ('npm run dev', localhost URL) and a specific integration checklist (form submissions → backend endpoints, etc.); only minor gaps such as the vaguer single-design guidance ('Follow project conventions').

4 / 5

Workflow Clarity

Five phases are clearly sequenced with an explicit feedback loop in Phase 4 ('Continue asking for feedback until satisfied') and a verification checklist in Phase 5; missing only explicit error-recovery validation steps (e.g., what to do if the dev server fails to start).

4 / 5

Progressive Disclosure

Single-file skill with well-organized section headers and no nested references; content is appropriately placed for a cohesive workflow, though at ~110 lines it is over the simple-skill threshold and the detailed integration checklist could optionally live in a reference file.

4 / 5

Total

15

/

20

Passed

Description

75%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.

A solid, third-person description with an explicit 'Use when' trigger and several concrete capability verbs. It lands at the 4-anchor across all dimensions: clear and useful, but one step short of the comprehensive, multi-synonym trigger coverage of the top examples.

DimensionReasoningScore

Specificity

Names the domain plus several concrete actions — 'exploration of design variations, frontend setup, iteration, and proper integration' — listing multiple specific capabilities with only minor coverage gaps (e.g., no mention of responsive/accessibility work).

4 / 5

Completeness

Explicitly answers both 'what' ('guides through exploration…integration') and 'when' ('Use when implementing user interfaces or user experiences'); the 'when' is concrete but could add a few more explicit trigger phrases to reach the top anchor.

4 / 5

Trigger Term Quality

Natural user-facing terms like 'implementing user interfaces or user experiences', 'design variations', and 'frontend setup' are present and would plausibly be said by a user, though a few common synonyms (e.g., 'UI/UX', 'frontend') are not surfaced explicitly.

4 / 5

Distinctiveness Conflict Risk

The UI/UX implementation niche is clearly distinguished with distinct triggers; only minor overlap risk with a generic frontend-building skill.

4 / 5

Total

16

/

20

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
microsoft/FluidFramework
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.