CtrlK
BlogDocsLog inGet started
Tessl Logo

design-spells

Curated micro-interactions and design details that add "magic" and personality to websites and apps.

51

Quality

56%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./plugins/AI-Agents-Safe-Coding-Skills/skills/design-spells/SKILL.md

The canonical home for this skill is design-spells in administrakt0r/AI-Agents-Safe-Coding-Skills

SKILL.md
Quality
Evals
Security

Quality

Content

63%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 well-structured for a simple single-purpose skill and the workflow is clearly sequenced, but it stays at a high level with no code or concrete pattern examples and carries some marketing padding. Adding one executable example and trimming booster language would lift conciseness and actionability.

Suggestions

Add a minimal copy-paste code example for one representative spell (e.g., a magnetic hover button in CSS/JS) to make guidance executable.

Insert an explicit validate/test checkpoint in the workflow (e.g., 'Test on real devices at 60fps and check for layout shifts before shipping').

Trim marketing filler ('silky-smooth', 'genuinely magical', 'ABSOLUTE MANDATE') to tighten the token budget.

DimensionReasoningScore

Conciseness

Mostly efficient with clear sections, but includes marketing-style filler ('silky-smooth performance', 'genuinely magical', 'ABSOLUTE MANDATE') and an opening paragraph describing what the site is that Claude could infer.

3 / 5

Actionability

Names concrete tools (CSS, Anime.js, Framer Motion) and a concrete source (designspells.com), but gives no executable code, no specific pattern examples, and only high-level adaptation steps.

3 / 5

Workflow Clarity

The four-step Execution Workflow (Identify → Research → Adapt → Implement) is a clear sequence, though it lacks an explicit validate/test checkpoint despite the Quality Execution rule implying one.

4 / 5

Progressive Disclosure

Under 50 lines with no need for external references beyond the website, organized into well-labeled sections (Context, When to Use, Execution Workflow, Strict Rules), meeting the simple-skill exception.

5 / 5

Total

15

/

20

Passed

Description

48%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 clearly names its design micro-interaction niche but lacks explicit trigger guidance and concrete action verbs, leaving its 'when to use' implicit. It is distinctive enough to avoid most conflicts but would benefit from a Use-when clause.

Suggestions

Add an explicit 'Use when...' clause naming concrete triggers (e.g., 'Use when polishing a finished feature with a wow factor, designing creative hover states, or adding easter eggs').

Replace generic phrasing with concrete capability verbs (e.g., 'Adapts micro-interaction patterns from designspells.com into CSS, Anime.js, or Framer Motion implementations').

Include natural synonyms users say ('animations', 'transitions', 'delightful interactions') to broaden trigger-term coverage.

DimensionReasoningScore

Specificity

Names the domain ('micro-interactions and design details', 'websites and apps') but the only actions are the generic 'Curated' and 'add magic and personality', with no concrete capability verbs.

2 / 5

Completeness

Has a clear 'what' (a curated collection of design details that add magic) but no explicit 'Use when...' trigger clause, capping completeness at 3 per the rubric guideline.

3 / 5

Trigger Term Quality

Includes some natural terms a user might say ('micro-interactions', 'magic', 'personality') but misses common variations like 'animations', 'hover states', 'delight', or 'easter eggs' that the body itself mentions.

3 / 5

Distinctiveness Conflict Risk

The 'micro-interactions and design details that add magic and personality' niche is mostly distinct, with only minor overlap risk against general brand/styling skills.

4 / 5

Total

12

/

20

Passed

Validation

93%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
administrakt0r/AI-Agents-Safe-Coding-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.