CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

yz-ui

Yoizen UI design system. Trigger: Yoizen UI components, styling, colors, typography, Angular frontend polish.

64

Quality

80%

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 ./ywai/skills/yz-ui/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

86%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, dense norms document: copy-verbatim artifacts, exact tokens, executable snippets, and excellent reference navigation with all bundle paths resolving. The only gaps are minor tightening opportunities and the lack of an explicit recovery loop in the correction workflow.

DimensionReasoningScore

Conciseness

The body is dense and imperative with no explanations of concepts Claude already knows, and brief rationales only for non-obvious norms ("or colors read neon over the dark background"). Minor trimming is possible — the long run-on Angular-upgrade paragraph and compound checklist items could be tightened — keeping it at anchor 4 rather than the fully lean anchor 5.

4 / 5

Actionability

Guidance is fully executable: exact brand hexes in a table, a copy-paste CSS import block in required order, a complete Lucide Angular code snippet, named commands ("ng update", "https://angular.dev/update-guide"), and named classes/tokens (.btn-icon, --shadow-glass, [yzModal]). Specific examples cover the common cases.

5 / 5

Workflow Clarity

Clear sequences with checkpoints exist — the Angular upgrade path (check version, update majors with peers, "Commit before each major", "review the diff and run the app after each step") and the audit rule ("Correct at the token level first... The audit is done only when all 18 items have been checked"). It falls short of anchor 5 because the apply-to-a-project workflow is spread across Scope/CSS Architecture/Checklist sections with no explicit failure-recovery loop (e.g. what to do when the WCAG AA validation fails).

4 / 5

Progressive Disclosure

A clear overview with a well-signaled references table ("Read it when" column) pointing one level deep to patterns.md, theming.md, and assets.md — all of which exist — while details are appropriately split out ("The reasoning behind each of these... are in references/theming.md — read it before touching the palette"). All cited assets/ paths in the body exist in the bundle.

5 / 5

Total

18

/

20

Passed

Description

65%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 compact and brand-anchored with an explicit trigger clause, but it only labels the domain without stating any actions. Adding what the skill actually does would lift both specificity and completeness.

Suggestions

State the skill's actions explicitly, e.g. "Applies the Yoizen design system to Angular frontends — brand tokens, themes, component styles — and audits/corrects screens for design-system compliance"; the current text names the domain but lists no actions (specificity scored 2).

Expand the "what" beyond the bare noun phrase "Yoizen UI design system" so the description answers what the skill does, not just what it is.

Add missing natural trigger variations such as "design tokens", "dark/light theme", "brand assets", or "UI audit" to broaden trigger coverage.

DimensionReasoningScore

Specificity

"Yoizen UI design system" names a concrete domain but the description contains no action verbs at all — it never says what the skill does (apply tokens, theme components, audit screens). This matches anchor 2 ('names the domain but actions are minimal or generic') and falls short of anchor 3, which requires 1-2 concrete actions.

2 / 5

Completeness

Both parts are present: the "what" ("Yoizen UI design system") and an explicit "when" (the "Trigger:" clause). It does not reach anchor 5 because the what is a bare noun label with no statement of capability, and exceeds anchor 3 because the when is explicit rather than weakly implied.

4 / 5

Trigger Term Quality

"Yoizen UI components, styling, colors, typography, Angular frontend polish" are natural phrases a user on a Yoizen frontend would actually say, giving good keyword coverage. It is not anchor 5 because common variations like "design tokens", "dark/light theme", "brand assets", or "UI audit" are missing.

4 / 5

Distinctiveness Conflict Risk

The "Yoizen" brand name carves out a clear niche with minimal conflict risk, but the unqualified generic tail ("styling, colors, typography, Angular frontend polish") could match general frontend/CSS work. Mostly distinct with minor overlap risk, matching anchor 4 rather than anchor 5's fully distinct triggers.

4 / 5

Total

14

/

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.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

YoizenSA/dev-ai-workflow

Path

ywai/skills/yz-ui/SKILL.md

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.