Агент читает код вашего проекта, пишет по нему ролик как веб-страницу и рендерит в mp4

Что показано

Пост в канале @exploitex пересказывает репозиторий latent-spaces/brag. Запускаете /brag внутри проекта, агент читает код, придумывает сценарий и собирает ролик на 15-25 секунд с музыкой и анимацией, на выходе mp4 и текст для публикации. Тон задаётся словами: серьёзная презентация, кинотрейлер, «пафосный запуск стартапа из 2016-го». Заявлена работа с Claude Code, Cursor и Codex.

К посту приложен ролик на 28 секунд: зелёный фон, подписи «Your Ai Platform», «Ai Chatbot», «Ask Ai», «Motion Ai SaaS Promo», мокапы сайтов Redox Design Studio и Alex Walker, а внизу мелко «Make By lclkiy». Про конкретный проект в нём нет ничего, а такой общий SaaS-язык скилл прямо запрещает в своих правилах. Я скачал этот файл и измерил: 28 секунд, 25 кадров в секунду. Пост при этом утверждает, что видео сделал Brag, а подтверждения я не нашёл. Витрина самого репозитория показывает другое: Horse Tinder, Fish Flight School, Taxi for Taxis, у каждого своё название и своя шутка. Их mp4 лежат на сайте проекта (ссылки ниже): 20-21 секунда, 1920×1080, 30 кадров в секунду, звук на месте. В Horse Tinder читаются «Dating apps were built for humans.» и «Dating, for horses.», в Taxi for Taxis «Every day, taxis carry us.» и «The ride-hailing app for ride-hailing assets.», то есть тексты взяты с сайта проекта. Ролик с шапки самого сайта вертикальный, 22,5 секунды, README говорит, что его сделал /brag на этом же репозитории.

Почему это работает

Видео здесь собирается как веб-страница. В полном режиме /brag пишет бриф и отдаёт его Hyperframes, открытому фреймворку HeyGen. Композиция в нём это HTML с таймлайном, а рендер устроен так: headless Chrome перематывает страницу кадр за кадром, FFmpeg склеивает снимки в mp4. Модель пишет HTML, CSS и JS, то есть то, что делает уверенно, и не двигает пиксели вслепую. Каждый кадр считается из времени, поэтому один и тот же вход даёт одно и то же видео, а сцену можно поправить и перерендерить без сюрпризов.

Ролик здесь собирается как веб-страница с таймлайном: модель пишет привычный HTML и CSS, а перематывает и снимает кадры браузер.

Материал берётся из исходников. Первый шаг читает index.html, стили (палитру и шрифты из :root), README, package.json, роуты и главные компоненты, ищет цепочку «вход, главное действие, результат» и отвечает на девять вопросов рубрики: что это, какая фраза самая сильная или смешная, что показать из живого интерфейса, какой нужен тон. Облегчённая версия идёт дальше и велит подключать реальные компоненты, шрифты и картинки проекта вместо пересборки.

Короче рамка тут важнее свободы. Скилл держит 15-25 секунд (18-22 идеально), хук в первые две секунды, текст, который надо прочитать, висит целиком примерно 0,3 секунды на слово, а «streamline your workflow» и выдуманные цифры с отзывами запрещены. Ну и раскадровка с таймингами, которые в сумме дают целевую длину, пишется в brag-plan.md до сборки, так что план можно поправить раньше, чем потрачены токены на рендер.

Проверки стоят до рендера. npx hyperframes check единственные ворота полного режима: он ловит вылезающий текст и контраст по WCAG (это ошибка, не предупреждение). В облегчённой версии ворот нет, вместо них правило: посмотреть стоп-кадры каждой сцены и середины переходов, а простой кроссфейд между двумя плотными раскладками не делать, получится мутная двойная экспозиция. Кстати мелочь, которую стоит забрать себе: готовый brag.jpg вшивается в нулевой кадр mp4 через ffmpeg, потому что X, Slack и Discord берут превью с нулевого кадра и обложку из метаданных игнорируют. Длительность и звук при этом не сдвигаются.

Режимов два. /brag работает через Hyperframes, возит с собой пять треков и набор звуков, озвучка Kokoro включается флагом --voice. /brag-slim это один файл без Hyperframes и без ассетов: модель сама пишет музыку и звуки и сама выбирает, чем рендерить, из того, что нашла на машине. Автопереключение на Opus 5.5 в /brag это текстовое правило в SKILL.md («если ты Opus 5.5 и нет --full или --voice, читай slim»). Получается, что модель сверяет себя сама, а не оркестратор, и если не может определить свою модель, идёт полным путём. Вернуть классику принудительно: /brag --full. Всё это я вычитал из файлов скилла, на живом проекте поведение не смотрел.

Как повторить

1. Проверьте окружение. Hyperframes нужны Node.js 22+ и FFmpeg в PATH:

node -v
ffmpeg -version
npx hyperframes doctor

2. Установите скилл. В Claude Code:

/plugin marketplace add latent-spaces/brag
/plugin install brag@brag

