skills.rest
gigun-dev
gigun-devCOMMUNITY
Explore all skills by this author →
𝕏@gigun_devGitHub

review-animations

Evaluate animation code against design engineering standards for GPU-acceleration and accessibility.

Updated Jul 10, 2026
Search Tags:#code review#performance#accessibility#css#animation#motion design
One-click install
npx skills add https://github.com/gigun-dev/caldav --skill review-animations-gigun-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: review-animations
Source: https://github.com/gigun-dev/caldav/tree/main/.claude/skills/review-animations
Command: npx skills add https://github.com/gigun-dev/caldav --skill review-animations-gigun-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill addresses the common issue of low-quality, performant-heavy, or inaccessible motion design in web interfaces by enforcing a rigorous, design-engineering-led review process.

Core Features & Use Cases

  • Standardized Review: Evaluates animation code against ten non-negotiable standards, including GPU-only properties, interruptibility, and accessibility.
  • Remedial Guidance: Provides a structured hierarchy of fixes ranging from deletion to advanced spring physics and WAAPI implementation.
  • Use Case: Use this skill when reviewing a pull request containing complex UI transitions to ensure they meet professional craft standards and do not degrade performance or accessibility.

Quick Start

Use the review-animations skill to analyze the animation code in the provided diff against the established design engineering standards.

Frequently Asked Questions about review-animations

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I review animation code for performance and accessibility issues?▼

Review animation code by evaluating it against high-craft design engineering standards, checking for GPU-accelerated properties, interruptibility, and accessibility compliance to ensure responsive motion.

What are the standards for high-craft UI transitions and motion design?▼

High-craft UI transitions require adhering to ten non-negotiable standards, including using GPU-only properties, ensuring interruptibility, and maintaining accessibility to prevent performance degradation.

How do I fix performant-heavy CSS animations in a pull request?▼

Fix performant-heavy CSS animations by following a structured hierarchy of remedial guidance, ranging from outright deletion of problematic code to implementing advanced spring physics and WAAPI.

Does this animation review process support gesture-driven interaction code?▼

Yes, the animation review process explicitly applies to gesture-driven interaction code, evaluating transition logic and UI component motion against responsive and performant design standards.

When should I enforce interruptibility standards in web animation code?▼

Enforce interruptibility standards whenever reviewing complex UI transitions or motion design in web interfaces to guarantee that ongoing animations do not degrade performance or block user interactions.

Related Skills

Explore More Design & Creative Skills→
47thtechcorner47thtechcorner
21

framer-motion

Implement Disney's 12 animation principles with Framer Motion in React.

Community
Intermediate
shirulotshirulot

ui-animation

Design, implement, and debug UI animations with CSS transitions, WAAPI, and spring physics.

Community
Advanced
Alfie728Alfie728

web-animation-design

Design web animations with timing, easing, and accessibility guidelines.

Community
Advanced
89jobrien89jobrien
4

web-accessibility

Audit web content for WCAG 2.1/2.2 conformance and accessibility issues.

Community
Advanced