AIKraft/AI/Войти
AIKraft/Skills/hyperframes-animation

hyperframes-animation

Управляет анимацией HyperFrames: правила движения, сцены, переходы и 24 текстовых эффекта. Поддерживает GSAP, Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API и TypeGPU. Пригодится для создания, аудита и оптимизации анимаций с единым таймлайном.

HEHeyGen official Разработка ★ 56.7k

Что делает навык

Навык управляет анимацией HyperFrames, объединяя правила движения, сцены, переходы и текстовые эффекты. Он обеспечивает создание, аудит и оптимизацию анимаций с единым таймлайном, поддерживая GSAP, Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API и TypeGPU.

Когда применять

  • Создание анимаций путем комбинирования 2–4 атомарных правил из rules-index.md в едином паузируемом таймлайне GSAP.
  • Использование готовых многофазных шаблонов (blueprints) для сцен типа brand-reveal или social-proof, когда требуется экономия времени на авторинг.
  • Получение рабочего эталонного кода (ground-truth) для сложной хореографии из 4–5 фаз с использованием сценарного уровня оркестрации.

Как работает

  1. Определить, подходит ли сцена для использования готового шаблона (blueprint) из blueprints-index.md или достаточно атомарных правил.
  2. Если используются атомарные правила, выбрать 2–4 правила из rules-index.md и объединить их в один паузируемый таймлайн GSAP.
  3. Если требуется сложная хореография, загрузить соответствующий blueprint из blueprints/<id>.md только после принятия решения о необходимости сценарной оркестрации.
  4. Следовать контракту композиции (data attributes, sub-compositions, determinism), описанному в hyperframes-core.
  5. При установке в качестве плагина HyperFrames соблюдать правила выполнения плагина перед командами настройки или проверки свежести.

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

Собери анимацию, используя 3 атомарных правила из rules-index.md в едином паузируемом таймлайне GSAP.
Примени blueprint для сцены brand-reveal, чтобы сократить время создания многофазной анимации.
Создай рабочий код хореографии из 4 фаз, загрузив соответствующий blueprint из blueprints-index.md.

Что понадобится

  • Знание контракта композиции из hyperframes-core (data attributes, sub-compositions, determinism).
  • Доступ к файлам rules-index.md, blueprints-index.md и blueprints/<id>.md.
  • Среда выполнения, поддерживающая GSAP, Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API или TypeGPU.

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «hyperframes-animation» из репозитория: # https://github.com/heygen-com/hyperframes
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r hyperframes-animation/ ~/.claude/skills/hyperframes-animation/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.