Remotion - Как создавать видео в ClaudeCode (Opencode)
13:00

Remotion - Как создавать видео в ClaudeCode (Opencode)

Продуктивный Совет 18.02.2026 8 999 просмотров 367 лайков

Machine-readable: Markdown · JSON API · Site index

Поделиться Telegram VK Бот
Транскрипт Скачать .md
Анализ с AI
Описание видео
Remotion. В этом видео мы разберем новый революционный инструмент. Покажем полный процесс установки, который включает в себя Node.js и редактор кода OpenCode. Вы узнаете, как с помощью ИИ-агентов, правильных промптов и библиотеки готовых решений генерировать анимацию текста, графиков и даже создавать моушн-графику на прозрачном фоне. Мы также поделимся лучшими практиками и лайфхаками, чтобы вы могли сразу начать создавать свои проекты. Этот гайд по Remotion предназначен для тех, кто хочет освоить создание моушн-графики с помощью искусственного интеллекта. Мы рассмотрим, как использовать ИИ для генерации видео, анимации текста и сложных визуализаций без навыков программирования на React. Узнайте, как установить Remotion, работать с OpenCode, использовать промпты для создания анимации и экспортировать видео с прозрачным фоном. Арендуйте сервер с GPU в облаке Selectel за пару минут: https://slc.tl/ddoon Реклама. АО «Селектел», ИНН 7810962785. erid: 2Vtzqucgvag #ai #remotion #motiondesign #нейросети 🎥 Успей на поток по ИИ Видео по самой низкой цене - https://t.me/how2ai_bot?start=dl-1771141265af3fd4c5274b Тайм-коды: 00:00 – Интро 00:29 – Что такое Remotion? 01:00 – Рекламная интеграция 02:38 – Как установить Remotion: пошаговая инструкция 05:07 – Структура проекта и работа с файлами 05:44 – Как это работает: пишем первый промпт 06:03 – Лучшие практики для промптинга 06:56 – Библиотека готовых промптов 07:33 – Лайфхак: просим ИИ сделать несколько версий 09:03 – Графика на прозрачном фоне 10:13 – Настройки рендера и экспорт 11:00 – Как работать со своими файлами и вносить правки 12:02 – Почему за этим будущее? Бусти – https://boosty.to/prodadvice/single-payment/donation/535968/target?share=target_link Тг How2AI – https://t.me/How2AI Тг чат How2AI – https://t.me/how_to_AI Тг Креативный Совет – https://t.me/creadvice 🥸 Личный тг Дяди Д – https://t.me/true_dyadya_d

Оглавление (13 сегментов)

Интро

Motion-графика. Обычно это месяцы обучения After Effectffs, бесконечные таймлайны и головная боль с ключевыми кадрами. Но что, если я скажу, что теперь для этого не нужен опыт владения программой, и каждый из вас за считанные минуты может научиться генерировать вот такие сочные визуалы, просто отправляя в чат коротенькие промпты. Люди-роботы, привет. С вами Протсовет. Я Игорян. И, кстати, вот эту вот штуку я тоже сделал в сервисе, про который мы сегодня поговорим. Знакомьтесь, Remotion, по

Что такое Remotion?

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

Рекламная интеграция

небольшая пауза. Пока мы тестируем готовые сервисы, кто-то уже разворачивает собственные AI проекты, и им нужна мощная база, например, Selectel. Select - это российский провайдер облачной и физической IT-инфраструктуры для AI проектов. У них большой выбор облачных сервисов с видеокартами от проверенных GTX 1080 до профессиональных карт типа NVIDIA H200 для супертребовательных задач. Недавно в облаке появились новые профессиональные GPU для AI проектов любого масштаба. H1 на80 ГБ, H20014 ГБ, RTX 6000 Pro Blackwell 96 ГБ и L424 ГБ. На их мощностях можно решать разные задачи. Профессиональное проектирование и 3D-моделирование, рендеринг в 4К, 8К, обучение сложных ML-моделей, infence больших языковых моделей и научные и инженерные вычисления. Самое крутое - это гибкость. Арендовать сервер с GPU можно даже на час, и стоит это от 30 руб. в час. То есть тестируете видеокарту и решаете краткосрочную задачу без лишних затрат. GPU также доступны в прерываемых виртуальных машинах, и там экономия до 70%. Серверы работают на процессорах AMD Epic, а для некоторых GPU доступны локальные диски для задачи, где нужна максимальная скорость с данными. Развёртывание занимает буквально несколько минут через панель my. select. ru. Так что, если работаете с AI всерьёз, регистрируйтесь в панели и заказывайте облачный сервер для своих задач. Ссылочка, естественно, в описании. Так

Как установить Remotion: пошаговая инструкция

