CtrlK
BlogDocsLog inGet started
Tessl Logo

antigravity-design-expert

Core UI/UX engineering skill for building highly interactive, spatial, weightless, and glassmorphism-based web interfaces using GSAP and 3D CSS.

48

1.50x
Quality

22%

Does it follow best practices?

Impact

92%

1.50x

Average score across 3 eval scenarios

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/antigravity-design-expert/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

22%Scale 1-3

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

This skill reads more like a design manifesto or persona prompt than an actionable technical skill. It explains concepts Claude already understands, lacks executable code examples for the patterns it describes, and provides no workflow for actually building components. The strongest aspect is the specific CSS values mentioned inline, but these would be far more useful embedded in complete, copy-paste ready component examples.

Suggestions

Replace the verbose design principles with 2-3 complete, executable React component examples demonstrating floating cards, glassmorphism panels, and GSAP scroll animations.

Remove the 'Role Overview' section entirely and trim explanations of well-known concepts (glassmorphism, parallax, GSAP) to save tokens.

Add a clear workflow: e.g., 1) Set up perspective container → 2) Build card component → 3) Add GSAP animations → 4) Verify prefers-reduced-motion → 5) Performance audit with will-change.

Create separate bundle files for reusable component templates and GSAP animation patterns, and reference them from the main skill.

DimensionReasoningScore

Conciseness

The content is verbose and explains many concepts Claude already knows (what glassmorphism is, what GSAP does, what React Three Fiber is, basic CSS properties). The 'Role Overview' section is pure fluff that wastes tokens telling Claude what it is. Many CSS values and concepts are over-explained rather than demonstrated.

1 / 3

Actionability

The skill provides some concrete CSS values (specific box-shadow, backdrop-filter, transform values) and specific timing guidelines (0.3s, 0.1s stagger), but lacks executable code examples. There are no copy-paste ready React components, no GSAP animation snippets, and no complete examples showing how to implement the described patterns.

2 / 3

Workflow Clarity

There is no workflow or sequenced process described. The content is a collection of design principles and rules but provides no step-by-step guidance for building a component or page. There are no validation checkpoints for ensuring animations perform well or accessibility requirements are met.

1 / 3

Progressive Disclosure

The content is organized into clear sections with emoji headers, which aids scanning. However, it's a monolithic file with no references to supporting files for detailed examples, code templates, or advanced patterns. For a skill of this complexity, separate files for example components or animation recipes would be appropriate.

2 / 3

Total

6

/

12

Passed

Description

22%Scale 1-3

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 reads like a marketing tagline rather than a functional skill description. It relies on buzzwords and adjectives ('spatial', 'weightless', 'highly interactive') without specifying concrete actions or providing explicit trigger guidance. While it names some distinctive technologies (GSAP, glassmorphism), the lack of actionable detail and a 'Use when...' clause significantly limits its effectiveness for skill selection.

Suggestions

Add a 'Use when...' clause with explicit triggers, e.g., 'Use when the user asks for glassmorphism effects, frosted glass UI, GSAP animations, 3D CSS transforms, or parallax scrolling interfaces.'

Replace abstract adjectives with concrete actions, e.g., 'Creates frosted-glass card layouts, animates page transitions with GSAP timelines, builds 3D perspective hover effects, and implements blur/transparency layering.'

Include natural keyword variations users might say, such as 'glass effect', 'blur background', 'CSS animation', 'web animation', 'frosted glass', '.css', 'hover animation'.

DimensionReasoningScore

Specificity

The description uses abstract adjectives ('highly interactive', 'spatial', 'weightless', 'glassmorphism-based') but does not list concrete actions. There are no verbs describing what the skill actually does (e.g., 'creates glass-effect cards', 'animates elements with GSAP timelines'). It reads more like a tagline than a capability list.

1 / 3

Completeness

The description partially addresses 'what' (building web interfaces with certain aesthetics) but is vague about concrete capabilities. There is no 'Use when...' clause or any explicit trigger guidance for when Claude should select this skill, which per the rubric should cap completeness at 2 at best—and since the 'what' is also weak, it scores a 1.

1 / 3

Trigger Term Quality

It includes some relevant keywords a user might say: 'glassmorphism', 'GSAP', '3D CSS', 'UI/UX'. However, it misses many natural variations users would use such as 'glass effect', 'frosted glass', 'blur background', 'parallax', 'animation', 'hover effects', 'CSS transforms', or 'web animation'.

2 / 3

Distinctiveness Conflict Risk

The mention of 'glassmorphism' and 'GSAP' provides some niche specificity, but 'UI/UX engineering' and 'web interfaces' are broad enough to overlap with many frontend or design skills. Without explicit trigger boundaries, it could conflict with general CSS, animation, or frontend development skills.

2 / 3

Total

6

/

12

Passed

Validation

90%

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

Validation — 10 / 11 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

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

Warning

Total

10

/

11

Passed

Repository
popey/claude-code-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.