Для других агентов (Cursor, Codex, Copilot, Gemini CLI, opencode) есть установка через CLI skills, флаг -g ставит на все проекты сразу:

npx skills add https://github.com/latent-spaces/brag --skill brag

Только облегчённая версия:

npx skills add https://github.com/latent-spaces/brag --skill brag-slim

Если плагин уже стоит, /brag-slim приходит с версии 0.4.0: claude plugin update brag.

3. Для полного режима нужны сопутствующие скиллы Hyperframes: hyperframes-core, hyperframes-animation, hyperframes-creative, hyperframes-keyframes и hyperframes-cli. Ни README brag, ни его SKILL.md не говорят, что плагин ставит их сам, поэтому поставьте заранее. В папке проекта:

npx hyperframes skills update

Это команда, которую Hyperframes в своём quickstart предлагает агентам: она ставит базовый набор (роутер /hyperframes, все hyperframes-* и media-use) из свежей ветки main. Вариант с ручным выбором: npx skills add heygen-com/hyperframes, в меню отметьте группу Core Skills. Без меню (например, если команду запускает сам агент) и без --skill эта команда поставит все 21 скилл, поэтому для минимума берите первую. Обе команды я сверил по README и quickstart Hyperframes, сам не запускал.

4. Перезапустите агента, откройте папку проекта и напишите:

let's /brag

Или с настройками:

/brag --tone "fake Series A launch from 2016" --format vertical --duration 20

