CtrlK
BlogDocsLog inGet started
Tessl Logo

design-taste-frontend

Senior UI/UX Engineer. Architect digital interfaces overriding default LLM biases. Enforces metric-based rules, strict component architecture, CSS hardware acceleration, and balanced design engineering.

54

Quality

60%

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 ./workshops/soccer-analytics-agent/.claude/skills/taste-skill/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

70%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 highly actionable, with concrete code tokens throughout and a clear workflow capped by a pre-flight verification checklist. Its weaknesses are token efficiency (repetitive overlapping prohibition lists) and progressive disclosure (no reference files; everything inlined in one large file).

Suggestions

Move the long enumerated catalogs (Section 8 'Creative Arsenal' inspiration list, Section 9 Bento archetypes) into a references file (e.g. references/creative-arsenal.md) and link to it from a concise SKILL.md overview, reducing token load.

Consolidate the overlapping prohibition lists in Sections 3, 4, 7, and 9 (which repeatedly ban the same purple/neon/Inter/card patterns) into one 'AI Tells' section to remove redundancy.

Keep the high-value executable tokens but trim surrounding prose (e.g. 'Mandatory Generation: LLMs naturally generate static successful states') so every token earns its place.

DimensionReasoningScore

Conciseness

The body is information-dense and mostly avoids explaining concepts Claude already knows, but at ~190 lines it is padded with repetitive 'AI Tells'/forbidden-pattern lists and multiple overlapping sections (Section 7 vs Sections 3/4/9) that restate the same prohibitions; it could be tightened without losing guidance.

3 / 5

Actionability

Nearly every directive pairs a rule with a concrete, copy-paste-ready token (e.g. 'min-h-[100dvh]', 'text-4xl md:text-6xl tracking-tighter leading-none', 'type: "spring", stiffness: 100, damping: 20', 'border-t', 'divide-y'), giving fully executable guidance across the common frontend cases.

5 / 5

Workflow Clarity

A clear sequenced structure runs baseline config -> architecture -> design directives -> creative/motion -> performance -> reference dials -> AI tells -> final pre-flight checklist, and the Section 10 'FINAL PRE-FLIGHT CHECK' provides an explicit verification checkpoint with a feedback-style validation step before output.

5 / 5

Progressive Disclosure

The SKILL.md is a monolithic ~190-line wall of text with no external reference files (references/, scripts/, assets/ absent) and no clear one-level-deep reference pointers; large reference-style catalogs (Section 8 'Creative Arsenal' enumeration, Section 9 bento specs) are inlined where a separate file would aid discovery.

2 / 5

Total

15

/

20

Passed

Description

50%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 is third-person and names a clear niche, but it leans on jargon and omits any explicit 'Use when...' trigger guidance, capping completeness and weakening natural trigger terms. Adding concrete user-facing keywords and a use-when clause would materially raise it.

Suggestions

Add an explicit 'Use when...' clause with natural trigger phrases (e.g. 'Use when building or refining React/Next.js frontends, dashboards, landing pages, or UI components').

Replace jargon ('metric-based rules', 'CSS hardware acceleration') with terms users actually say: 'frontend', 'UI/UX', 'React', 'Tailwind', 'responsive design', 'motion/animation'.

Ground the capabilities in concrete actions the skill performs (e.g. 'Generates component code, calibrates typography and color, hardens mobile layouts, and adds motion') rather than abstract verbs.

DimensionReasoningScore

Specificity

Phrases like 'Architect digital interfaces', 'Enforces metric-based rules', 'strict components architecture', 'CSS hardware acceleration' name the domain and several concrete actions, but the actions are high-level/generic rather than a comprehensive list of specific capabilities.

3 / 5

Completeness

It gives a clear 'what' (architect digital interfaces enforcing design rules) but provides no 'Use when...' clause or equivalent explicit trigger guidance, capping completeness at 3 per the rubric.

3 / 5

Trigger Term Quality

It relies on technical jargon ('metric-based rules', 'CSS hardware acceleration', 'components architecture') and lacks natural user-facing trigger phrases like 'frontend', 'UI', 'React', 'Tailwind', or 'dashboard design' that a user would actually say.

2 / 5

Distinctiveness Conflict Risk

The niche (UI/UX engineering with bias-correction design rules) is fairly distinct from generic coding skills with only minor overlap risk against other frontend/design skills.

4 / 5

Total

12

/

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
oracle-devrel/oracle-ai-developer-hub
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.