К основному содержанию
скилл CX Codex

gaming-entertainment — скилл для Claude Code: анимации в играх и медиа

Скилл для анимаций в игровых приложениях, стриминговых сервисах и интерактивных медиа: раскладывает 12 принципов Disney по элементам интерфейса.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add dylantarre/animation-principles --skill gaming-entertainment -a claude-code
Открыть на GitHub

Что делает gaming-entertainment

Скилл помогает агенту проектировать анимацию для игр, стримингов и развлекательных порталов. Внутри — 12 принципов Disney, разобранных по конкретным элементам: нажатие кнопки, иконки персонажей, выдача достижений, лутбоксы, старт уровня, экраны победы, переходы меню, частицы и свайпы. Каждый пункт — это подсказка, что именно анимировать и как.

Отдельная таблица задаёт тайминги и функции плавности: нажатие кнопки — 100ms, переход меню — 200ms, переворот карточки — 300ms, всплывающее достижение — 500ms, экран победы — 1000-2000ms. Для игрового отклика скилл советует держаться 100-200ms, для драматичных моментов замедляться до 500-800ms, а обратную связь интерфейса давать за 50-100ms.

Ставить есть смысл, если вы делаете интерфейс игры или медиасервиса и хотите, чтобы агент предлагал не абстрактные «плавные анимации», а конкретные приёмы с числами. Если проект — обычная админка или лендинг, принципы вроде растяжения бейджа при разблокировке только запутают.

Какие задачи решает

  • подобрать длительность и плавность для нажатия кнопки в игре
  • расписать каскад анимаций при открытии меню
  • сделать драматичное появление награды или лутбокса
  • добавить фоновое движение на экран победы
  • выстроить траектории частиц и свайпов карточек

Примеры запросов агенту

  • предложи анимацию выдачи достижения по принципам из gaming-entertainment
  • какие тайминги взять для перехода между экранами меню в игре
  • распиши анимацию старта уровня с нарастанием напряжения

Как установить gaming-entertainment

1Через Skills CLI (Vercel)

npx skills add dylantarre/animation-principles --skill gaming-entertainment -a claude-code

2Вручную: положить файлы

~/.claude/skills/gaming-entertainment/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/gaming-entertainment/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о gaming-entertainment

Как установить gaming-entertainment в Claude?

Выполните npx skills add dylantarre/animation-principles --skill gaming-entertainment -a claude-code. Файл скилла окажется в ~/.claude/skills/gaming-entertainment/SKILL.md.

Что делает gaming-entertainment?

Разбирает 12 принципов анимации Disney применительно к игровым и медиаинтерфейсам и даёт таблицу таймингов с функциями плавности для типовых действий.

На каких платформах работает скилл?

Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode. Для каждой платформы в репозитории есть своя команда установки.

Исходный текст

SKILL.md · MIT
---
name: gaming-entertainment
description: Use when designing animations for gaming apps, streaming platforms, entertainment portals, or interactive media
---

# Gaming & Entertainment Animation Principles

Apply Disney's 12 principles to create immersive, exciting experiences that maximize engagement and emotional impact.

## The 12 Principles Applied

### 1. Squash & Stretch
- **Button Presses**: Satisfying squash on tap
- **Character Icons**: Bounce and stretch for personality
- **Achievements**: Badges stretch dramatically on unlock

### 2. Anticipation
- **Play Button**: Wind-up before launch
- **Loot Boxes**: Dramatic build-up before reveal
- **Level Start**: Countdown with escalating energy

### 3. Staging
- **Hero Content**: Full-bleed featured media
- **Now Playing**: Center stage with ambient effects
- **Notifications**: Attention-grabbing without blocking content

### 4. Straight Ahead & Pose to Pose
- **Gameplay**: Fluid continuous animation (straight ahead)
- **Menu Navigation**: Snappy defined states (pose to pose)
- **Cutscenes**: Choreographed sequences

### 5. Follow Through & Overlapping Action
- **UI Elements**: Staggered animation cascades
- **Victory Screens**: Multiple overlapping celebrations
- **Menu Items**: Sequential reveal with follow-through

### 6. Slow In & Slow Out
- **Epic Moments**: Dramatic slow-motion effects
- **Menu Transitions**: Quick but smooth
- **Loading Screens**: Engaging animated loops

### 7. Arc
- **Particle Effects**: Natural curved trajectories
- **Swipe Gestures**: Smooth arcing card movements
- **Projectiles**: Physics-based arc paths