Флаги: --tone (default, polished, yc-parody, chaotic, deadpan, cinematic, app-store или свободная фраза), --format landscape|vertical|square (1920×1080, 1080×1920, 1080×1080), --duration, --no-music, --no-sfx, --title, --voice. В облегчённой версии таблица флагов короче (tone, format, duration), остальное просите словами. Есть и вариант без кода под рукой: /brag-slim принимает адрес сайта (/brag-slim https://ваш-сайт.ru) и собирает ролик по странице, какой её видит посетитель. Полный /brag читает только код проекта.

5. Прочитайте brag-plan.md: угол, хук, два-три акцента, финальная фраза, раскадровка. Сказать «хук слабый, сделай про X» сейчас дешевле всего.
6. В полном режиме агент предложит npx hyperframes preview (адрес localhost в браузере). Посмотрите и разрешите рендер. Руками это npx hyperframes render --output ../brag.mp4, для черновика добавьте --quality draft, для финала --quality high.
7. Заберите результат из brag-output/. Если папка уже была, скилл создаст brag-output-ГГГГ-ММ-ДД-ЧЧммсс/ и старое не тронет. Промежуточные файлы облегчённой версии лежат в work/.
8. Попросите пересобрать одну сцену или сменить тон. Скилл сам предлагает это в конце.

Ссылки и ресурсы

• latent-spaces/brag - сам скилл, автор Shunit Haviv Hakimi, MIT, около 7,6 тысяч звёзд, создан 16.06.2026, последнее обновление 24.09.2026, плагин версии 0.4.0; ссылка из поста, открыл, SKILL.md и справочные файлы прочитал. Бесплатно.
• Сайт brag - витрина; ссылка из README, открыл. Готовые ролики можно посмотреть и скачать: Horse Tinder, Fish Flight School, Taxi for Taxis (по 2-5 МБ). Бесплатно.
• Hyperframes и heygen-com/hyperframes - движок рендера от HeyGen, Apache 2.0, около 52,9 тысяч звёзд, пакет hyperframes в npm (версия 0.8.75 на 25.09.2026). README обещает «no per-render fees», а quickstart на hyperframes.heygen.com/quickstart пишет, что локальный рендер не тратит кредиты HeyGen; шагов с входом в аккаунт в них нет. Отдельные облачные, голосовые и аватарные сервисы могут стоить денег, для рендера в /brag они не нужны. Ссылка из README brag, открыл. Бесплатно.
• skills.sh: brag - каталог скиллов, около 7,9 тысяч установок, три проверки безопасности пройдены (Gen Agent Trust Hub, Socket, Snyk); ссылка из README, открыл. Бесплатно.
• skills CLI - установщик npx skills add, MIT, около 32 тысяч звёзд, заявлено Claude Code, Codex, Cursor, OpenCode и ещё 75 агентов; ссылка из README, открыл. Бесплатно.
• ende.app: Happy Beats & Business Moves - откуда пять треков серии, которую возит скилл (страница трека Vol. 12 показывает 1:58, как в README музыки brag). Бесплатно, без регистрации, коммерческое использование разрешено, лицензия CC BY 4.0. Про имя автора сайт говорит по-разному: на странице трека «One condition: attribution» и готовая строка Happy Beats & Business Moves Vol. 12 by Sascha Ende - ende.app, а на главной «Attribution is nice but no longer required». Надёжнее написать автора в подписи. Автор пишет, что музыку делает сам, без AI. Открыл все три страницы.
• Kenney - источник звуковых эффектов, CC0: на kenney.nl/support написано, что ассеты со страниц каталога отданы в общественное достояние, а на странице пака Casino Audio стоит Creative Commons CC0. Бесплатно (платные наборы и Patreon у сайта есть, для приёма не нужны).
• Impeccable - дизайн-словарь для агентов от Пола Бакауса (Apache 2.0, около 70,9 тысяч звёзд), им автор собрал демо-сайты для примеров. Для самого приёма не нужен; открыл. Бесплатно.
• Адреса, спрятанные на кадрах ролика или за «напишите слово в комментах», не нашлись: в тексте поста такого призыва нет, а на 7 кадрах ролика (по одному на каждые 4 секунды) ссылок и QR нет, только мелкая подпись «Make By lclkiy».

Проверочный прогон

Возьмите маленький проект, лендинг на HTML или простое веб-приложение, и запустите /brag --duration 15. Правильно собранный результат выглядит так: в brag-plan.md есть раскадровка, где длительности сцен дают 15-25 секунд, в brag-output/ лежат brag.mp4, brag.jpg и share-copy.txt. Длительность проверьте командой:

ffprobe -v error -show_entries format=duration -of csv=p=0 brag-output/brag.mp4

Откройте ролик и спросите себя: узнаю ли я свои цвета, шрифт и настоящие фразы с сайта, успевает ли читаться каждая надпись, годится ли первый кадр как обложка. Неудача выглядит так: подписи вроде «Your AI platform», длительность за 25 секунд, в кадре нет ничего из вашего интерфейса, либо brag.mp4 не появился (первым делом смотрите npx hyperframes doctor, обычно не хватает Node 22, FFmpeg или Hyperframes).

Где это пригодится

Если вы одиночка или маленькая команда, которая выпускает приложения и сервисы быстрее, чем успевает их показывать: релиз на носу, в X или в чате клиента нужен ролик, а монтажёра нет. Работает и для студийных кейсов: двадцать секунд «вот что мы сделали» прямо из кода, без записи экрана. Хуже подходит, если показывать нечего: нативное приложение без веб-части или серверная штука без интерфейса, скилл читает код и сайт, а рисовать ему нечего. В общем брать стоит там, где у проекта есть свой визуальный язык в коде. У меня самого промо сайта evdokimov.ai собрано на Remotion, как React-компонент с таймлайном, то есть принцип «видео это страница» знакомый. /brag руками я пока не гонял.

Оговорки

• Скилл я не запускал. Всё выше собрано из SKILL.md, справочных файлов, README и страниц Hyperframes и skills.sh.
• Ролик из поста, судя по файлу и кадрам, не выход скилла: 28 секунд при потолке 25 в правилах, 25 кадров в секунду при 30 у всех роликов с витрины, общие подписи, внизу чужая подпись «Make By lclkiy». Файл при этом скачан через сервис для загрузки из X, перекодирование могло что-то изменить, поэтому «почти наверняка», а не «точно». Слова «за видео в посте как раз отвечал Brag» я подтвердить не смог, качество настоящих роликов смотрите на витрине проекта.
• Ролики на витрине сняты на выдуманных сайтах из папки examples/, которые автор специально собрал как набор для проверки скилла. Красивый результат на них не гарантирует такой же на вашем проекте: я проверил длительность, формат и тексты в кадрах, но не то, насколько похоже на ваш дизайн выйдет у вас.
• «Работает с Cursor и Codex» верно наполовину. README обещает установку через CLI skills, а документ docs/other-agents.md из того же репозитория пишет, что у Cursor нет нативного поиска SKILL.md, и предлагает вставить файл в инструкции вручную. Автоопределение модели и команда /brag заточены под Claude Code. Какой из двух вариантов работает, не проверял.
• Полный режим тяжёлый: Node 22, FFmpeg, Hyperframes, headless Chrome, и ему нужен доступ к папке скилла, откуда копируются музыка и звуки.
• В облегчённой версии качество зависит от того, что есть на вашей машине, ворот hyperframes check там нет, а музыку и звуки пишет сама модель. Как это звучит, не знаю.
• Цена запуска в токенах нигде не названа. Агент читает проект, пишет раскадровку, собирает видео, смотрит стоп-кадры и, возможно, переделывает. На большом проекте это заметный расход, замеров нет.
• Музыка полного режима из ende.app под CC BY 4.0, серия на сайте есть. Условие про имя автора там описано двояко (страница трека требует, главная не требует), а README музыки в самом репозитории просит перепроверить условия перед распространением. Проще всего добавить в подпись к ролику строку вида «Music: Happy Beats & Business Moves Vol. N by Sascha Ende, ende.app»: номер тома виден в имени файла в composition/assets/music/. В облегчённой версии музыку пишет сама модель, там этого пункта нет.
• --voice включает озвучку Kokoro через npx hyperframes tts (голос по умолчанию af_heart). Quickstart Hyperframes предупреждает, что голосовые сервисы могут стоить отдельно; работает ли Kokoro целиком на вашей машине и что докачивает при первом запуске, я не проверял.
• Скилл запускает команды и ставит пакеты через npx. Три проверки на skills.sh пройдены, но план перед рендером всё равно прочитайте, а запускайте на проекте, где такое допустимо.
• Звёзды репозитория говорят о популярности, качество роликов по ним не оценить.