video-shotcraft — это skill, то есть набор инструкций, примеров и ассетов для Claude Code, Codex и совместимых AI-агентов. Он помогает собирать кинематографичные продуктовые ролики на Remotion. По основному тексту README официального репозитория, проверенному 10 сентября 2026 года, в составе заявлены 157 карточек-рецептов кадров, 214 моушн-превью, готовый шаблон Ink Press, браузерный монтажный стол Motion Workbench и экспорт в JianYing.

Что такое video-shotcraft

video-shotcraft — библиотека готовых движений и методология видеопродакшена поверх Remotion. Агент изучает продукт, составляет раскадровку, использует реальные снимки страниц, добавляет 2.5D-движение камеры с имитацией глубины и параллакса на плоских изображениях, синхронизирует монтаж с музыкой и собирает звуковое оформление.

Процесс начинается с продукта или страницы, выбора режима и подготовки материалов. На выходе получается проект Remotion с воспроизводимой покадровой анимацией, который можно проверить, отредактировать и отрендерить как обычный кодовый проект.

📌
Основной сценарий — промо веб- и десктоп-продуктов. Отдельные карточки подходят также для демонстрации функций, запусков продуктов, бренд-фильмов и самостоятельных моушн-сцен.

Что входит в комплект

КомпонентЧто это
157 карточек-рецептовНазначение кадра, энергия, рекомендуемая длительность, параметры, реализация и известные ограничения
214 моушн-превьюДинамические примеры 214 стилей, доступные для поиска и фильтрации в галерее
Remotion-реализацииДемонстрационные компоненты TSX с рабочими кривыми сглаживания и временными параметрами
Шаблон Ink PressГотовый ролик длительностью 36,2 секунды: 1920×1080, 30 кадров/с, 10 сцен
Компоненты и аудио2.5D-камера, титры, вспышечные переходы, прокрутка цифр, фоновая музыка, 149 звуковых эффектов (SFX) в 16 категориях и скрипты захвата страниц
Motion WorkbenchБраузерный монтажный стол с дорожками кадров, переходов, титров и звуковых эффектов
Экспорт в JianYingРедактируемый проект для JianYing (CapCut CN) с отдельными кадрами, титрами и аудиодорожками

Как video-shotcraft работает с Remotion

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

Карточка кадра содержит описание приёма и указание на точную демонстрационную реализацию. Агент должен сверить название и вариант по индексу галереи, прочитать карточку и использовать соответствующий TSX-код. Создание похожего движения только по названию теряет уже настроенные параметры.

Для воспроизводимого рендера используются фиксированные источники псевдослучайности. Date.now() и Math.random() в покадровой анимации применять нельзя.

Три режима создания полного ролика

Перед производством полного промо выбирают один из трёх маршрутов.

РежимКогда подходитКак строится работа
Ink PressНужен быстрый и предсказуемый результат на основе готовой структурыАгент сохраняет устройство шаблона, но заменяет снимки, тексты, шрифты, цвета и брендинг
Самостоятельное созданиеНужен новый визуальный язык, а творческие и инженерные решения можно передать агентуАгент непрерывно проходит от изучения продукта до финальной проверки
Совместное созданиеВы хотите участвовать в ключевых творческих решенияхПоследовательно согласуются продуктовый бриф, требования, визуальное направление, набор кадров и полная раскадровка

Если режим не выбран, агент сначала проводит минимальную проверку предоставленного проекта или страницы без изменений исходного продукта. Затем он объясняет пригодность каждого маршрута и запрашивает выбор. Если материалов для проверки нет, агент кратко описывает режимы и ждёт решения. Если вы сразу назвали Ink Press, повторное согласование режима не требуется. Если указаны конкретные карточки, они становятся ограничениями будущей раскадровки; для полного ролика без выбранного режима агент уточняет только между самостоятельным и совместным созданием.

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

  • Node.js и терминал.
  • Claude Code, Codex или другой агент с поддержкой skills.
  • Доступный проект, веб-страница, запись экрана или снимки продукта.
  • Тексты и понимание того, какие данные разрешено показывать.
  • Музыкальный файл, если монтаж должен быть синхронизирован с конкретной композицией.

