timing-mastery — скилл для Claude Code: что делает и как установить
Задаёт ритм и длительность движений в анимации через расчёт кадров. Помогает настроить темп жестов, пауз и акцентов.
npx skills add dylantarre/animation-principles --skill timing-mastery -a claude-codeЧто делает timing-mastery
Скилл учит агента воспринимать анимацию как ритмический рисунок, где длительность каждого движения измеряется числом кадров. Он раскладывает 12 классических принципов анимации через тайминг: показывает, как задержка позы усиливает напряжение, а резкий вход меняет воспринимаемый вес объекта.
Внутри собраны практические правила для двух частых проблем: слишком быстрой суеты и вязкой медлительности. Если действие ощущается смазанным, скилл советует добавить 2–4 кадра удержания ключевой позы или замедлить выход из движения. Для вялых сцен даны советы по вырезанию промежуточных фаз и усилению контраста между быстрыми и медленными отрезками.
Главное ограничение концепции: тайминг всегда относителен, поэтому изолированный элемент без сравнения с соседними сценами не даст нужного темпоритма.
Какие задачи решает
- Рассчитать число кадров для моргания, шага или сильного удара
- Замедлить суетливое движение через удержание ключевых поз
- Ускорить вязкую анимацию за счёт сокращения промежуточных фаз
- Выстроить паузы для комических и драматических сцен
Примеры запросов агенту
- Подбери тайминг и длительность кадров для анимации удара кулаком
- Анимация интерфейсной карточки выглядит дёрганой, помоги сгладить движение
- Распиши раскадровку для цикла ходьбы персонажа
Как установить timing-mastery
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill timing-mastery -a claude-code2Вручную: положить файлы
~/.claude/skills/timing-mastery/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/timing-mastery/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill timing-mastery -a codex2Вручную: положить файлы
.agents/skills/timing-mastery/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill timing-mastery -a cursor2Вручную: положить файлы
.cursor/skills/timing-mastery/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install dylantarre/animation-principles timing-mastery2Вручную: положить файлы
.github/skills/timing-mastery/SKILL.md1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill timing-mastery -a gemini-cli2Командой платформы
gemini skills install https://github.com/dylantarre/animation-principles --path skills/02-by-thinking-style/timing-masteryВручную: положить файлы
.devin/skills/timing-mastery/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill timing-mastery -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о timing-mastery
Как установить timing-mastery в Claude Code?
Выполните команду npx skills add dylantarre/animation-principles --skill timing-mastery -a claude-code. Файл инструкции сохранится по пути ~/.claude/skills/timing-mastery/SKILL.md.
Что делает скилл timing-mastery?
Он даёт ИИ правила расчёта кадров и длительности анимации, связывая скорость движений с их весом и эмоциональным тоном.
Сколько кадров скилл рекомендует закладывать на базовые движения?
Для моргания отводится 2–4 кадра, для короткого жеста — от 6 до 8, а на один шаг в цикле походки закладывается 12–16 кадров.
Исходный текст
SKILL.md · MIT
--- name: timing-mastery description: Use when determining how fast or slow motion should be—pacing action sequences, dramatic pauses, comedic beats, or any situation where the duration of movement matters. --- # Timing Mastery Think like a drummer. Animation is rhythm made visible. The space between beats matters as much as the beats themselves. ## Core Mental Model Before animating anything, ask: **How many frames does this deserve?** Timing is the soul of animation. The same motion at different speeds tells completely different stories. Fast = light, urgent, comedic. Slow = heavy, dramatic, thoughtful. ## The 12 Principles Through Timing **Timing** — The principle itself. Count frames obsessively. A 6-frame action feels snappy. A 24-frame action feels deliberate. Know the vocabulary of duration. **Slow In & Slow Out** — Time is elastic at the edges. Actions ease into existence and settle out of motion. The middles can be fast, but beginnings and endings need breath. **Anticipation** — Timing creates suspense. Hold the anticipation longer than feels comfortable. The audience's tension builds in the pause before release. **Follow Through & Overlapping Action** — Stagger your timing. Not everything arrives at once. Lead with the main action, let secondary elements catch up on their own schedules. **Secondary Action** — Time secondary elements to complement, not compete. They should land slightly after the primary beat, like harmony following melody. **Staging** — Give the audience time to read. Fast cutting confuses. Hold important poses long enough for comprehension. Clarity requires duration. **Exaggeration** — Timing amplifies exaggeration. A long anticipation followed by instant action creates snap. Stretch time to stretch impact. **Squash & Stretch** — Speed determines deformation. Fast motion = more stretch. Impact = instant squash. The timing of shape change sells velocity. **Arcs** — Speed varies along the arc. Fastest at the bottom of a swing, slowest at the apex. Timing follows the physics of pendulums. **Appeal** — Rhythmic motion is appealing. Characters with good timing feel alive. Arrhythmic timing creates unease (useful for villains or horror). **Straight Ahead & Pose to Pose** — Time your key poses first (pose to pose), then decide how many frames connect them. Or discover timing organically (straight ahead) and refine. **Solid Drawing** — Volume must read at speed. Fast-moving objects need exaggerated stretch or motion blur. Solid drawing at the wrong timing looks frozen. ## Practical Application When action feels "rushed": 1. Add more frames to anticipation 2. Hold key poses 2-4 frames longer 3. Slow the ease-out to let actions settle 4. Insert "moving holds" instead of dead stops When action feels "sluggish": 1. Reduce in-between frames 2. Cut anticipation duration 3. Increase contrast between fast and slow sections 4. Remove frames from less important movements **Timing Chart:** - Blink: 2-4 frames - Quick gesture: 6-8 frames - Walk cycle: 12-16 frames per step - Emotional reaction: 8-12 frames + hold - Heavy impact: 2 frames contact, 12+ frames settle ## The Golden Rule **Timing is relative.** Fast only feels fast next to slow. Build contrast. Let quiet moments make loud moments louder. A pause before a punchline is what makes it land.
© dylantarre · MIT · dylantarre/animation-principles