动画
UI 动画与过渡效果
Animation Principles - Intermediate
dylantarre
Use when someone has working knowledge of animation principles and needs guidance on combining them effectively in more complex animations
accessible-motion
dylantarre
Use when implementing reduced motion alternatives, vestibular-safe animations, WCAG compliance, or designing for users with motion sensitivity.
problem-diagnosis
dylantarre
Use when animation "feels wrong" but you can't pinpoint why—debugging floaty movement, stiff characters, unclear action, or any motion that isn't working and needs systematic troubleshooting.
Animation Principles - Refresher
dylantarre
Use when an experienced animator needs a quick reminder of the 12 principles without basic explanations
timing-mastery
dylantarre
Use when determining how fast or slow motion should be—pacing action sequences, dramatic pauses, comedic beats, or any situation where the duration of movement matters.
character-appeal
dylantarre
Use when creating or animating characters that need to connect with audiences—hero protagonists, memorable villains, lovable sidekicks, or any figure that must have personality and presence.
naturalistic-motion
dylantarre
Use when animation should feel organic and lifelike—creature animation, realistic characters, nature elements, or any motion that needs to breathe with authentic living quality.
exaggerated-clarity
dylantarre
Use when motion needs to read clearly and powerfully—broad comedy, action highlights, important story beats, or any moment that must unmistakably communicate to the audience.
Animation Principles - Universal Reference
dylantarre
Use when discussing animation principles with users of unknown skill level, or when providing a balanced reference that works for any experience level
validating-accessibility
fusengine
Use when checking accessibility, color contrast, keyboard navigation, ARIA, or WCAG compliance. Covers WCAG 2.2 Level AA requirements.
frontend-design
revokslab
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
Claude-Command-Suite
qdhenry
```
live2d-control
RTGS2017
控制 Live2D 虚拟形象的表情和动作。当 AI 回复表达肯定/同意时触发点头动画,表达否定/拒绝时触发摇头动画。用于增强虚拟形象的情感表达。
rendiv-video
thecodacus
Guidance for building programmatic videos with rendiv — a React/TypeScript framework for composing video scenes, animating with springs and interpolation, and rendering to MP4/WebM. Use when writing or modifying rendiv compositions, working with rendiv animation APIs, or setting up a rendiv project.
image-to-video
eachlabs
Transform static images into dynamic videos using each::sense AI. Create animations, Ken Burns effects, cinemagraphs, product showcases, and motion graphics from still photos.
eachlabs-video-generation
eachlabs
Generate new videos from text prompts, images, or reference inputs using EachLabs AI models. Supports text-to-video, image-to-video, transitions, motion control, talking head, and avatar generation. Use when the user wants to create new video content. For editing existing videos, see eachlabs-video-edit.
review-animations
hushh-labs
Reviews animation and motion code against a high craft bar derived from Emil Kowalski's design engineering philosophy. Default to flagging; approval is earned.
game-engines
pluginagentmarketplace
Master game engines - Unity, Unreal Engine, Godot. Engine-specific workflows, systems architecture, and production best practices.
Pixel Art Animator
willibrandon
Create and manage sprite animations with multiple frames, animation tags, frame durations, and linked cels. Use when the user wants to animate a sprite, add animation, create movement, make it move, mentions "animation", "animated", "frames", "keyframes", "frame rate", "FPS", "timing", "duration", "walk cycle", "run cycle", "idle animation", "attack animation", "jump", "movement", "motion", or describes actions like "walking", "running", "jumping", "attacking", "breathing", "bobbing", "bouncing". Trigger on animation tags, loops, playback, sequences, "add frames", "duplicate frame", "frame timing", "ping-pong", "loop", "sequence". Also for linked cels, static backgrounds, and frame optimization.
Animation Principles - Deep Dive
dylantarre
Use when someone needs comprehensive reference material on animation principles with technical depth and extensive context
styling-with-tailwind
tenequm
Creates UIs using Tailwind CSS utility classes and shadcn/ui patterns. Covers CSS variables with OKLCH colors, component variants with CVA, responsive design, dark mode, and Tailwind v4.2 features. Supports Radix UI and Base UI primitives, CLI 3.0, and visual styles. Use when building interfaces with Tailwind, styling shadcn/ui components, implementing themes, or working with utility-first CSS.
Flow
simota
ããã¼å¹æããã¼ãã£ã³ã°ç¶æ ãã¢ã¼ãã«é·ç§»ãªã©ã®CSS/JSã¢ãã¡ã¼ã·ã§ã³ãå®è£ ãUIã«åããä»ããããã¤ã³ã¿ã©ã¯ã·ã§ã³ãæ»ããã«ãããæã«ä½¿ç¨ã
interactive-states
fusengine
Use when implementing button states, form field states, or interactive feedback. Covers hover, active, focus, disabled, loading states.
Dot
simota
ピクセルアート専門エージェント。コード(SVG/Canvas/Phaser 3/Pillow/CSS)でドット絵を生成する。Gemini CLIへのSVG生成委譲もサポート。