CtrlK
BlogDocsLog inGet started
Tessl Logo

frontend-design

Create distinctive, production-grade frontend interfaces with high design quality, ALIGNED with the Comanda editorial line. Use when the user asks to build web components, pages, or applications and wants polished, memorable design instead of generic AI aesthetics.

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

75%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 dense, well-structured design-direction skill with concrete, executable tokens and a clear think-then-build workflow. The main weakness is minor motivational/adjective padding that slightly undercuts token efficiency.

Suggestions

Trim the redundant restatement of goals and the motivational closing lines ('Don't hold back...', 'CRITICAL: Intentionality, not intensity...') to tighten the body.

Collapse the adjective-laden 'implement code that is:' list into a single concrete directive.

Add an explicit final checkpoint such as 'Verify the result respects every locked editorial-line token before delivering' to strengthen the workflow.

DimensionReasoningScore

Conciseness

The editorial-line block is lean and high-value (exact tokens, hex codes, radii, motion budgets), but the opening restates the description and the 'implement code that is...' adjective list plus the motivational closing ('Don't hold back...', 'CRITICAL: Intentionality...') are minor over-explanation that could be trimmed.

4 / 5

Actionability

Provides highly concrete, copy-paste-ready specs (fonts, hex tokens, radius 16px, motion max 320ms, currency 'R$ 1.234,56', touch targets) and a clear operational-vs-marketing distinction, though no worked component example demonstrates the tokens applied end-to-end.

4 / 5

Workflow Clarity

Clear sequence of locked editorial line -> design-thinking pre-flight (Purpose/Tone/Constraints/Differentiation) -> implement -> match complexity to vision, with the design-thinking prompts serving as implicit checkpoints; only minor validation gaps (no explicit 'verify against editorial line before finishing').

4 / 5

Progressive Disclosure

No bundle files exist; the body is a self-contained, well-organized document with clear section headers (Editorial line, Design thinking, Where creative freedom lives) and no nested references, appropriate for a cohesive design-direction skill though slightly above the simple-skill line count.

4 / 5

Total

16

/

20

Passed

Description

87%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 strong, third-person description that clearly states both capability and a concrete 'Use when...' trigger bounded by the Comanda editorial line. Minor gains possible from broader synonym coverage in the trigger terms.

DimensionReasoningScore

Specificity

Names the frontend domain and concrete build targets ('web components, pages, or applications') with a clear quality stance, but the actions are about what to build rather than specific design operations, leaving minor coverage gaps.

4 / 5

Completeness

Explicitly answers both what ('Create distinctive, production-grade frontend interfaces... ALIGNED with the Comanda editorial line') and when via a concrete 'Use when...' clause with specific trigger phrases, matching the top anchor.

5 / 5

Trigger Term Quality

Includes natural phrases users would say ('build web components, pages, or applications', 'polished, memorable design', 'generic AI aesthetics'), but omits common synonyms like 'UI', 'website', 'landing page', or 'styling'.

4 / 5

Distinctiveness Conflict Risk

The Comanda editorial-line framing and the 'instead of generic AI aesthetics' positioning carve a clear niche with distinct triggers and minimal overlap with general frontend skills.

5 / 5

Total

18

/

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
mazzoty-fjrnf/hug-command-nexus
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.