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

brand-marketing — скилл для Claude Code: что делает и как установить

Скилл переносит 12 диснеевских принципов анимации в коммерческое видео, рекламу и айдентику. Задаёт чёткие тайминги для логотипов и бренд-стилей.

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

Что делает brand-marketing

Скилл даёт ассистенту правила моушн-дизайна для рекламных роликов и логотипов. Внутри собраны готовые профили движения для четырёх типов бренда: люкс, технологии, дружелюбный стиль и строгий корпоративный.

Под каждый стиль прописана конкретная длительность фаз. Для люкса используется сдержанный тайминг 500–800 мс без отскока, а для технологичных продуктов — резкие переходы на 200–400 мс. Модель также получает четырёхфазную схему появления логотипа: предвкушение, раскрытие, фиксация и удержание от одной до двух секунд.

При создании роликов скилл учитывает ограничения площадок от шестисекундных бамперов до телерекламы. Проект сверяется по чеклисту сдачи, включая безопасные зоны и альтернативу с пониженным движением.

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

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

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

  • Спланируй анимацию появления логотипа для премиального бренда часов с удержанием в конце.
  • Распиши тайминги и фазы движения для 15-секундного промо-ролика в соцсетях.
  • Предложи схему анимации интерфейса в технологичном стиле с переходами до 400 мс.

Как установить brand-marketing

1Через Skills CLI (Vercel)

npx skills add dylantarre/animation-principles --skill brand-marketing -a claude-code

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

~/.claude/skills/brand-marketing/SKILL.md

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

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

Вопросы о brand-marketing

Как установить brand-marketing в Claude Code?

Выполните в терминале команду npx skills add dylantarre/animation-principles --skill brand-marketing -a claude-code. Конфигурация запишется в файл ~/.claude/skills/brand-marketing/SKILL.md.

Что делает скилл brand-marketing?

Он задаёт правила моушн-дизайна на базе 12 классических принципов анимации, адаптированных под маркетинг и брендинг. Скилл помогает ИИ выдерживать верный ритм, подбирать кривые сглаживания и рассчитывать время показа элементов.

Какие фазы заложены в схему анимации логотипа?

Схема делит появление логотипа на четыре этапа: предвкушение (200–400 мс), само раскрытие (400–800 мс), фиксация элементов (200–400 мс) и финальное статичное удержание от 1000 до 2000 мс.

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

SKILL.md · MIT
---
name: brand-marketing
description: Use when creating commercial animations, advertising motion, brand identity animation, logo reveals, or marketing video content.
---

# Brand Marketing Animation

Apply Disney's 12 animation principles to commercials, advertisements, brand identity, and marketing content.

## Quick Reference

| Principle | Brand/Marketing Implementation |
|-----------|-------------------------------|
| Squash & Stretch | Product bounce, logo elasticity |
| Anticipation | Build-up to reveal, suspense |
| Staging | Product hero shots, focal control |
| Straight Ahead / Pose to Pose | Story flow vs key moments |
| Follow Through / Overlapping | Logo elements settle, tagline delay |
| Slow In / Slow Out | Dramatic reveals, smooth motion |
| Arc | Sweeping camera, product arcs |
| Secondary Action | Environment responds to product |
| Timing | Match brand energy, music sync |
| Exaggeration | Brand personality amplification |
| Solid Drawing | Consistent brand identity in motion |
| Appeal | Memorable, emotionally resonant |

## Principle Applications

**Squash & Stretch**: Products can bounce on landing for energy. Logo elements stretch during reveals. Text can have elastic emphasis. Match brand personality—luxury minimal, playful bouncy.

**Anticipation**: Build suspense before product reveal. Pause before tagline appears. Sound design wind-up precedes visual payoff. Create expectation, then deliver.

**Staging**: Product is always the hero. Lighting directs to focal point. Background supports, never competes. Clear visual hierarchy every frame.

**Straight Ahead vs Pose to Pose**: Story-driven commercials flow naturally (straight ahead energy). Key reveal moments are precisely posed. Blend both—flow to moments of impact.

**Follow Through & Overlapping**: Logo elements settle at different rates. Tagline appears after logo lands. Product features animate in sequence. Creates natural, alive feeling.

**Slow In / Slow Out**: Dramatic reveals use long ease-in. Impact moments snap. Premium brands use slower, more deliberate timing. Energetic brands use faster, snappier easing.

**Arc**: Camera movements sweep in arcs. Products tumble naturally. Logo elements flow, don't snap. Text can follow curved paths for dynamism.

**Secondary Action**: Environment responds to product presence. Particles, light rays, reflections. Music and motion sync. Every element reinforces the message.

**Timing**: Match brand energy profile. Luxury: slow, deliberate (500-800ms). Tech: precise, efficient (200-400ms). Playful: bouncy, energetic (300-500ms with overshoot). Sync to music beats.

**Exaggeration**: Amplify brand personality traits. Confident brands use bold, decisive motion. Friendly brands use rounded, bouncy motion. Exaggeration makes brand memorable.

**Solid Drawing**: Logo maintains integrity in motion. Brand colors consistent throughout. Typography respects brand guidelines. Motion style matches brand identity system.

