emotional-narrative — Claude Code skill: animation with feeling
A skill for animation work where motion has to carry feeling: character moments, dramatic beats, any shot the audience should care about.
npx skills add dylantarre/animation-principles --skill emotional-narrative -a claude-codeWhat emotional-narrative does
The skill gives an AI agent a storyteller's frame for animation. Every movement is a sentence, every pause is punctuation, and before touching a curve the agent answers one question: what should the audience feel right now? The same walk cycle reads as confidence, defeat or joy depending on how it is played.
The body of the file walks through the twelve animation principles from an emotional angle. Anticipation becomes emotional setup, staging becomes the emotional spotlight, timing becomes the duration of a feeling, exaggeration becomes a way to make an inner state readable. Two troubleshooting sections cover motion that feels empty or mechanical, and emotion that tips into melodrama. The advice there is to name the character's feeling and find the gesture for it, or to pull back the exaggeration and add a contradicting secondary action.
It is a text skill: a single SKILL.md with the method, no scripts and no external dependencies. It installs into Claude, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode. If you animate UI transitions and micro-interactions rather than characters, you will have to translate the appeal and secondary-action ideas into interface terms yourself, because the examples stay on the character side.
What it helps with
- make a character's movement readable without dialogue
- diagnose why an animation feels mechanical
- pick timing that matches the feeling of a scene
- dial back melodrama in an emotional beat
- tie a character's gesture to their inner state
Example prompts for the agent
- run this animation through the emotional-narrative skill, the motion feels empty and I want to know why
- the character should recover slowly after the hit, not snap back — apply emotional-narrative to the follow through
- this is a farewell scene with a dramatic beat, what does emotional-narrative say about timing and pauses
How to install emotional-narrative
1Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill emotional-narrative -a claude-code2Manually: put the files in place
~/.claude/skills/emotional-narrative/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/emotional-narrative/
1Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill emotional-narrative -a codex2Manually: put the files in place
.agents/skills/emotional-narrative/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill emotional-narrative -a cursor2Manually: put the files in place
.cursor/skills/emotional-narrative/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install dylantarre/animation-principles emotional-narrative2Manually: put the files in place
.github/skills/emotional-narrative/SKILL.md1Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill emotional-narrative -a gemini-cli2Platform CLI
gemini skills install https://github.com/dylantarre/animation-principles --path skills/02-by-thinking-style/emotional-narrativeManually: put the files in place
.devin/skills/emotional-narrative/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill emotional-narrative -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about emotional-narrative
How do I install emotional-narrative in Claude?
Run npx skills add dylantarre/animation-principles --skill emotional-narrative -a claude-code. The skill lands at ~/.claude/skills/emotional-narrative/SKILL.md.
What does emotional-narrative do?
It gives the agent a method for animating through emotion: the twelve principles read from the character's point of view, plus fixes for motion that feels empty or overplayed.
Which platforms support the emotional-narrative skill?
Claude, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode, each with its own install command.
Source text
SKILL.md · MIT
--- name: emotional-narrative description: Use when animation needs to convey feeling, tell a story, or connect emotionally—character moments, dramatic beats, or any motion that should make the audience care. --- # Emotional Narrative Think like a storyteller who draws. Every movement is a sentence. Every pause is punctuation. You're not animating shapes—you're animating feelings. ## Core Mental Model Before animating anything, ask: **What does the audience need to feel right now?** The same walk cycle can convey confidence, defeat, nervousness, or joy. Motion is emotion made visible. ## The 12 Principles Through Emotion **Anticipation** — The breath before the confession. Anticipation isn't just physical preparation; it's emotional setup. The audience leans in because they sense something is coming. **Staging** — Direct the emotional spotlight. What matters most in this moment? Everything else recedes. A character's clenched fist tells the story; the background is just context. **Timing** — Emotion lives in duration. A quick glance says curiosity. A lingering look says longing. The same motion, different timing, completely different feeling. **Exaggeration** — Amplify truth, not falsehood. A sad character doesn't just frown—their whole body sinks. Exaggeration makes internal states external and readable. **Appeal** — Characters must be emotionally accessible. We connect with vulnerability, desire, struggle. Even villains need appeal—we must find them fascinating to watch. **Secondary Action** — Supporting emotions. A character says they're fine while their hands fidget. Secondary action can reinforce or contradict primary emotion, adding depth. **Follow Through & Overlapping Action** — Emotional momentum. Feelings don't stop on a dime. After a shock, the body keeps processing. After joy, the smile lingers. **Slow In & Slow Out** — Emotional transitions. We don't snap from happy to sad. Ease into new emotions. Let the audience travel with the character. **Arcs** — Emotional gestures flow. A reaching hand follows a yearning arc. Angular, broken motion reads as distress or mechanical coldness. **Squash & Stretch** — Emotional elasticity. Joyful characters feel bouncy. Depressed characters feel heavy and compressed. The body reflects the inner state. **Straight Ahead & Pose to Pose** — Spontaneous emotion (straight ahead) vs. crafted emotional beats (pose to pose). Use both. Plan the key emotional moments, discover the transitions. **Solid Drawing** — Emotional consistency. A character's design language should support their emotional role. Round shapes comfort; sharp shapes threaten. ## Practical Application When motion feels "empty" or "mechanical": 1. Clarify: What is this character feeling? 2. Find the gesture that embodies that emotion 3. Use timing to give the audience space to feel 4. Add subtle secondary actions that reveal inner state When emotion feels "melodramatic": 1. Pull back exaggeration slightly 2. Add contradicting secondary action (complexity) 3. Trust stillness—sometimes less movement is more feeling 4. Check that timing allows breathing room ## The Golden Rule **Motion without emotion is just movement.** Every frame should serve the story. Ask not "What happens?" but "What does this mean?"
© dylantarre · MIT · dylantarre/animation-principles