wilwaldon

Redesign Animations — Design skill for Claude Code

Design community

Read CLAUDE.md in this repo — specifically the Animation rules in the Design Rules section.

How to install Redesign Animations

Installs to ~/.claude/commands/wilwaldon-lets-go-redesign-animations.md

Terminal
mkdir -p ~/.claude/commands && curl -fsSL https://raw.githubusercontent.com/wilwaldon/lets-go/HEAD/.claude/commands/redesign-animations.md -o ~/.claude/commands/wilwaldon-lets-go-redesign-animations.md

Restart Claude Code, or start a new session, for it to be picked up.

What Redesign Animations does

Read CLAUDE.md in this repo — specifically the Animation rules in the Design Rules section.

The user wants to improve animations, interactions, and micro-interactions on their site to make it feel more polished and responsive.

**Step 1 — Audit current animations:**

Read all HTML, CSS, and JavaScript files. Check for:

Scroll Animations:

  • Sections fade in on scroll (IntersectionObserver)
  • Cards stagger entrance
  • Hero elements have staggered entrance

Hover States:

  • Cards respond to

Alternatives in Design

  • Design Expert — Apply expert UX/UI design thinking to design, redesign, enhance, or fix any interface element with meticulous 348 ★
  • Platform Design Skills — 300+ design rules from Apple HIG, Material Design 3, and WCAG 2.2 for cross-platform apps 261 ★
  • 2 — Build a high-fidelity, responsive, dark-themed hero section for a SaaS product called "Taskora" using React, T 152 ★

Full documentation available on GitHub

View Source Repository