Remotion Lab · Пилот 01

Исторические познавательные ролики: Remotion + статика + код-анимация · без генеративных видео-моделей · разбор референса Arzamas «Древний Рим за 20 минут» (20 млн просмотров) · 2026-07-05
✅ Вердикт: реализуемо полностью. Пилот уже собран и отрендерен.

В референсе нет ни одного элемента, требующего видео-генерации — это плоский коллаж из статики + типографика + код-анимация. Ровно территория Remotion: каждый кадр — детерминированная функция от времени, правки точечные, стиль лочится в коде. Ниже — 34-секундный пилот, повторяющий 5 ключевых молекул референса: собран за одну сессию, 0 ₸ на генерации (public domain ассеты + SVG-карта из GeoJSON + один прогон rembg локально).

34 спилот, 1920×1080, 30 fps
5 / 9молекул референса в пилоте
0 ₸генераций и платных API
~19 ссредняя сцена референса (66 склеек / 21 мин)

1 · Пилот (смотреть со звуком не надо — звук по пайплайну добавляется слоями позже)

Структура: фото-морф в карту → карта-экспансия (3 волны завоеваний + бейджи + таймлайн) → chapter card → статуя-диалог (влёт с весом, баббл, красный маркер, музейная плашка) → толпа-инстансинг (40 фигур из 1 вырезки) → типографическая карточка RES·PVBLICA.

Фирменный переход референса: фото схлопывается круговой маской в точку города на карте. В Remotion — одна строка: clip-path circle(r) с тяжёлой easing-кривой.
Карта-экспансия: побережье из Natural Earth GeoJSON → SVG-путь; волны завоеваний — эллипсы под feGaussianBlur, обрезанные по контуру суши.
Статуя-диалог: вырезка (rembg) влетает из-за кадра «с весом», баббл с овершутом, draw-on маркер-обводка жеста.
Толпа-инстансинг: одна вырезка → 40 фигур, стаггер рядами от задних к передним, детерминированный джиттер позы.

2 · Разбор референса на молекулы

Arzamas «Древний Рим за 20 минут» · 21 мин · 20 094 713 просмотров · канал 1.67 млн подписчиков. Главное открытие разбора: «дорогая плавность» — это не сложные эффекты, а дисциплина системы. Весь ролик собран из ~9 повторяющихся сцен-паттернов и ~12 приёмов движения, с жёстким постоянным «хромом». Монтаж внутри сцены отсутствует — элементы наслаиваются по ритму дикторского текста.

Контактный лист 0:00–2:00: карта → титул → статуя-нарратор → карта с шагающими фигурками → мозаика (Ken Burns) → галерея монет.

Контактный лист 2:00–4:00: артефакт-зумы → chapter card → толпы патрициев/плебеев (инстансинг!) → типографическая карточка RES·PUBLICA → камень LEX → бабблы.

Постоянный «хром» кадра

Лого канала (верх-лево) + таймлайн-лента истории внизу — прогресс по эпохам с бейджами дат. Зритель в любой момент знает «где мы во времени». Это удержание: лента = ощущение движения к финалу.

4 слоя кадра (z-порядок)

СлойЧто в нём
1 · Фонкарта (беж-суша / бледно-голубое море) · чёрный · полнокадровый артефакт (фреска, мозаика, барельеф, картина) с медленным Ken Burns
2 · Акторывырезки статуй/скульптур как персонажи (пурпурная тога = император), толпы-инстансы, здания, монеты
3 · Оверлеиспич-бабблы, музейные плашки-подписи, красные маркер-стрелки/обводки/кресты, счётчики, линейки
4 · Хромлого + таймлайн с бейджами дат

9 молекул сцен

МолекулаЧто происходитВ пилоте
Карта-экспансиятерритория заливается «органическими» волнами, города-точки, бейджи, фигурки/корабли ходят по карте
Статуя-диалогвырезка влетает, баббл, плашка, микро-движения марионетки
Толпа-инстансингодна фигура размножается в ряды (легион, сенат, плебс), цветом кодируются группы
Артефакт-зумполнокадровый артефакт + Ken Burns + красный маркер «смотри сюда»— (тривиально, тот же Ken Burns)
Типографическая карточкаRES·PUBLICA / LEX / SPQR — крупный смысловой текст-момент
Инфографика-счётлинейка-шкала рядом со статуей, счётчики титулов, галерея монет-портретовчастично (линейка в chapter card)
Комик-битфигура падает (убийство Цезаря), красный крест, шутка в баббле
Chapter cardчёрный кадр: медальон + номер части + заголовок + линейка эпох
Фото-морфживое фото ↔ карта через круговую маску

12 глаголов анимации → приём в Remotion

ГлаголРеализация
fade / fade-upinterpolate(opacity) + сдвиг 10-20px, Easing.bezier(0.16,1,0.3,1)
slide-in «с весом»прилёт из-за кадра, bezier(0.85,0,0.15,1) — уже залоченный моушн-язык модуля
pop (овершут)bezier(0.34,1.56,0.64,1) для бабблов/бейджей
Ken Burnsscale+translate по statice, editorial bezier(0.45,0,0.55,1)
органическая заливкаSVG-эллипсы под feGaussianBlur + clipPath по контуру суши
круговая маска-морфclip-path: circle(r px at x y), r: 2300→10
crash-zoomscale 1.16→1.0 + blur 7→0 за 0.7с
стаггер-инстансингmap по рядам/колонкам, delay = f(ряд, |колонка−центр|), джиттер = детерминированный hash (не Math.random — сломает рендер)
draw-onstrokeDasharray/strokeDashoffset (линейки, стрелки, обводки)
puppet-микродвижениесинус-«дыхание» ±0.35°, наклон/подпрыг/падение через rotate с origin в ногах
типографический акцентletter-spacing + масштаб 0.96→1
hard cut → chapter cardсмена Sequence без перехода — канон стиля: резкость между сценами, плавность внутри

