lovisdotio/motion2code

Что это?

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

• 01Разбивает исходное видео на кадры, точки склейки, палитру и оценку зацикливания для анализа.
• 02Создаёт анимацию на inline SVG под управлением единой GSAP timeline.
• 03Предоставляет window.anim.seek(t) для детерминированного покадрового рендеринга.
• 04Сравнивает оригинал и код бок о бок, показывая оценку различий для каждого момента.
• 05Проверяет стык зацикливания и рендерит результат в mp4, GIF или последовательность кадров PNG.

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

• Воссоздание motion design-ролика в виде редактируемого веб-кода, независимого от разрешения.
• Преобразование записи экрана приложения или сайта в рабочую интерактивную страницу с анимацией при прокрутке.
• Проверка покадрового соответствия анимации, сгенерированной AI, исходному видео.

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

1. 1

   Установите skill для своего агента программирования

   npx skills add lovisdotio/motion2code
2. 2

   Установите Python 3.9 или новее и ffmpeg (Playwright нужен только для скриптов, работающих в браузере)

3. 3

   Изучите исходное видео перед его воссозданием

   python3 scripts/study_video.py clip.mp4 -o study/

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

• !Для работы скриптов нужен ffmpeg, а для некоторых проверок и рендеринга — Playwright с Chromium.
• !Этот рабочий процесс рассчитан на выполнение агентом программирования на основе предоставленного вами исходного видео.

В подборках

Темы

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

Что такое motion2code?

Навык для AI-агентов, который воссоздаёт motion design-видео в виде зацикленной анимации на inline SVG и GSAP с покадровой сверкой с оригиналом. Motion2Code — это навык для coding-агентов, таких как Claude Code, Codex и Cursor. Агенты не могут смотреть видео, поэтому, когда их просят воссоздать ролик, они часто угадывают тайминг, easing и цвета. Этот навык задаёт рабочий процесс: разобрать исходное видео на кадры, палитру и оценку зацикливания, собрать анимацию из фигур inline SVG под управлением одной GSAP timeline, а затем сравнить результат с оригиналом покадрово.

motion2code можно использовать бесплатно? Какая у него лицензия?

motion2code распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.

motion2code всё ещё поддерживается?

Активно поддерживается. Последний коммит в motion2code — 20 окт. 2026 г..

Для чего можно использовать motion2code?

Воссоздание motion design-ролика в виде редактируемого веб-кода, независимого от разрешения. Преобразование записи экрана приложения или сайта в рабочую интерактивную страницу с анимацией при прокрутке. Проверка покадрового соответствия анимации, сгенерированной AI, исходному видео.

Как установить motion2code?

Установите skill для своего агента программирования: npx skills add lovisdotio/motion2code Установите Python 3.9 или новее и ffmpeg (Playwright нужен только для скриптов, работающих в браузере) Изучите исходное видео перед его воссозданием: python3 scripts/study_video.py clip.mp4 -o study/

Где скачать motion2code?

Исходный код и инструкции по установке — на GitHub: https://github.com/lovisdotio/motion2code