MCPInstall

naturalistic-motion

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.

Installs
537
Last 24h
—
Trending rank
—
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/dylantarre/animation-principles --skill naturalistic-motion
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads naturalistic-motion automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Naturalistic Motion

Think like a biologist watching life unfold. Nothing in nature moves mechanically. Everything breathes, adjusts, responds. Life is continuous subtle motion.

Core Mental Model

Before animating anything alive, ask: What is this creature feeling and responding to?

Living things are never truly still. They shift weight, breathe, notice, adjust. Naturalistic motion isn't about copying reality—it's about capturing aliveness.

The 12 Principles Through Organic Life

Secondary Action — Life is layered motion. While a character talks, they breathe. While they breathe, they blink. While they blink, their weight shifts. Stack subtle actions.

Follow Through & Overlapping Action — Bodies are systems of connected parts. Movement cascades through joints and soft tissue. Nothing moves in isolation.

Arcs — Nature abhors straight lines. Every joint creates rotation. Every movement traces curves. Study the path of a hand gesture—it's never linear.

Slow In & Slow Out — Organic motion accelerates and decelerates continuously. Muscles engage and release. This is what makes movement look "alive" rather than robotic.

Timing — Life has varied timing. Quick glances, slow stretches, medium walks. The diversity of speeds creates believable organism behavior.

Squash & Stretch — Flesh is malleable. Skin wrinkles, muscles bulge, fat jiggles. Even subtle squash and stretch sells organic tissue.

Anticipation — Living things telegraph intention. Watch a cat before it pounces. The body organizes itself before action. Include preparatory micro-movements.

Solid Drawing — Anatomy matters. Understand skeletal structure, muscle groups, and how they connect. Organic motion respects physical construction.

Appeal — Naturalistic doesn't mean realistic. Appealing organic motion is idealized life—the essence of a cat, not a veterinary diagram.

Exaggeration — Subtle exaggeration. Naturalistic motion pushes organic qualities just 10-20% past reality. Enough to read clearly, not enough to break believability.

Staging — Let organic motion read. Don't let naturalistic complexity become visual noise. Clarity serves believability.

Straight Ahead & Pose to Pose — Organic motion often benefits from straight ahead animation for its emergent quality. Let movement discover itself.

Practical Application

Signs of Life:

  • Breathing: Constant subtle chest/belly movement
  • Weight shifts: Never perfectly balanced
  • Micro-saccades: Eyes are never frozen
  • Postural adjustments: Comfort-seeking behavior
  • Environmental awareness: Reactions to sound, light, temperature

Common Naturalistic Mistakes:

  • Twinning: Both arms doing exactly the same thing (never happens in nature)
  • Perfect symmetry: Living poses are asymmetrical
  • IK lock: Limbs shouldn't feel pinned to points in space
  • Mechanical timing: Uniform speed reads as robotic

When motion feels "dead":

  1. Add breathing rhythm
  2. Introduce subtle weight shifts
  3. Offset timing between left/right
  4. Include environmental micro-reactions

When motion feels "noisy":

  1. Reduce secondary motion layers
  2. Clarify the primary intention
  3. Slow down and simplify
  4. Establish clearer pose hierarchies

Reference is Essential:

  • Study video reference of real creatures
  • Film yourself performing the action
  • Watch slow-motion footage to understand mechanics
  • Observe animals at rest, not just in action

The Golden Rule

Living things are always doing something, even when doing nothing. The baseline state of life is gentle motion. Stillness in animation equals death. Let your creatures breathe.

FAQ

What does the naturalistic-motion skill do?

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.

How do I install naturalistic-motion?

Run npx skills add https://github.com/dylantarre/animation-principles --skill naturalistic-motion in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/naturalistic-motion/ (personal) or .claude/skills/naturalistic-motion/ (project).

Which AI agents can use naturalistic-motion?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is naturalistic-motion safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains naturalistic-motion?

It is published by dylantarre in dylantarre/animation-principles. It has 537 recorded installs.

More from dylantarre/animation-principles

View all →

video-motion-graphics

dylantarre/animation-principles

Use when creating After Effects compositions, Premiere Pro motion, video titles, explainer videos, or broadcast motion graphics.

Media & Creative2.4K installs

mobile-touch

dylantarre/animation-principles

Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

Mobile2.4K installs

framer-motion

dylantarre/animation-principles

Use when implementing Disney's 12 animation principles with Framer Motion in React applications

Frontend & Design1.7K installs

motion-designer

dylantarre/animation-principles

Use when designing visual motion systems, creating animation specifications, or when a designer needs guidance on crafting beautiful, meaningful movement.

Frontend & Design1.6K installs

micro-interactions

dylantarre/animation-principles

Use when designing small UI feedback moments like button states, toggles, form validation, loading indicators, or notification badges.

Frontend & Design1.4K installs

web-motion-design

dylantarre/animation-principles

Use when building CSS animations, JavaScript transitions, React/Vue motion, or any browser-based animation work.

Frontend & Design1.3K installs

Popular frontend & design skills

View category →

setup-matt-pocock-skills

mattpocock/skills

Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.

Frontend & Design1.1M installs

frontend-design

anthropics/skills

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.

OfficialFrontend & Design1M installs

hyperframes-animation

heygen-com/hyperframes

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.

prototype

mattpocock/skills

Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.

Frontend & Design999.2K installs

hyperframes-core

heygen-com/hyperframes

The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.

Frontend & Design930.5K installs

vercel-react-best-practices

vercel-labs/agent-skills

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

OfficialFrontend & Design843.1K installs