universal-practitioner — скилл для Claude Code: 12 принципов анимации
Скилл, который применяет 12 принципов анимации Диснея к интерфейсам, текстам и продуктовым решениям — не только к мультипликации.
npx skills add dylantarre/animation-principles --skill universal-practitioner -a claude-codeЧто делает universal-practitioner
Скилл описывает 12 принципов анимации и переводит каждый в общее правило: squash and stretch показывает, что объект реагирует на воздействие; anticipation готовит к переменам; staging требует одной ясной мысли за раз. Дальше идёт таблица применений — в письме, презентации, продукте, руководстве, преподавании, продажах, дизайне.
Внутри один файл SKILL.md с разбором принципов и мета-принципом: всё сводится к эмпатии к тому, кто это смотрит. Агент обращается к скиллу, когда нужен общий взгляд на принципы анимации в любом контексте и для любой роли.
Полезно, когда вы просите агента оживить интерфейс, но не хотите получать список из двенадцати пунктов без связи с задачей. Скилл задаёт рамку, а не готовые значения таймингов.
Какие задачи решает
- объяснить, почему кнопка должна реагировать на нажатие
- выстроить переход между состояниями экрана без рывка
- выбрать между свободным прототипированием и жёсткой структурой
- показать последствия изменения в одном месте системы
- сделать акцент на главном, убрав лишнее из кадра
Примеры запросов агенту
- Примени принципы анимации к этому экрану: где не хватает anticipation и follow through?
- Разбери этот переход по slow in и slow out — что подкрутить?
- Используй universal-practitioner, чтобы оценить сценарий онбординга
Как установить universal-practitioner
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill universal-practitioner -a claude-code2Вручную: положить файлы
~/.claude/skills/universal-practitioner/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/universal-practitioner/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill universal-practitioner -a codex2Вручную: положить файлы
.agents/skills/universal-practitioner/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill universal-practitioner -a cursor2Вручную: положить файлы
.cursor/skills/universal-practitioner/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install dylantarre/animation-principles universal-practitioner2Вручную: положить файлы
.github/skills/universal-practitioner/SKILL.md1Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill universal-practitioner -a gemini-cli2Командой платформы
gemini skills install https://github.com/dylantarre/animation-principles --path skills/03-by-role-persona/universal-practitionerВручную: положить файлы
.devin/skills/universal-practitioner/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add dylantarre/animation-principles --skill universal-practitioner -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Из того же набора86
Похожие
Рядом в теме «Дизайн»
Всё по теме «Дизайн» →Вопросы о universal-practitioner
Как установить universal-practitioner в Claude?
Выполните npx skills add dylantarre/animation-principles --skill universal-practitioner -a claude-code. Файл скилла окажется по пути ~/.claude/skills/universal-practitioner/SKILL.md.
Что делает universal-practitioner?
Разбирает 12 принципов анимации Диснея и показывает, как применять их за пределами анимации: в текстах, презентациях, продукте и дизайне.
Скилл только про анимацию?
Нет. Внутри есть таблица кросс-доменных применений, а мета-принцип сводится к вопросу, служит ли решение тому, кто его воспринимает.
Исходный текст
SKILL.md · MIT
--- name: universal-practitioner description: Use when applying animation principles in any context, for any role, or when a general understanding of Disney's 12 principles is needed. --- # Universal Practitioner: Animation Principles for Everyone You apply Disney's 12 Animation Principles across any domain. These principles transcend animation—they're about bringing life and clarity to any experience. ## The 12 Principles: Universal Application ### 1. Squash and Stretch **Principle**: Flexibility indicates life; rigidity indicates death. **Universal Truth**: Show that things are affected by forces. Buttons respond to clicks. Arguments bend under pressure. Ideas flex to circumstances. **Apply When**: You need to convey that something is alive, responsive, or affected by interaction. ### 2. Anticipation **Principle**: Prepare the audience for what's coming. **Universal Truth**: People understand better when they're ready. Announce changes. Build up to reveals. Signal before acting. **Apply When**: Before any significant change, action, or revelation. ### 3. Staging **Principle**: Present one clear idea at a time. **Universal Truth**: Clarity requires focus. Remove distractions. Highlight what matters. Guide attention deliberately. **Apply When**: Communicating anything important—one thing, clearly, completely. ### 4. Straight Ahead vs Pose to Pose **Principle**: Spontaneous flow vs planned precision. **Universal Truth**: Some work needs organic discovery (brainstorming). Some needs careful structure (execution). Know which mode you're in. **Apply When**: Choosing between exploration and implementation approaches. ### 5. Follow Through and Overlapping Action **Principle**: Actions have consequences that ripple outward. **Universal Truth**: Nothing exists in isolation. Changes cascade. Effects follow causes. Consider the ripples. **Apply When**: Analyzing impact, designing systems, understanding consequences. ### 6. Slow In and Slow Out **Principle**: Ease into and out of states. **Universal Truth**: Transitions matter. Don't jolt between states. Gradual shifts feel natural; abrupt changes feel jarring. **Apply When**: Managing change, onboarding, transitions of any kind. ### 7. Arc **Principle**: Natural movement follows curves. **Universal Truth**: Life isn't linear. Growth curves. Learning curves. Story arcs. Honor the natural shape of progress. **Apply When**: Planning journeys, narratives, progressions, or paths. ### 8. Secondary Action **Principle**: Supporting details that reinforce the main point. **Universal Truth**: Primary message needs supporting evidence. Main action needs context. Big ideas need small details. **Apply When**: Reinforcing messages, adding depth, building credibility. ### 9. Timing **Principle**: Speed communicates weight and importance. **Universal Truth**: Pacing affects perception. Fast feels urgent or trivial. Slow feels important or boring. Match timing to meaning. **Apply When**: Presentations, conversations, reveals, any communication. ### 10. Exaggeration **Principle**: Push beyond normal for clarity. **Universal Truth**: Sometimes subtlety obscures. Make differences visible. Amplify distinctions. Don't let important things go unnoticed. **Apply When**: Making contrasts clear, emphasizing key points, breaking through noise. ### 11. Solid Drawing **Principle**: Understand structure and maintain consistency. **Universal Truth**: Know the fundamentals. Maintain internal logic. Build on solid foundations. Consistency builds trust. **Apply When**: Establishing systems, building credibility, maintaining standards. ### 12. Appeal **Principle**: Make things people want to engage with. **Universal Truth**: Craft matters. Quality attracts. Attention to detail signals care. People choose appealing options. **Apply When**: Everything. Always. Appeal isn't decoration—it's respect for your audience. ## Cross-Domain Applications | Domain | Example Application | |--------|-------------------| | Writing | Anticipation in opening hooks | | Presentation | Staging for slide composition | | Product | Timing for feature rollouts | | Leadership | Follow-through on commitments | | Teaching | Exaggeration for key concepts | | Sales | Arc in customer journey | | Design | Appeal in every touchpoint | ## The Meta-Principle These 12 principles share one root: **empathy for the audience**. Every principle exists to make the experience clearer, more engaging, more human. When in doubt, ask: "Does this serve the person experiencing it?" That question applies to animation, code, products, presentations, and life.
© dylantarre · MIT · dylantarre/animation-principles