Отдельный пустой проект Remotion создавать необязательно: в репозитории есть запускаемый шаблон.

⚠️
Клиентские, личные, внутренние, секретные и оперативные данные используйте только в вымышленных или обезличенных заменах. Демонстрационные снимки из шаблона перед публикацией замените материалами своего продукта.

Установка и подключение

video-shotcraft подключается к Claude Code, Codex или совместимому агенту как skill. Официальный репозиторий описывает три способа.

Путь 1. Отдать ссылку агенту. В Claude Code или Codex скажите агенту установить skill по ссылке:

Промпт:

Install this skill for me: https://github.com/Vincentwei1021/video-shotcraft

Путь 2. Через интерфейс командной строки (CLI) skills.

npx skills add Vincentwei1021/video-shotcraft

Путь 3. Вручную через git.

git clone https://github.com/Vincentwei1021/video-shotcraft.git
cd video-shotcraft
ln -s "$(pwd)" ~/.claude/skills/video-shotcraft
# или для Codex
ln -s "$(pwd)" ~/.codex/skills/video-shotcraft

В этих шагах отдельный API-ключ не фигурирует: подключение выполняется через каталог skills и локальную копию репозитория.

Как поставить задачу агенту

Для полного ролика укажите продукт и желаемый режим:

Промпт:

Use video-shotcraft to create a promo for my desktop product using autonomous free creation.

Для шаблона:

Промпт:

Use video-shotcraft to make a promo for my product with the Ink Press template.

Для конкретных движений:

Промпт:

Use the deck-deal-flyin and row-embed shot cards to present this feature.
Design a product close-up inspired by spotlight-hero-card.

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

Как строится качественный ролик

Если в сцене нужно показать интерфейс продукта, используются реальные снимки страницы. Рабочий процесс начинается с локального сервера разработки, затем безголовый браузер делает полноразмерную 2x-текстуру страницы, отдельные вырезки элементов и таблицу координат layout.json.

Для абстрактной заставки, брендовой сцены или отдельного компонента допустим вручную собранный интерфейс. Если он теряет качество или не объясняет действие, правила skill требуют вернуться к маршруту реальных снимков. Данные на странице обрабатываются по уровню риска: клиентские, личные, внутренние, секретные и оперативные сведения заменяются вымышленными или обезличенными.

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

Каждый кадр должен раскрывать один главный приём и оставлять время на чтение результата. Если пользователь заранее выбрал фоновую музыку (BGM), её анализируют до раскадровки, а склейки и ключевые движения привязывают к музыкальной сетке и реальным транзиентам. Для ролика с BGM предусмотрены две финальные версии: с музыкой и без неё, но с сохранёнными звуковыми эффектами.

Шаблон Ink Press

Ink Press — готовое промо длительностью 36,2 секунды с разрешением 1920×1080 и частотой 30 кадров/с. Оно состоит из 10 сцен в бумажно-чернильной стилистике с тёплым янтарным акцентом, 2.5D-движением по реальным страницам, титрами, переходами и настроенным звуком.

Шаблон сокращает объём режиссёрской и технической работы, но требует адаптации. Снимки, тексты, шрифты, цвета и материалы должны соответствовать вашему продукту.

Редактирование после сборки

После создания ролик можно открыть в Motion Workbench:

node workbench/scripts/open.mjs

Монтажный стол показывает отдельные дорожки кадров, переходов, титров и звуковых эффектов. В нём можно менять тексты, цвета и размеры шрифтов, перемещать, обрезать и менять скорость клипов, а также добавлять движения из библиотеки. Для разбора проекта нужен монтажный манифест src/workbench.ts; локальный сервер Workbench запускается на http://localhost:5198.