3 · Пайплайн «режиссёрская партитура»

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

Сценарий → [1] ПАРТИТУРА (гейт) → [2] ТЗ-контракты шотов (JSON) → [3] Ассет-бриф → сбор статики → [4] Сборка из библиотеки молекул → [5] Рендер по шотам → [6] QC-гейт

Стадия 1 · Партитура (человекочитаемая, это гейт для тебя)

BIT-07 | 01:24.0–01:31.5 (7.5с)
РЕПЛИКА: «Карфаген должен быть разрушен — повторял Катон в конце каждой речи»
СЦЕНА: statue-dialogue (продолжение SHOT-05, чёрный фон)
СОБЫТИЯ:
  +0.0с  статуя Катона влетает справа (slide-in HEAVY, 1.0с) + SFX whoosh
  +1.6с  [на слове «разрушен»] баббл-поп «Carthago delenda est!» + SFX pop
  +3.0с  красная маркер-обводка жеста (draw-on 0.7с) + SFX scribble
  +5.2с  плашка «Катон Старший, 234–149 до н.э.» (fade-up)
ЗВУК: музыка -18dB c дакингом под голос
ХРОМ: таймлайн 146 до н.э., прогресс 0.55

Ключевое правило: событие привязывается к слову озвучки, а не к абсолютной секунде (word-level alignment из VTT уже есть в монтаж-модуле). Перезаписали озвучку — тайминги пересчитались сами.

Стадия 2 · ТЗ шота = JSON-контракт (исполняется компонентом-молекулой)

{
  "shot": "SHOT-05", "molecule": "statue-dialogue", "duration_s": 7.5,
  "chrome": { "timeline": { "progress": 0.55, "label": "146 до н.э." } },
  "layers": [
    { "id": "cato", "asset": "cutouts/cato.png", "pos": [1160,150], "h": 800,
      "enter": { "verb": "slide-in", "from": "right", "dur_s": 1.0, "ease": "HEAVY" },
      "idle": "breathe" },
    { "id": "bubble1", "kind": "speech-bubble", "text": "Carthago delenda est!",
      "enter": { "verb": "pop", "at_word": "разрушен" }, "sfx": "pop-soft" },
    { "id": "mark1", "kind": "red-circle", "target": [1090,235],
      "enter": { "verb": "draw-on", "at_s": 3.0, "dur_s": 0.7 } }
  ]
}

Новый ролик = новые контракты + ассеты. Код молекул переиспользуется — это и есть завод, а не разовый монтаж. Правка «баббл на 0.4с раньше» = правка одного числа, ре-рендер одного шота.

Стадии 3-6

Звук — 3 слоя

VO (мастер-ритм, к нему цепляются события) → музыка (петля с дакингом, смена трека = смена главы) → SFX (pop, whoosh, scribble, штамп — одноразово собрать библиотеку CC0 с freesound). В референсе звук устроен именно так: игривая оркестровая петля + точечные акценты на событиях.

4 · Ответы на вопросы из брифа

ВопросОтвет
Лимит хронометража шотаТехнического нет — Remotion рендерит композицию хоть на час. Рабочая единица 5–20 с: параллельный рендер + локальные правки. 20-минутный ролик = ~70-90 шотов.
«Раскадровка не типичная, а посекундная»Да — это партитура (стадия 1). События по слоям, битам и словам. Классическая картинка-раскадровка становится побочным артефактом (стилл первого кадра шота).
ПереходыКанон стиля: резкие склейки между сценами, плавность внутри сцены. Спец-переходы — молекулы (фото-морф, chapter card). Библиотека @remotion/transitions есть, но злоупотреблять — путь в PowerPoint.
Почему не PowerPoint-дешёвкаДисциплина: один набор easing-кривых с «весом» (никакого linear), события по слову озвучки, постоянный хром, идл-жизнь статики (дыхание), детерминированный джиттер. Всё это — код, значит лочится и не дрейфует.

5 · Что дальше (по «да»)

  1. Озвученный фрагмент 60–90 с — полный цикл: сценарий → партитура → контракты → VO → сборка со звуком (3 слоя). Проверит связку «событие ↔ слово».
  2. Библиотека SFX (CC0, одноразово) + word-alignment RU-озвучки.
  3. Компилятор партитура→JSON (после 2-3 роликов руками — скрипт).
  4. Решение о судьбе: под какой канал/формат ставим (после того как тест удовлетворит).
Файлы: композиция — sandbox/yt-remotion/src/arzamas-pilot/ (7 файлов) · дизайн-док — sandbox/remotion-lab/PIPELINE-DESIGN.md · референс-разбор — sandbox/remotion-lab/reference/ (видео, 11 контактных листов, 4 моушн-разбора) · рендер — sandbox/yt-remotion/out/arzamas-pilot.mp4