CtrlK
BlogDocsLog inGet started
Tessl Logo

design-anti-patterns

Enforce anti-AI UI design rules based on the Uncodixfy methodology. Use when generating HTML, CSS, React, Vue, Svelte, or any frontend UI code. Prevents generic AI aesthetic — soft gradients, glassmorphism, hero sections in dashboards, oversized rounded corners, and decorative copy. Applies constraints from Linear/Raycast/Stripe/GitHub design philosophy for functional, honest, human-designed interfaces. Triggers on UI generation, dashboard building, component creation, CSS styling, landing page design, or any task producing visual interface code.

73

Quality

90%

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

92%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 lean, highly actionable instruction-only skill: exact numeric constraints for every component, a clear pre-flight workflow with an explicit verification step, and clean one-level-deep progressive disclosure to a real, well-anchored reference file. The only minor costs are slight redundancy between the intro and the Pre-Flight Check and an inline source-access date.

DimensionReasoningScore

Conciseness

The body is dense with constraints Claude cannot know (banned patterns, numeric standards table) and wastes little space, but the intro's metacognitive sentence duplicates the Pre-Flight Check, and the time-sensitive 'accessed 2026-03-17' date is not placed in a deprecated/old-patterns section. Anchor 4 fits: efficient with minor trimming possible, not the every-token-earns-its-place level 5.

4 / 5

Actionability

Guidance is fully concrete and executable: exact limits ('Border radius > 12px', 'shadow max 0 2px 8px rgba(0,0,0,0.1)', '4/8/12/16/24/32px scale only', '100-200ms ease') plus a per-component standards table. For an instruction-only skill this matches the fully-executable anchor; it is not the level-4 anchor since no key execution detail is missing.

5 / 5

Workflow Clarity

The Pre-Flight Check is a clear 4-step sequence with a find-fix-verify loop: cross-reference defaults against banned patterns, replace matches with normal standards, then 'Verify the result contains zero banned patterns'. This is the explicit-validation-with-feedback-loop anchor; it exceeds level 4 because the final validation step is explicit rather than implicit.

5 / 5

Progressive Disclosure

The body is a well-organized overview (prohibitions, standards table, color priority) with one-level-deep, clearly signaled references to references/uncodixfy-rules.md — a real file whose '#dark-color-schemes' anchor resolves to an actual '## Dark Color Schemes' heading. Content is appropriately split (essentials inline, 30+ patterns and 19 palettes in the reference); no nesting or buried links.

5 / 5

Total

19

/

20

Passed

Description

88%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 description in third person that explicitly answers both what (enforce specific anti-AI design constraints) and when (concrete UI/frontend trigger phrases across frameworks and task types), with highly specific named patterns. Minor room to grow: a few natural user phrases are absent and the broad 'any visual interface code' trigger creates minor overlap with related frontend skills.

DimensionReasoningScore

Specificity

Concrete actions are named with specifics: 'Enforce anti-AI UI design rules based on the Uncodixfy methodology', 'Prevents generic AI aesthetic — soft gradients, glassmorphism, hero sections in dashboards, oversized rounded corners, and decorative copy', 'Applies constraints from Linear/Raycast/Stripe/GitHub design philosophy'. This matches the comprehensive multiple-specific-actions anchor; it exceeds level 4 because the enumerated patterns and named design sources leave no meaningful coverage gap.

5 / 5

Completeness

What is explicit ('Enforce anti-AI UI design rules… Prevents generic AI aesthetic… Applies constraints') and when is explicit with concrete trigger phrases ('Use when generating HTML, CSS, React, Vue, Svelte, or any frontend UI code… Triggers on UI generation, dashboard building, component creation, CSS styling, landing page design'). Both halves are clearly and explicitly answered, matching the top anchor.

5 / 5

Trigger Term Quality

Good natural coverage: 'HTML, CSS, React, Vue, Svelte', 'UI generation, dashboard building, component creation, CSS styling, landing page design', 'any frontend UI code'. A few natural phrasings users would say are still missing (e.g., 'web page', 'website', 'mockup', specific CSS frameworks like Tailwind), which is exactly the level-4 anchor rather than the comprehensive level-5 anchor, and well above level 3 since framework and task-level synonyms are present.

4 / 5

Distinctiveness Conflict Risk

The niche (anti-AI aesthetic enforcement via a named methodology) is distinct, but the trigger surface — 'any task producing visual interface code' — overlaps with general frontend/component-library skills, so it will co-trigger alongside closely related skills. This is the mostly-distinct/minor-overlap anchor, not level 5, since the trigger scope is intentionally broad.

4 / 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.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
Jamie-BitFlight/claude_skills
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.