From dylantarre-animation-principles
Use when creating motion that needs dimensional grounding, designing transforms that maintain object integrity, or ensuring animations feel structurally sound.
npx claudepluginhub joshuarweaver/cascade-content-creation-misc-1 --plugin dylantarre-animation-principlesThis skill uses the workspace's default tool permissions.
Solid drawing means creating the illusion of three-dimensional form, weight, and volume. In traditional animation, it meant understanding anatomy, perspective, and form. In digital motion, it means ensuring transforms and movements feel grounded in physical space, not flat manipulations of 2D shapes.
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
Solid drawing means creating the illusion of three-dimensional form, weight, and volume. In traditional animation, it meant understanding anatomy, perspective, and form. In digital motion, it means ensuring transforms and movements feel grounded in physical space, not flat manipulations of 2D shapes.
Form over symbol: Beginning animators draw symbols (a circle for a head, lines for arms). Master animators draw forms—volumes that exist in space with weight and dimension.
Construction consistency: Objects must maintain consistent volume and proportions throughout motion. A character's head shouldn't grow when they turn. A box shouldn't warp into a trapezoid.
Animation exists in time, but also in space. Solid drawing ensures:
Construction: Understanding what's beneath the surface—skeleton, structure Perspective: Proper foreshortening, vanishing points, spatial relationships Volume: Maintaining 3D mass during 2D representation Weight distribution: How mass shifts and settles in space Lighting consistency: Shadows and highlights that reinforce form
Squash/stretch must maintain volume: The core solid drawing constraint—deformation without mass change.
Arcs exist in 3D space: Paths must make dimensional sense, not just screen-space sense.
Follow through respects physics: Secondary elements move as 3D forms, not flat graphics.
Staging considers depth: Solid drawing enables clear spatial relationships.
For any animated object, understand:
This mental model prevents dimensional accidents.
Transform origins: Set pivot points that match object's logical center of mass Perspective transforms: Use true 3D transforms, not 2D approximations Z-index management: Consistent depth layering throughout animation Shadow animation: Shadows move and scale with object position Parallax rates: Consistent depth perception through motion
Beware of tangencies—where edges accidentally align, destroying depth perception. In motion, this means ensuring overlapping elements maintain clear spatial separation throughout animation.
Before animating, define the object's 3D form and origin point. During animation, periodically check: does this still feel like a solid object in space? Test rotations with true 3D transforms before approximating with 2D shortcuts. When motion feels "flat" or "wrong," check for solid drawing violations—inconsistent scale, broken perspective, or weightless movement.