Repolode
howseen-ai

howseen-ai/claude-motion-design

Навык Claude Code для создания моушн-дизайн-видео на HTML, Playwright и ffmpeg — без лицензий After Effects и Remotion.

Open source альтернатива:After Effects

Звёзды
586
Форки
77
Открытые issues
1
Последний коммит
16 дней назад

Что это?

claude-motion-design — это навык Claude Code для создания моушн-дизайн-видео целиком в коде. Каждый кадр вычисляется по времени с помощью единой функции seek(t), рендерится в Playwright, получает размытие в движении на основе субкадров и кодируется через ffmpeg. Проект рассчитан на разработчиков, которым нужен предсказуемый и редактируемый результат без платных видеоредакторов и лицензируемых движков рендеринга.

Навык проводит через весь рабочий процесс: сбор данных о бренде, создание карты битов, утверждение статичных кадров, рендеринг финального ролика, проверку на скачки между кадрами и добавление синхронизированного аудио. Звуковые эффекты размещаются по измеренным пикам, а сцены синхронизируются с дропом в музыке. Также есть режим ремейка, который покадрово воспроизводит существующий проморолик для другого бренда.

В репозитории есть готовый пример проморолика для Howseen вместе с исходниками, а также скрипты для загрузки бесплатной музыки, звуковых эффектов, логотипов и шрифтов с таких ресурсов, как Mixkit, Pexels и Unsplash.

Ключевые возможности

  • 01Рендерит каждый кадр с помощью функции seek(t), поэтому результат воспроизводим.
  • 02Использует снимки экрана Playwright и кодирование через ffmpeg с размытием в движении на основе субкадров.
  • 03Синхронизирует монтажные склейки и звуковые эффекты с картой битов и пиками аудио.
  • 04Включает режим покадрового ремейка для воспроизведения существующего видео.
  • 05Предоставляет скрипты для загрузки бесплатной музыки, SFX, логотипов и шрифтов.

Сценарии использования

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

Быстрый старт

  1. 1

    Скопируйте skill в Claude Code

    mkdir -p ~/.claude/skills && cp -r skill/motion-design ~/.claude/skills/
  2. 2

    Установите зависимости Python и Chromium

    pip install playwright imageio-ffmpeg numpy pillow && python -m playwright install chromium
  3. 3

    В Claude Code попросите создать видео или введите /motion-design

Что важно знать

  • Для использования skill нужна настроенная среда Claude Code, а для рендеринга также необходимы Chromium и ffmpeg.
  • Музыка и звуковые эффекты скачиваются из сторонних источников и распространяются на условиях их собственных лицензий, поэтому они не включаются в дистрибутив.

Темы

Частые вопросы

Что такое claude-motion-design?
Навык Claude Code для создания моушн-дизайн-видео на HTML, Playwright и ffmpeg — без лицензий After Effects и Remotion. claude-motion-design — это навык Claude Code для создания моушн-дизайн-видео целиком в коде. Каждый кадр вычисляется по времени с помощью единой функции seek(t), рендерится в Playwright, получает размытие в движении на основе субкадров и кодируется через ffmpeg. Проект рассчитан на разработчиков, которым нужен предсказуемый и редактируемый результат без платных видеоредакторов и лицензируемых движков рендеринга.
claude-motion-design можно использовать бесплатно? Какая у него лицензия?
claude-motion-design распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
claude-motion-design всё ещё поддерживается?
Активно поддерживается. Последний коммит в claude-motion-design — 4 окт. 2026 г..
Для чего можно использовать claude-motion-design?
Создание роликов о запуске продукта или анонсов без видеоредактора. Создание синхронизированных с битом зацикленных роликов для соцсетей из HTML-сцен. Доработка видео с помощью изменений в коде вместо монтажа на таймлайне. Воссоздание референсного моушн-ролика для другого бренда.
Как установить claude-motion-design?
Скопируйте skill в Claude Code: mkdir -p ~/.claude/skills && cp -r skill/motion-design ~/.claude/skills/ Установите зависимости Python и Chromium: pip install playwright imageio-ffmpeg numpy pillow && python -m playwright install chromium В Claude Code попросите создать видео или введите /motion-design
Где скачать claude-motion-design?
Исходный код и инструкции по установке — на GitHub: https://github.com/howseen-ai/claude-motion-design

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты

Навык Claude Code, который превращает URL сайта в ролик о запуске продукта с частотой 60 fps: видео создаётся на HTML, а звуковые эффекты синхронизируются с музыкой и добавляется размытие в движении.

32247JavaScriptMITОбновлён 5 дней назад