### 8. Secondary Action
- **Background Animations**: Ambient movement always present
- **Achievement Pop**: Sparkles while badge animates
- **Score Update**: Effects while numbers climb

### 9. Timing
- **Fast & Responsive**: 100-200ms for game feel
- **Dramatic Moments**: Slow to 500-800ms for impact
- **UI Feedback**: Instant 50-100ms responses

### 10. Exaggeration
- **Go Big**: Entertainment thrives on drama
- **Victories**: Explosive celebrations
- **Power-ups**: Oversized visual feedback

### 11. Solid Drawing
- **Art Direction**: Consistent style across UI
- **3D Elements**: Proper depth and perspective
- **Character Animation**: Appealing poses and movements

### 12. Appeal
- **Maximum Personality**: Every element has character
- **Emotional Range**: From tension to triumph
- **Memorable Moments**: Create shareable experiences

## Industry Timing Standards

| Action | Duration | Easing |
|--------|----------|--------|
| Button Press | 100ms | ease-out |
| Menu Transition | 200ms | ease-out |
| Victory Animation | 1000-2000ms | custom-bounce |
| Achievement Pop | 500ms | spring |
| Card Flip | 300ms | ease-in-out |

## Key Principle
Entertainment is about emotion. Use animation to amplify feelings - excitement, tension, triumph, and joy. Don't hold back when the moment calls for spectacle.

© dylantarre · MIT · dylantarre/animation-principles

Похожие скиллы

Всё по теме «Геймдев и 3D: Unity, Unreal, Godot, Blender» →
godot-ui Zate Скилл даёт агенту знания о Control-нодах, темах и типовых экранах Godot. Пригодится, когда собираешь меню, HUD или инвентарь. CX Codex +1 2 700установок pixel-art-sprites omer-metin Настраивает ассистента на отрисовку спрайтов и тайлсетов. Пригодится при разработке ретро-игр с жёсткими лимитами палитры и кадров. CX Codex +1 2 700установок pixijs-scene-sprite pixijs Скилл объясняет агенту, как рисовать изображения в PixiJS v8: Sprite, AnimatedSprite, NineSliceSprite и TilingSprite. Пригодится, когда в проекте уже есть PixiJS и нужно быстро получить рабочий код отрисовки. CX Codex +1 5 900установок pixel-art omer-metin Скилл даёт агенту знания по пиксель-арту: палитры, дизеринг, субпиксельная анимация, тайлы и ограничения ретро-железа. Пригодится, если делаете спрайты и тайлсеты. CX Codex +1 520установок tweens phaserjs Скилл учит ИИ-агентов анимировать свойства объектов в Phaser 4 через TweenManager, цепочки TweenChain и функцию stagger. CX Codex +1 899установок game-designer OpusGameLabs Скилл для геймдизайна: разбирает браузерную игру и доводит её вид — фон, частицы, анимации, переходы между сценами. CX Codex +1 1 900установок

Из того же набора86

motion-one Скилл показывает, как собрать 12 принципов анимации Диснея на библиотеке Motion One — от squash and stretch до stagger и scroll. CX Codex +1 541установок solid-drawing-mastery Скилл для тех, кто делает анимацию и хочет, чтобы объекты в движении выглядели объёмными, а не плоскими. Помогает ловить ошибки перспективы и веса. CX Codex +1 535установок icons-badges Скилл для анимации иконок, бейджей, аватаров и статус-индикаторов. Пригодится, когда мелкие элементы интерфейса должны давать отклик и характер. CX Codex +1 535установок gesture-responses Скилл для анимации отклика на тап, свайп и перетаскивание: задаёт тайминги, кривые и паттерны для CSS и JS. CX Codex +1 533установок ux-researcher Помогает агенту планировать исследования о том, как анимация влияет на восприятие, ошибки и время выполнения задачи. CX Codex +1 525установок spatial-thinking Скилл для ИИ-агента, который заставляет думать о кадре как о трёхмерном пространстве: глубина, перспектива, объём. Пригодится, когда персонаж плывёт над полом или камера едет не туда. CX Codex +1 523установок arc-mastery Скилл для анимации движения: объясняет, почему прямые линии выглядят механически, и как строить дуги в UI, персонажах и играх. CX Codex +1 523установок micro-100-200ms Скилл для микроанимаций длительностью 100–200 мс: подсказки, выпадающие меню, мелкая обратная связь. Помогает подобрать тайминг и кривые. CX Codex +1 518установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой