AI Skill Report Card
Animating Cat Movements
YAML--- name: animating-cat-movements description: Creates realistic cat animations with lifelike paw movements using SkiaSharp. Use when building interactive pet simulations, educational animal content, or whimsical UI elements requiring fluid feline motion. ---
Animating Cat Movements
Quick Start15 / 15
CSHARPusing SkiaSharp; public class CatPawAnimation { private float timeElapsed = 0f; private SKPoint pawPosition; private float stepCycle = 0f; public void DrawWalkingCat(SKCanvas canvas, float deltaTime) { timeElapsed += deltaTime; stepCycle = (timeElapsed * 2.0f) % (2.0f * MathF.PI); // Front paw lift follows sine wave with offset float frontPawLift = MathF.Max(0, MathF.Sin(stepCycle)) * 8f; float backPawLift = MathF.Max(0, MathF.Sin(stepCycle + MathF.PI)) * 6f; DrawPaw(canvas, new SKPoint(100, 200 - frontPawLift), PawType.Front); DrawPaw(canvas, new SKPoint(80, 202 - backPawLift), PawType.Back); } }
Recommendation▾
Add concrete input/output examples with actual SKCanvas drawing calls and visual descriptions of the resulting animation frames
Workflow15 / 15
Progress:
- Setup animation timing - Define frame rate (60fps) and step duration (0.6s per step)
- Create paw lift cycles - Use sine waves with phase offsets for natural gait
- Add subtle body sway - 2-3 pixel horizontal movement per step
- Implement paw placement - Slight curve inward on landing, splayed toes
- Apply easing functions - Ease-out for paw lifts, ease-in for placement
- Add secondary animation - Tail swish, ear twitches, whisker movement
Gait Pattern Implementation
- Walking Gait - Diagonal pairs move together (front-left with back-right)
- Step Timing - 600ms per full step cycle
- Paw Phases:
- Lift: 0-150ms (ease-out cubic)
- Forward: 150-300ms (linear)
- Lower: 300-450ms (ease-in cubic)
- Ground: 450-600ms (static)
Recommendation▾
Include a complete working example that demonstrates the full animation pipeline from setup to rendering
Examples18 / 20
Example 1: Idle Sitting Cat Input: Cat in sitting position, occasional movements
CSHARPfloat breathCycle = MathF.Sin(timeElapsed * 1.5f) * 2f; float tailSwish = MathF.Sin(timeElapsed * 0.8f + 1.2f) * 15f; DrawCatBody(canvas, baseY + breathCycle, tailAngle: tailSwish);
Output: Gentle breathing motion with periodic tail movement
Example 2: Prowling/Stalking Input: Slow, cautious movement with low body posture
CSHARPfloat prowlSpeed = 0.3f; float bodyLower = 8f; // Crouch lower float pawLift = MathF.Max(0, MathF.Sin(stepCycle * prowlSpeed)) * 4f; // Smaller steps
Output: Deliberate, silent movement with minimal paw lifting
Recommendation▾
Provide specific numeric values for animation parameters (speeds, distances, angles) rather than general ranges
Best Practices
Motion Curves
- Use
SKPathEffect.CreateCornerPath()for smooth paw trajectories - Apply 3-frame motion blur for paws during rapid movement
- Implement anticipation frames before direction changes
Timing Intervals
- Walking: 600ms step cycle
- Trotting: 400ms step cycle
- Running: 200ms step cycle with extended stride
Paw Details
- Draw individual toe pads when stationary
- Compress paw shape slightly on ground contact
- Add subtle rotation during step cycle (5-8 degrees)
Performance
- Cache paw shapes as
SKPathobjects - Use
SKCanvas.Save()/Restore()for transformations - Batch similar drawing operations
Common Pitfalls
Avoid Mechanical Movement
- Don't use linear interpolation for organic motion
- Never synchronize all four paws - cats use diagonal gait patterns
- Don't ignore weight distribution - stationary paws should show slight compression
Timing Errors
- Don't make steps too uniform - add 5-10% random variance
- Avoid instant direction changes - cats anticipate turns
- Don't forget recovery time between complex movements
Visual Mistakes
- Don't draw paws as perfect circles - cats have elongated, asymmetrical pads
- Avoid static tail - even sleeping cats have subtle tail movement
- Don't neglect secondary motion in ears, whiskers, and fur
Performance Issues
- Don't recalculate trigonometric functions every frame - cache common values
- Avoid creating new SKPaint objects in animation loops
- Don't render off-screen elements - implement frustum culling