ux-ui-animation
애니메이션 에이전트. UI 애니메이션과 트랜지션을 설계합니다.
Install with Tessl CLI
npx tessl i github:shaul1991/shaul-agents-plugin --skill ux-ui-animation33
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillValidation for skill structure
Discovery
22%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This description is too brief and vague to effectively guide skill selection. It lacks concrete actions, explicit trigger conditions, and sufficient keywords for users to naturally invoke it. The description would benefit significantly from specifying what types of animations it handles and when it should be used.
Suggestions
Add a 'Use when...' clause with trigger terms like 'animate', 'motion', 'transition effects', 'CSS animation', 'keyframes', or 'micro-interactions'
List specific concrete actions such as 'creates CSS keyframe animations, designs hover effects, implements page transitions, configures easing curves'
Include file types or frameworks if applicable (e.g., '.css', 'Framer Motion', 'GSAP', 'Lottie') to improve distinctiveness and trigger matching
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | The description only mentions 'UI 애니메이션과 트랜지션을 설계합니다' (designs UI animations and transitions) which is vague and abstract. No concrete actions like specific animation types, tools, or outputs are listed. | 1 / 3 |
Completeness | Only provides a weak 'what' (designs animations) with no 'when' clause or explicit trigger guidance. Missing any 'Use when...' statement to indicate when Claude should select this skill. | 1 / 3 |
Trigger Term Quality | Contains some relevant keywords like 'UI 애니메이션' (UI animation) and '트랜지션' (transition), but missing common variations users might say such as 'motion design', 'CSS animations', 'keyframes', 'easing', or specific framework terms. | 2 / 3 |
Distinctiveness Conflict Risk | Somewhat specific to UI animations but could overlap with general UI design skills, CSS skills, or frontend development skills. The term '애니메이션 에이전트' (animation agent) provides some distinction but the scope remains unclear. | 2 / 3 |
Total | 6 / 12 Passed |
Implementation
14%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill is essentially a placeholder that defines a role and output locations but provides no actionable guidance. It lacks any concrete examples of animation code, CSS patterns, timing functions, or motion guidelines that would actually help Claude perform the task. The content describes what the agent does rather than instructing how to do it.
Suggestions
Add concrete CSS animation examples with keyframes, timing functions, and common patterns (e.g., fade-in, slide, scale transitions)
Include specific motion guidelines with recommended duration ranges, easing curves, and accessibility considerations
Provide a workflow for creating animations: define keyframes → set timing → test accessibility → document in motion guide
Add example output formats showing what animation definitions and motion documentation should look like
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is brief and doesn't over-explain concepts Claude knows, but it's so sparse that it lacks substance rather than being efficiently dense with useful information. | 2 / 3 |
Actionability | No concrete code, commands, or executable examples provided. Only lists abstract responsibilities like '애니메이션 정의' without showing how to actually implement animations or what format to use. | 1 / 3 |
Workflow Clarity | No workflow or process steps defined. Simply lists output locations without explaining how to create animations, what validation to perform, or any sequence of operations. | 1 / 3 |
Progressive Disclosure | References output directories but provides no actual content or links to detailed documentation. The skill itself is essentially empty with no structured information to disclose. | 1 / 3 |
Total | 5 / 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
| Criteria | Description | Result |
|---|---|---|
allowed_tools_field | 'allowed-tools' contains unusual tool name(s) | Warning |
Total | 10 / 11 Passed | |
- 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.