CtrlK
BlogDocsLog inGet started
Tessl Logo

high-end-visual-design

Teaches the AI to design like a high-end agency. Defines the exact fonts, spacing, shadows, card structures, and animations that make a website feel expensive. Blocks all the common defaults that make AI designs look cheap or generic.

65

Quality

78%

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 ./plugins/community/agent-skill-principal-ui-ux-architect-motion-choreographer-awwwards-tier-mqu4mbbj/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

85%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 content is highly actionable with concrete class snippets, a clear execution protocol, and a validation checklist, all well-organized in one level. Its main weakness is repeated marketing-style padding that inflates token usage without adding instruction.

Suggestions

Trim motivational hype phrases ('$150k+ agency-level', 'obsessive', 'flawless', 'unbelievably soft') to pure directives to improve token efficiency.

Consider one complete end-to-end component example (e.g. a full Double-Bezel card) to bridge the individual class snippets into a runnable whole.

If detailed archetype catalogs grow, move the full Vibe/Layout archetype tables into a referenced file to keep SKILL.md as a lean overview.

DimensionReasoningScore

Conciseness

The body is mostly efficient and assumes Claude's competence with no basic-concept padding, but recurring hype phrases ('$150k+ agency-level', 'obsessive micro-interactions', 'flawless fluid motion', 'unbelievably soft') add motivational fluff that could be trimmed.

3 / 5

Actionability

Guidance is copy-paste ready: exact Tailwind classes (rounded-[2rem], shadow-[inset_0_1px_1px_rgba(255,255,255,0.15)], ease-[cubic-bezier(0.32,0.72,0,1)]), color values, and paddings cover the common cases of cards, buttons, nav, and motion.

5 / 5

Workflow Clarity

Section 7 gives a clear 5-step execution sequence and Section 8 provides an explicit 11-item pre-output checklist acting as a validation checkpoint; the skill is generative (non-destructive), so no validation cap applies.

5 / 5

Progressive Disclosure

A self-contained ~100-line document with well-organized numbered sections (1-8), clear headers, and a checklist; the only bundle files are provenance/source artifacts the body does not reference, so single-level structure scores high per the simple-skill guidance.

5 / 5

Total

18

/

20

Passed

Description

71%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 specific and action-oriented with good natural trigger phrasing, but it lacks an explicit 'Use when...' clause, capping its completeness. Adding concrete usage triggers would raise the score.

Suggestions

Add an explicit 'Use when...' clause naming concrete triggers, e.g. 'Use when building marketing sites, landing pages, or any UI that must look premium.'

Include common user synonyms/file contexts ('landing page', 'UI design', 'redesign', 'polish a design') to broaden natural trigger coverage.

Tighten the distinctiveness by scoping to web/UI visual design specifically, reducing overlap with general frontend or branding skills.

DimensionReasoningScore

Specificity

Lists multiple concrete actions across the design domain — 'Defines the exact fonts, spacing, shadows, card structures, and animations' plus 'Blocks all the common defaults' — giving comprehensive coverage rather than just one or two.

5 / 5

Completeness

The 'what' is clear and concrete, but there is no explicit 'Use when...' clause or equivalent trigger guidance, so per the rubric cap the weakly-implied 'when' holds completeness at 3.

3 / 5

Trigger Term Quality

Natural phrasings like 'design like a high-end agency', 'website feel expensive', and 'AI designs look cheap or generic' are things users might say, but common synonyms such as 'UI design', 'landing page', 'polish', or 'redesign' are missing.

4 / 5

Distinctiveness Conflict Risk

The high-end-agency / anti-cheap-defaults niche is mostly distinct from general coding skills, though 'design like an agency' is broad enough to overlap with other web/design skills.

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
nexu-io/open-design
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.