вот, как же установить? Для того, чтобы начать им пользоваться, вам понадобятся две штуки. Во-первых - это Node JS. Скачать его можно по ссылке nojs. org. Ссылочки вы найдёте в нашем Телеграме. Заходим на сайт, жмём скачать и устанавливаем. Просто тыкаем continueю, со всем соглашаемся, а затем нам понадобится Open code. Вместо Open кода, естественно, вы можете использовать cдкод, курсор, VS-код, но Open CД sourceный позволяет бесплатно использовать классные модели, поэтому это мой выбор. И про OpenCД, кстати, у нас был отдельный ролик. По ссылке opencod. ai, которая тоже будет в нашем Телеграме, вы найдёте страницу Openкода, которая предложит нам скачать OpenCд под нашу OS. Для того, чтобы у вас получались максимально крутые результаты, в идеале вам ещё понадобится оплатить какой-то API, предоставляющий доступ к какой-то хорошей языковой модели Gemini, GPT Clot. Но прелесть Онкода в том, что он предоставляет бесплатный доступ к языковым моделям, хорошим языковым моделям. Например, я использую KI 2 из минусов в этом сценарии вы можете упереться в какие-то лимиты, но зато и денег вы никаких не потратите. А лимиты тут, правда, большие. Node JS есть, Open CД есть. Теперь открываем терминал. Я буду показывать всё для Mac, но Windows отличия небольшие, если вообще есть, поэтому, я думаю, вы сможете разобраться. Для удобства давайте. Стартовая директория будет находиться просто на рабочем столе. Для этого пишем CD десктоп. Если на десктопе вам неудобно, то можете написать любой другой путь до папки, в которой будет весь ваш проект. Далее пишем NPX create видео собака latest пробел defс def blank и жмём Enter. Нас приветствует и спрашивает, добавить лиwind CSS. Жмём да, просто Enter. Затем добавить ли агентные скилы и тут тоже, да, опять Enter. После небольшой загрузочки пишем CD пробел My Def Video Enter, а затем npm пробел install и опять Enter. Установка займёт пару минут, после чего пишем npm, пробел, run, пробел, def enter. И после нажатия на enter в вашем браузере откроется webui, то есть веб-интерфейс, для того чтобы просматривать то, что у вас в ремоушене получается. После этого открываем Open CodД, жмём вот здесь вот на плюсик и выбираем ту самую директорию, то есть ту самую папку с нашим проектом, которую мы создали на рабочем столе, точнее, которая создалась, когда мы в начале писали в терминал место, где будет наш проект. И, кстати, зайдя в эту папку

Структура проекта и работа с файлами

внутри вы сможете найти другую папку паблик. Именно в эту папку вам следует закидывать всю графику, как-то связанную с вашим проектом. Все логотипы в целом, даже СВГшки, JPГшки, что угодно. Даже файлы шрифтов туда можно закидывать. Самый удобный сетап - это Open cд с одной стороны, если вам не важно прямо вот смотреть на элементы, и вы просто вайп-кодите, viп-эдитите видео, то есть, несмотря на код, ни на что не обращая внимания, просто пишите какие-то свои правки и надейтесь, что модель вас правильно поймёт и внесёт их в ваш проект. То просто чатик справа и сайт с веб-аем слева. Работает он таким

Как это работает: пишем первый промпт

образом. Вы открываете, например, курсор или Open CД и просто пишите в чат: "Сделай мне интро, где жирные манцерат буквы вылетают со всех сторон, крутятся, прыгают, создавая хаос, и собираются во фразу: "Необычные промпты и agent skills". И у нас получается вот такой прекрасный визуал. Но начнём, пожалуй

Лучшие практики для промптинга

не с необычных промптов, а наоборот с обычных в целом, что обязательно указывать в промкте для того, чтобы у вас получались классные итоговые результаты. Первое хорошее правило - это напомнить ремошену о том, что нужно использовать агентный скилл под названием лучшие практики Remotion. Находится он тут внутри папки Open Code Skills и вот Best Remotion Practices. Там уже всё записано за вас. В целом этот файл даже можно как-то отредактировать, если вы хотите, чтобы что-то получалось не совсем так, как задумано ремоушеном. А сервис этот очень свежий. Пока что он находится в бета-версии, поэтому не исключено, что вы придумаете что-то, что будет работать ещё лучше, чем то, что придумали его создатели. Второе хорошее правило - это когда вы вносите какие-то правки, не писать слишком много правок. А если пишете несколько, то разделять их на пункты, чтобы элмка не запуталась и поняла всё, что вы от неё хотите. Помимо

Библиотека готовых промптов

лучших практик ремоушена, есть замечательная библиотека промптов, которая находится на сайте remotion. dev/prompts. KDF/prompts. Там вы найдёте промпты для самых разных визуализаций. И вот такую вот красоту можно делать. Просто заходим как бы в любое из видео и копируем промпт. Как вы видите, тут делается и тридэшка, и не тридэшка. Красота. Всякие с текста можно анимировать, графики делать. Даже вот такой странный визуализатор вашего маршрута пробежки тут есть, на самом деле. Не знаю, зачем это нужно, но кому-то, кто бегает, наверное, это будет сделать прикольно. Ну и ещё один очень

Лайфхак: просим ИИ сделать несколько версий

