anticipation-payoff — скилл для Claude Code: как установить
Скилл учит ИИ-агента выстраивать фазы подготовки и отдачи в анимации. Пригодится при проектировании динамичных сцен, гэгов и акцентных движений в интерфейсе или играх.
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a claude-codeЧто делает anticipation-payoff
Скилл формулирует ментальную модель «подготовка — кульминация» по аналогии с шуткой и панчлайном в комедии. Каждое движение рассматривается как короткая история с завязкой, действием и развязкой. Правила раскладывают 12 классических принципов анимации через связку подготовки и отдачи: от сжатия и растяжения до тайминга, сценичности и траекторий.
Внутри заложены четыре типа подготовки: физическая, эмоциональная, средовая и комедийная. Также даны готовые эвристики для правок. Если отдача ощущается слабой, агент увеличивает длительность или масштаб подготовки. Когда движение выглядит слишком предсказуемым, скилл рекомендует отвлечь зрителя вторичным действием или перенести подготовку на окружающую среду.
Какие задачи решает
- рассчитать тайминг и длительность подготовки перед прыжком или ударом
- исправить предсказуемую или слабую анимацию интерфейса
- добавить реакцию окружения перед кульминацией сцены
- настроить контраст между фазой накопления энергии и фазой отдачи
Примеры запросов агенту
- Анимируй кнопку подтверждения: добавь лёгкое сжатие перед нажатием и плавный отскок после него.
- Сцена прыжка персонажа выглядит вялой. Проверь подготовку и предложи, как усилить отдачу.
- Опиши ключевые позы для анимации удара сундука-ловушки с акцентом на подготовку и разрядку.
Как установить anticipation-payoff
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a claude-code2Вручную: положить файлы
~/.claude/skills/anticipation-payoff/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/anticipation-payoff/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a codex2Вручную: положить файлы
.agents/skills/anticipation-payoff/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a cursor2Вручную: положить файлы
.cursor/skills/anticipation-payoff/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install dylantarre/animation-principles anticipation-payoff2Вручную: положить файлы
.github/skills/anticipation-payoff/SKILL.md1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a gemini-cli2Командой платформы
gemini skills install https://github.com/dylantarre/animation-principles --path skills/02-by-thinking-style/anticipation-payoffВручную: положить файлы
.devin/skills/anticipation-payoff/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill anticipation-payoff -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о anticipation-payoff
Как установить anticipation-payoff в Claude Code?
Выполните в терминале команду npx skills add dylantarre/animation-principles --skill anticipation-payoff -a claude-code. Также файл инструкции можно скопировать вручную по пути ~/.claude/skills/anticipation-payoff/SKILL.md.
Что делает скилл anticipation-payoff?
Он задаёт правила построения анимаций через связку подготовки и отдачи. Агент опирается на принципы тайминга, утрирования и реакции среды, чтобы движения выглядели выразительными.
Что делать, если кульминация движения кажется слабой?
Инструкция советует продлить время подготовки, увеличить её масштаб или добавить реакцию окружения. Другой вариант — сделать контраст между подготовкой и финальным действием более резким.
Исходный текст
SKILL.md · MIT
--- name: anticipation-payoff description: Use when designing action sequences, gags, reveals, or any motion that needs setup before delivery—preparing audiences for what's coming and maximizing impact. --- # Anticipation & Payoff Think like a comedian setting up a punchline. Every great moment is earned by what came before. The windup is half the pitch. ## Core Mental Model Before animating any action, ask: **What prepares the audience for this?** Anticipation isn't just physical preparation—it's a promise. You're telling the audience "something's coming" so they're primed to receive it. The payoff is keeping that promise with interest. ## The 12 Principles Through Setup-Delivery **Anticipation** — The principle itself. Before going right, go left. Before jumping up, crouch down. The opposite direction creates spring-loaded energy. **Timing** — Setup needs time to register. Rush the anticipation and the payoff feels random. Hold it too long and tension deflates. Find the sweet spot. **Staging** — Frame the anticipation so it's unmissable. The audience can't appreciate a payoff they weren't prepared for. Clear staging of setup = satisfying delivery. **Exaggeration** — Push the anticipation to heighten payoff. A bigger windup = bigger impact. But match scales—extreme setup needs extreme delivery. **Follow Through & Overlapping Action** — Payoff has aftermath. The action doesn't end at impact; it resolves through settling motion. Let consequences play out. **Secondary Action** — Setup through supporting elements. Environment reacts to gathering energy. Other characters notice. Secondary actions can foreshadow the main event. **Slow In & Slow Out** — Ease into anticipation (building tension), snap through the action (release), ease out of payoff (resolution). The rhythm of drama. **Squash & Stretch** — Compression before extension. Squash is stored energy (setup). Stretch is released energy (payoff). Physical metaphor for narrative structure. **Arcs** — Setup and payoff follow complementary arcs. The anticipation arc winds backward; the action arc springs forward. Together they form a complete gesture. **Appeal** — Well-structured anticipation-payoff is inherently satisfying. Audiences love the rhythm of setup and delivery. It's why jokes work. **Straight Ahead & Pose to Pose** — Plan your key moments: anticipation pose, action peak, payoff pose. Then connect them. Know your destination before you travel. **Solid Drawing** — Maintain volume through the sequence. The same character in setup and payoff must read as the same mass. Consistency grounds the action. ## Practical Application **Types of Anticipation:** - Physical: Crouch before jump, pullback before throw - Emotional: Inhale before outburst, stillness before action - Environmental: Quiet before storm, calm before chaos - Comedic: Pause before punchline, look before double-take **Payoff Techniques:** - Exceed expectation: Deliver more than the setup promised - Subvert expectation: Deliver something unexpected (comedy) - Delay gratification: Multiple anticipations before one big payoff - Instant release: Snap from full anticipation to peak action When payoff feels "weak": 1. Extend anticipation duration 2. Increase anticipation magnitude 3. Add secondary anticipation cues 4. Sharpen the contrast between setup and action When setup feels "telegraphed": 1. Reduce anticipation duration 2. Distract with secondary action 3. Use environmental anticipation instead of character 4. Let payoff extend beyond expectation ## The Golden Rule **Every action is a tiny story: beginning, middle, end.** Anticipation is "once upon a time," action is "and then," payoff is "the end." Skip any chapter and the story fails.
© dylantarre · MIT · dylantarre/animation-principles