Дополнительно доступен экспорт редактируемого проекта в JianYing. Кадры можно переставлять и менять по скорости, титры восстанавливаются как текстовые дорожки, а музыка и эффекты остаются раздельными. В README указана проверка на JianYing Pro 11.2 для macOS; реализация для Windows отмечена как не проверенная на реальном устройстве.

Проверка результата

Минимальная проверка после установки:

cd video-shotcraft/template
npm install
npx remotion render src/index.ts AiflPromo out/promo.mp4

Ожидаемый проверяемый результат — файл out/promo.mp4, который воспроизводится целиком. Сам шаблон описан в README как валидированный ролик из 10 сцен, поэтому при проверке нужно убедиться, что в рендере присутствуют все сцены. Команда приведена по официальной инструкции; в рамках подготовки этого материала её запуск не выполнялся.

Для каждого собственного кадра полезно сначала вывести контрольный статичный кадр через npx remotion still. После изменений отрендерите весь ролик, извлеките кадры и проверьте начало и окончание сцен, читаемость титров, склейки, звук и отсутствие личных данных.

В README ограничения описаны для проверки на безголовом Linux с двумя ядрами и Node 22:

  • при ошибке лимита параллельности использовать --concurrency=1;
  • вместо полного Chrome указывать chrome-headless-shell;
  • если автоматическая загрузка браузера заблокирована, передать путь через --browser-executable.

Лицензии и ограничения

КомпонентУсловия
video-shotcraftApache-2.0
RemotionFree License распространяется на физических лиц, коммерческие организации с численностью до трёх сотрудников и некоммерческие организации; для других коммерческих организаций требуется Company License
Аудио в репозиторииИспользуется по условиям соответствующих источников; перед публикацией проверьте assets/audio/ATTRIBUTION.md

Лицензия Remotion разрешает допустимым пользователям создавать видео и изображения, в том числе коммерческие. В ней также указано, что условия слегка изменятся в Remotion 5.0, поэтому перед коммерческим применением сверяйтесь с актуальным текстом лицензии.

Полезные сценарии

Промо веб- или десктоп-продукта

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

Демонстрация одной функции

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

Дальнейший монтаж без правки кода

Готовый проект открывается в Motion Workbench или экспортируется в JianYing. В Workbench можно менять титры и параметры клипов, а в JianYing — переставлять кадры, менять скорость и редактировать текстовые дорожки и аудио. Результат — изменённый рендер или редактируемый проект. Возможности Workbench зависят от подготовленного манифеста, а Windows-модуль JianYing в источнике обозначен как не проверенный на реальном устройстве.

Структура репозитория

video-shotcraft/
├── SKILL.md
├── references/
│   ├── pipeline.md
│   ├── guided-free-creation.md
│   ├── shots/
│   ├── sequences/
│   ├── aesthetic-rules.md
│   ├── music-beat-sync.md
│   ├── sound-design.md
│   ├── workbench.md
│   └── jianying-export.md
├── demos/
├── gallery/
├── template/
├── workbench/
├── jianying-export/
└── assets/
    ├── lib/
    ├── scripts/
    └── audio/

Чек-лист быстрого старта

Установить skill в каталог агента.
Предоставить безопасный для показа продукт или набор снимков.
Выбрать Ink Press, самостоятельное или совместное создание.
При необходимости выбрать карточки в галерее.
Заменить демонстрационные материалы своими и обезличить данные.
Проверить отдельные сцены статичными кадрами.
Отрендерить и просмотреть ролик целиком со звуком.
Проверить лицензию Remotion для своей организации.

Ссылки

Следующий шаг

Remotion — фреймворк программной генерации видео на React и его использование в OpenAI Codex

Если планируете регулярно собирать продуктовые ролики, полезно заранее определить маршрут производства, правила работы с данными и критерии проверки финального рендера.

Если захотите обсудить, как это применить у себя или в команде — пишите в Telegram @pimenov