**Appeal**: Animation should evoke target emotion. Trust, excitement, comfort, aspiration. Every motion choice serves brand message. Memorable moments people want to rewatch.

## Brand Personality Motion

### Luxury/Premium
```
- Slow, deliberate timing (500-800ms)
- Minimal motion, maximum impact
- Subtle easing, no bounce
- Clean, geometric paths
- Restrained color transitions
```

### Tech/Innovation
```
- Precise, efficient timing (200-400ms)
- Sharp, decisive motion
- Geometric transitions
- Light trails, particle systems
- Data-driven motion graphics
```

### Playful/Friendly
```
- Bouncy timing with overshoot (300-500ms)
- Squash and stretch throughout
- Curved, organic paths
- Bright color pops
- Character-driven elements
```

### Professional/Corporate
```
- Balanced timing (300-500ms)
- Clean, purposeful motion
- Grid-aligned movements
- Fade and slide transitions
- Subtle, refined effects
```

## Logo Animation Framework

| Phase | Duration | Purpose |
|-------|----------|---------|
| Anticipation | 200-400ms | Build expectation |
| Reveal | 400-800ms | Main animation |
| Settle | 200-400ms | Follow-through |
| Hold | 1000-2000ms | Brand recognition |

### Logo Reveal Patterns
1. **Build-up**: Elements assemble into logo
2. **Reveal**: Mask or transition exposes logo
3. **Transform**: Abstract shape morphs to logo
4. **Kinetic**: Logo elements in motion, then resolve

## Music Sync Guidelines

- Major beats: key reveals, impacts
- Measures: section transitions
- BPM: drives overall energy
- Silence: powerful before reveal
- Sound design: reinforces motion

## Platform Timing

| Platform | Max Length | Logo Hold |
|----------|------------|-----------|
| TV Commercial | 15/30/60s | 2-3s |
| Pre-roll | 6/15s | 1-2s |
| Social video | 15-60s | 1.5-2s |
| Stories | 15s | 1-1.5s |
| Bumper | 6s | 1s |

## Deliverables Checklist

- [ ] Animation matches brand guidelines
- [ ] Logo animation approved
- [ ] Timing synced to audio
- [ ] Platform-specific versions
- [ ] Reduced motion alternative
- [ ] Color profile correct
- [ ] Safe area compliance

© dylantarre · MIT · dylantarre/animation-principles

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

Всё по теме «Дизайн» →
build-a-brand Pika-Labs Скилл создаёт айдентику бренда по описанию идеи, сайту или референсам: от быстрого набора до PDF-гайдлайна на 14–16 страниц. CX Codex +1 1 700установок motion-prompt-writer charlie947 Составляет готовый бриф из 8 частей для генерации зацикленной моушн-графики под ваш бренд. Пригодится, когда нужно превратить идею анимации в чёткий промпт без ручного подбора параметров. CX Codex +1 851установок b2b-brand-marketing arnabbagxd Скилл разворачивает бренд-маркетинг для компаний, которые продают другим компаниям: позиционирование, работа с закупочным комитетом, доверие и LinkedIn. CX Codex +1 1 600установок cinetic Leonxlnx Скилл для съёмки коротких промо-роликов кодом: раскадровка, тайминг, звук и рендер в Remotion или HyperFrames. CX Codex +1 1 000установок brand-promo-video-generator MiniMax-AI Скилл собирает короткий промо-ролик бренда, продукта или приложения из ваших логотипов, скриншотов и ссылок. Пригодится для запусков и соцсетей. CX Codex +1 3 400установок brand-motion-guidelines iart-ai Собирает документ о том, как движется бренд или продукт: принципы, токены длительности и кривых, библиотека анимаций, правила для логотипа. Пригодится, когда анимация в команде делается кто во что горазд. CX Codex +1 572установок

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

navigation-menus Скилл для анимации навбаров, меню и сайдбаров: тайминги, кривые и состояния переходов по принципам Disney. CX Codex +1 557установок timing-mastery Задаёт ритм и длительность движений в анимации через расчёт кадров. Помогает настроить темп жестов, пауз и акцентов. CX Codex +1 554установок buttons-ctas Скилл для ИИ-кодинга, который подсказывает агенту, как анимировать кнопки и CTA: состояния, тайминги, CSS-переходы. CX Codex +1 552установок figma-prototyping Скилл подсказывает агенту, как собрать прототип в Figma по 12 принципам анимации Диснея — через Smart Animate и варианты компонентов. CX Codex +1 550установок motion-one Скилл показывает, как собрать 12 принципов анимации Диснея на библиотеке Motion One — от squash and stretch до stagger и scroll. CX Codex +1 544установок attention-direction Скилл помогает выстроить визуальную иерархию и направить взгляд зрителя в анимациях или интерфейсах. Пригодится при раскадровке и устранении визуального шума. CX Codex +1 540установок solid-drawing-mastery Скилл для тех, кто делает анимацию и хочет, чтобы объекты в движении выглядели объёмными, а не плоскими. Помогает ловить ошибки перспективы и веса. CX Codex +1 538установок icons-badges Скилл для анимации иконок, бейджей, аватаров и статус-индикаторов. Пригодится, когда мелкие элементы интерфейса должны давать отклик и характер. CX Codex +1 537установок

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

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