remotion-render · 101-skills — скилл для Claude Code: видео из TSX-кода
Скилл отдаёт TSX-компонент Remotion в inference.sh и получает готовый MP4. Пригодится, когда видео нужно собирать кодом, а не руками в редакторе.
npx skills add 101-skills/superpowers --skill remotion-render -a claude-codeЧто делает remotion-render
Скилл принимает код React-компонента, который экспортирует default-компонент, и запускает рендер через CLI belt от inference.sh. На выходе — MP4. Разрешение, FPS, длительность и кодек задаются в том же вызове, так что один и тот же компонент легко пересобрать под вертикаль или квадрат.
Внутри доступны импорты из remotion и react: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence, Audio, Video, Img. Компоненту можно передать пропсы — удобно для данных, которые меняются от ролика к ролику.
Перед первым запуском нужен CLI belt и вход через belt login. Сам скилл разрешает только команды Bash(belt *), поэтому рендер идёт через inference.sh, а не локально — если у вас нет доступа к этому сервису, скилл не заработает.
Какие задачи решает
- собрать MP4 из React-компонента без видеоредактора
- отрендерить анимацию появления текста по кадрам
- сделать счётчик или прогресс-бар, который растёт по ходу ролика
- подставить данные в шаблон через пропсы и получить видео
- собрать сцену из нескольких последовательных фрагментов
Примеры запросов агенту
- Отрендери этот Remotion-компонент в MP4 1920x1080, 30 fps, 3 секунды
- Сделай видео с плавным появлением заголовка через interpolate
- Собери ролик из трёх сцен через Sequence, каждая по секунде
Как установить remotion-render
1Через Skills CLI (Vercel)
npx skills add 101-skills/superpowers --skill remotion-render -a claude-code2Вручную: положить файлы
~/.claude/skills/remotion-render/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/remotion-render/
1Через Skills CLI (Vercel)
npx skills add 101-skills/superpowers --skill remotion-render -a codex2Вручную: положить файлы
.agents/skills/remotion-render/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add 101-skills/superpowers --skill remotion-render -a cursor2Вручную: положить файлы
.cursor/skills/remotion-render/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install 101-skills/superpowers remotion-render2Вручную: положить файлы
.github/skills/remotion-render/SKILL.md1Через Skills CLI (Vercel)
npx skills add 101-skills/superpowers --skill remotion-render -a gemini-cli2Командой платформы
gemini skills install https://github.com/101-skills/superpowers --path tools/video/remotion-renderВручную: положить файлы
.devin/skills/remotion-render/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add 101-skills/superpowers --skill remotion-render -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о remotion-render
Как установить remotion-render в Claude?
Выполните npx skills add 101-skills/superpowers --skill remotion-render -a claude-code. Скилл появится по пути ~/.claude/skills/remotion-render/SKILL.md.
Что делает remotion-render?
Берёт TSX-код компонента Remotion и рендерит из него видео через inference.sh. На выходе MP4 с заданными разрешением, FPS, длительностью и кодеком.
Что нужно, чтобы скилл заработал?
CLI belt от inference.sh и авторизация через belt login. Без доступа к этому сервису рендер не запустится.
Похожие скиллы
Всё по теме «ИИ и ML» →Сначала — remotion-render от других авторов.