классный совет - это рекомендация делать три версии, после которой мы остановимся на одной, выберем её и будем продолжать работать с ней. Как вы видите, после того, как я попросил сделать эти три версии, у нас появился таймлайн 1, 2 и 3. Я посмотрел, выбрал, в каком таймлайне мне больше понравились всякие элементы. написал промпт, который объединяет разные таймлайны. И у меня создался таймлайн 4. А в нём создалась вот такая вот прекрасная анимация того, какие диффузионные модели, изменившие рынок в своё время, выходили в какой момент какого года, чем они отличились. Ну замечательная же штука, которую я сделал, ну, минут за 10 в худшем случае. При этом, поскольку работает на LLM, он, естественно, умеет всё гуглить, всё браузить. То есть я не указывал ни какие модели тут должны быть, ни в какой момент они выходили. Всё LLM сделало за меня. Я просто попросил сделать композицию, визуализацию таймлайна выхода главных диффузионных моделей двадцатого тире двадцать шестого года. Первый результат, кстати, выглядел вот так вот. От него я начал отскакивать, и по итогу всё пришло к тому, что вы уже видели. После того, как вы закрыли проект, если вам нужно его открыть заново, то мы просто вот запускаем эту команду. Потом, чтобы открыть Open CД, вот эту команду, ну а если вы хотите начать совершенно новый проект, то вводите уже другую команду. Ну и название здесь можно выбрать другое. Это так будет называться ваша папка в указанной директории. И не забудьте, что

Графика на прозрачном фоне

если меняете название тут, то его нужно поменять и тут. Как вы уже видели, Remotion помимо обычной motion графики может делать графику на прозрачном фоне. На создание вот этой штуки я потратил, ну, изначально минуты две. Оно получилось неплохо, но чтобы оно выглядело прямо очень хорошо, я потратил ещё, наверное, минут 10. И тут важно понимать, что я тратил достаточно много времени, потому что я использую бесплатную модель. Если вы будете использовать платные, тем более хорошие, быстрые модели, то время ожидания будет намного меньше. Из этих 10 минут я писал промпты от силы минуты две и минут восемь просто сидел, ждал, пока напишется код. Промпт с прозрачным фоном вы, кстати, тоже сможете найти в библиотеке промпто. И помимо этого промпта, на самом деле, здесь есть очень много всего интересного и очень много крутых workflow. При том, что этот сервис находится в бета-версии, и ближайшие недели, тем более месяцы, он будет развиваться, и на выходе мы получим что-то очень крутое, что сможет создавать действительно очень сложную motion графику. Хотя и сейчас создаёт уже вот такие вот штуки. Тут есть достаточно прикольные настройки рендера. Во-первых, есть достаточно

Настройки рендера и экспорт

много кодеков. И если вы на своей маOS хотите экспортировать видео с прозрачным фоном, я так понимаю, на Windows это будет работать как-то по-другому. Но, кстати, вы, если что, всегда можете просто в Openкоде написать вопрос: "Как мне экспортировать видео с прозрачным фоном? " Или: "Как мне сделать вот это или вот это? " И в этом прелесть, что OpenCд всегда вам подскажет, как правильно взаимодействовать с ремоушеном. Так вот, экспорт с прозрачным фоном - это прорес профиль обязательно выбираем четыре четвёрки. Затем заходим в Pкe. И в Picture нам обязательно нужен PNG, потому что PН прозрачный. И выбираем пиксель формат 44. Вот, в общем, вот этот. Можно поиграться с колорспейсом. Можно и в general тут lock level поменять, на самом деле, на другой. Ну и в целом тут всё очень просто. Если вам

Как работать со своими файлами и вносить правки

нужно использовать ваш логотип, просто пишите имя вашего логотипа или делайте так, чтобы lлмка поняла, что это за логотип. То есть не нужно, например, писать расширение. Просто пишем. Если, например, ваш файл в папке public имеет слово логотип внутри, то lm, естественно, поймёт, что нужен именно этот файл. Если там есть слово к, то, скорее всего, она поймёт, что это фон backк. Или если у вас есть два логотипа, то вы пишите, естественно, logops или там logo How to AI. Короче, главное делайте так, чтобы просто лмка поняла, что вы от неё хотите. И если она понимает, то она это делает, может быть, не с первого раза. Иногда, конечно же, какие-то баги бывают. Иногда модель неправильно оценивает, как будет выглядеть финальный результат, потому что она же не может на него посмотреть, она это только с помощью кода описывает, и вы можете просто давать ей правки. Например, тут что-то неправильно дёргается или, например, просто тут что-то дёргается. Это не того цвета. Тут должен быть другой фон. Это движение неправильно. Элемент не встаёт на своё место. Короче, правки могут быть абсолютно любыми. По мне, это, конечно

Почему за этим будущее?

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

Другие видео автора — Продуктивный Совет

Ctrl+V

Экстракт Знаний в Telegram

Экстракты и дистилляты из лучших YouTube-каналов — сразу после публикации.

Подписаться

Дайджест Экстрактов

Лучшие методички за неделю — каждый понедельник