mozgi ← Все промпты
Claude Opus 5.5

Сравнение оригинального ролика Manus и ремейка Frame by Frame бок о бок: два светлых интерфейса с курсором

Промпт

ПРОМПТ:
<inputs>
Запроси у меня: название продукта, логотип (или предложи нарисовать простой знак), фирменные цвета (или извлеки их из логотипа), фразу в одну строку, которую пользователь вводит в поле промпта, страницу, которая на неё отвечает (заголовок + 2–3 предложения с одной ключевой фразой), два названия функций для расположенных друг над другом карточек и музыкальный трек. Если я что-то пропущу, используй значения по умолчанию: продукт "Frame by Frame", размещённый внутри его хаба Whop, знак видоискателя (четыре угловые скобки вокруг жирного "FF"), промпт "Make a launch video for my app", страница урока с заголовком "2.1 Choose a reference", карточки "Launch" и "Sound", а также бесплатный house-трек "Rising Forest" от Mixkit, замедленный до 124 BPM.
</inputs>

<direction>
12-секундная квадратная заставка продукта, 1080x1080, номера кадров при 29.97 fps (f0–f359), мастер-рендеринг при 59.94 fps. Ощущение презентации Apple: мягкий, белый, ярко-синий, стеклянный стиль. Камера никогда не переходит по склейке на неподвижном кадре: каждый план начинается уже в движении (экспоненциальное замедление, 12–19% оставшегося расстояния за кадр) и заканчивается ускоряющимся движением или нарастающим размытием. Размытие на каждом движении соответствует его скорости и направлению.
Палитра: мои фирменные цвета, распределённые по этим ролям; если я их не укажу, используй: страница #FDFDFB, дымка #B7CFEB, лёд #E6F0FA, градиент неба от глубокого синего #294376 → #769CC2, тёмно-синий #1E2F52, акцентные синие #2F6BFF / #3CC8F0 / мятный #4ED6A0, белый. Шрифт: Inter (400/500/600/700). Никаких фиолетовых, лиловых, пурпурных или оранжевых оттенков.
История: шапка продукта поднимается из синей дымки внутри светлого окна приложения → курсор плавно въезжает, разворачивается в направлении движения, увеличивается при наведении и нажимает на логотип → жёсткая склейка на музыкальном дропе к иконке приложения, вокруг которой четыре квадрата закручиваются в крест → иконка схлопывается в строку меню Mac → курсор нажимает на иконку в строке меню, из матового стекла выскакивает поле промпта, и в нём печатается промпт → резкий наклон вверх через светло-синюю вспышку к странице с ответом, которая прокручивается на место → поверх неё поднимается карточка → размытие с растворением к двум расположенным друг над другом карточкам с огромными заголовками из матового стекла → размытие с растворением к одинокому диску с логотипом → жёсткая склейка к чёрной финальной заставке со светящимся словесным знаком.
Запрещено: наплывы, застывшие кадры (кроме одной паузы в S7), готовые UI-киты, свечение текста интерфейса, Math.random, всё, что выглядит как шаблон.
</direction>

<structure>
Координаты указаны в пикселях на сцене 1080. Музыкальный бит k = 0.048 + 0.4838·k s (124 BPM, один бит = 14.5 кадров). Три жёсткие склейки f72, f101, f159 происходят за 2 кадра до бита: сохраняй именно эти кадры.
S1 f0–71, шапка + окно + нажатие: дымка #B7CFEB постепенно переходит в #FDFDFB к f28, внизу сохраняется голубое свечение пола #DBEEFD. Шапка в одну строку: диск логотипа ⌀132 (#FBFCFE, ободок 1px #E8E8EA, тёмный знак), название продукта (Inter 500), тёмная капсульная плашка "on Whop" (#2F2E2F, белый текст); весь блок занимает x474–1063, центральная линия поднимается по y932 (f0) → 776 (f2) → 683 (f5) → 608 (f10) → 546 (f24) → 536 (f37), затем смещается на 1 px/кадр. Название появляется на f2 размытым, плашка f4–5 сильно размыта и сдвигается на 15 px влево по мере прояснения. Вокруг него плавно появляется светлое окно хаба (радиус 93, заливка #FCFDFF, верхняя полоса #F1F6FF, внутреннее голубое свечение пола): непрозрачность от 0 до f14, 0.53 на f15, 0.7 на f19, 1.0 на f24; верхний левый угол (408,405), окно выходит за правый и нижний края. Внутри: поисковая плашка в верхней полосе, колонка иконок слева (иконка Courses в (537,739), выцветшая иконка Chat в (537,900)) и карточка курса от (764,700), уходящая за кадр, с обложкой, заголовком и текстом "Course · 8 lessons". Курсор (чёрная стрелка macOS с белой обводкой, 32x39) появляется на f27 в (891,393), плавно движется влево с замедлением к (770,383) на f44, поворачивается остриём вниз-влево на f47–51, ныряет и касается нижнего правого края диска (629,564) на f56 → (587,546) на f59 → (555,531) на f71; с f56 увеличивается в ×1.55 при наведении; вокруг диска с f53 загорается мягкое ледяное кольцо (#D5F3FF → #F7FEFF, внешний ⌀174). Камера масштабируется вокруг (540,540): 1.0 на f46 → 1.2 на f60 с плавным ускорением и замедлением, удерживает масштаб на f61, затем выходит из него с ускорением до 1.04 на f71, пока курсор нажимает (уменьшается на 15% на f69–71).
S2 f72–100, иконка + орбита: иконка приложения в виде сквиркла тёмно-синего цвета (#294376 → #1E2F52, белый знак), 276 px на f72, с плавным замедлением уменьшается до 178 px к f86, радиус — 28% ширины, на сером диске-ореоле #E9E9E7, растущем с ⌀240 (f75) до 326 (f86). Четыре квадрата по 92 px (радиус 26) вращаются против часовой стрелки с замедлением и к f86 фиксируются в кресте на радиусе орбиты ≈216: белый (ободок 1px #E3E8EF + слабая тень) слева, #2F6BFF сверху, #3CC8F0 справа, #4ED6A0 снизу. f88–100: иконка с ускорением уменьшается примерно до 40 px, квадраты смещаются в ряд справа от неё (белый квадрат прячется за иконкой), размытие нарастает от 0.3 до 6 px.
S3 f101–158, строка меню + промпт: белая страница над чёрной полосой рамки ноутбука (y425–475, верхняя подсветка #686866), тёмно-синяя строка меню (y477–538), обои ниже = градиент синего неба с тонкой белой линейной графикой (один большой круг, две горизонтальные линии, одна вертикальная, четырёхконечная искра в месте пересечения, мягкое бирюзовое свечение сверху справа). Правая группа строки меню белого цвета: Wi-Fi, батарея, переключатели, знак продукта на x531–584, три точки ⌀36 #2F6BFF / #3CC8F0 / #4ED6A0 на x612, 661, 709, "Mon Jun 22  9:41 AM" размером 34 px. Появляется с размытием 3 px и стабилизируется к f110. Курсор поднимается снизу (f102), останавливается на знаке и нажимает f113–117. Камера панорамирует содержимое вправо на +125 px в f115–130 (максимальная скорость f118–120). Поле из матового стекла (бело-голубое стекло поверх неба, яркий верхний ободок, радиус 60) выскакивает из-под знака на f116: максимальная ширина 744 на f126, затем к f138 стабилизируется на размере 726x228 вокруг x196–922, y568–797. Промпт печатается с f121 (первые различимые "Make ") до f150 (полностью набран) примерно по 1 символу за кадр, с паузой на 1 кадр каждые 2–3 символа; каретка всегда включена; внизу расположены три иконки с белой обводкой; кнопка отправки #2F6BFF ⌀51 с белой стрелкой вверх. С f136 вся сцена смещается вверх, переходя в ускоряющийся резкий наклон (на f158 скорость около 25 px/кадр, вертикальное размытие около 6–8 px), а страница окрашивается в #E6F4FE на протяжении f154–158.
S4 f159–186, страница с ответом: светлая страница урока курса (хлебные крошки, заголовок, основной текст): колонка текста x120, основной текст 47 px Inter 400 серого цвета #BCBCBA, межстрочный интервал 58, одна ключевая фраза ("frame for frame") чёрным цветом 600. Появляется со смазом на 420 px ниже, прокручивается вверх со смещениями 420, 315, 210, 170, 140, 116, 96, 81 (f166) … 14 (f175) … 0 (f180), затем медленно смещается на −6 px к f186. Размытие 24 px (f159) → 1.5 (f165) → 0. Вспышка #E2F4FE постепенно переходит в #FDFDFB к f165. Курсор, направленный строго вверх, движется вместе с прокруткой и останавливается под ключевой фразой (примерно (450,591) на f180), затем смещается вправо.
S5 f187–214, карточка: белая карточка (x203–878, уходит за нижний край) поднимается над страницей: изображение обложки 627x536 с отступом 24 px, радиус 64, светлая полоска для перетаскивания по центру верхнего края, подпись semibold 38 px чёрного цвета, дополнительная подпись серого цвета 23 px. Верх обложки y642 (f187) → 456 (f191) → 395 (f196) → 369 (f200) → 348 (f205), затем продолжает смещаться вверх примерно на 4 px/кадр. Размытие карточки достигает 3.8 px на f189, становится чётким к f201; страница позади размывается примерно на 2.5 px. Выход f207–214: карточка уменьшается примерно на 5% и поднимается, пока весь кадр размывается от 1 до 7 px; склейка на пике размытия.
S6 f215–244, две карточки: белая страница, две расположенные друг над другом карточки 538x348 (радиус 57, зазор 36), центрированные по x540, верхняя стабилизируется на y168 к f230, нижняя — на y552. Каждая: изображение обложки (без встроенного текста), матовая плашка в левом верхнем углу ("Module 3" / "Module 5"), матовый круг с "•••" в правом верхнем углу и огромный жирный заголовок вдоль нижнего края из матового стекла (размытая осветлённая копия изображения позади, обрезанная по буквам и срезанная нижним краем карточки): "Launch" и "Sound". Обе появляются с размытием 12 px и становятся чёткими к f224; верхняя карточка появляется увеличенной на 8% и поднимается с y264; нижняя поднимается с y927, с задержкой относительно верхней. В f230–238 они смещаются вверх на 3 px/кадр, затем ускоряются вверх и размываются перед склейкой.
S7 f245–300, диск с логотипом: страница #FDFDFB, диск ⌀168 #F6F6F6 с тёмным знаком поднимается в центр (верхний край y569 на f245 → 491 на f250 → 468 на f255 → 456 на f269) с вертикальной смазкой на кадре склейки, остаётся неподвижным на f269–287 (единственный застывший фрагмент), затем с ускорением уменьшается до ⌀123 на f300.
S8 f301–359, финальная заставка: чёрный радиальный фон (углы #020204, примерно #272729 вокруг словесного знака), словесный знак Inter 600, белый #F3F3F5 с плотным свечением и широким мягким ореолом, центрированный в (540,540). Ширина словесного знака: ≈1650 px на f301 (горизонтально размазанный, с полосами масштабирования) → 1350 на f302 → 1110 на f303 → 1049 на f304 → 734 на f309 → 678 на f311 → 563 на f320 → 516 на f342 (уменьшение примерно на 1 px/кадр) → 492 на f350, затем схлопывается с плавным ускорением: 450 на f355 → 267 на f359, при этом размытие нарастает до 3.5 px. Фильм заканчивается в середине схлопывания.
</structure>

<build>
1. Одна HTML-страница 1080x1080, отрисовываемая функцией seek(t) как чистой функцией номера кадра. Никаких CSS-переходов, таймеров и Math.random (только хеши с заданным seed). Планы регистрируются как {f0, f1, render(localFrame)}.
2. Каждое значение непрерывно меняется в зависимости от номера кадра (мастер 59.94 рендерит половинные кадры): анимация с помощью таблиц ключевых кадров kf(frame, [[f, value], ...], ease) и таблиц значений для каждого кадра с линейной интерполяцией. Не используй Math.floor для движения.
3. Размытие: CSS-фильтр blur для равномерного размытия, SVG feGaussianBlur с отдельными stdDeviation по x/y для направленных смазов. Смаз от масштабирования на финальной заставке = 20–30 масштабированных полупрозрачных копий словесного знака. Матовое стекло = размытая осветлённая копия того, что находится позади, обрезанная по форме.
4. Курсор: одна SVG-стрелка macOS (чёрная заливка, белая обводка, мягкая тень) с поворотом и масштабированием, повторно используемая в S1, S3, S4.
5. Звук (без голоса), ровно 12.075 s: музыка 124 BPM, мягкое вступление, дроп на 2.47 s (бит 5, склейка f72 опережает его на 2 кадра). Синтезированные SFX: мягкий удар 0.10 s; свуши с пиками на склейках 2.402, 3.370, 5.305, 10.043 s; переходные удары ровно на 6.240 s и 8.175 s; клики на 2.33 и 3.83 s; очень тихие щелчки клавиш каждые ~32 ms в промежутке 4.04–5.00 s; мягкое мерцание на 10.05 s. Мастеринг до −14 LUFS, true peak −1 dBTP, без фейда, кроме последних 60 ms.
6. Рендеринг с помощью Playwright (по одному скриншоту на кадр, сначала загрузить шрифты), кодирование H.264 yuv420p при 60000/1001, объединение с аудио.
</build>

<gotchas>
Измеряй текст только после загрузки шрифтов. Длинное название продукта не поместится там, где помещалось название из 5 букв: масштабируй весь блок (зазор до диска, название, плашку), чтобы он вписался в диапазон x474–1063, не позволяй плашке выйти за край кадра. Белый квадрат орбиты исчезает на белой странице без обводки 1px и слабой тени. Не помещай в карточки S6 изображения с уже встроенным текстом, иначе стеклянный заголовок задублируется. Сохраняй точные кадры склеек, даже если они не совпадают с битом. Ничего не замораживай, кроме S7 f269–287. Таблицы сильного размытия могут полностью стереть форму: если кадр выглядит пустым, уменьши размытие, пока форма всё ещё различима.
</gotchas>

<start>
Запроси входные данные. Затем покажи мне 4 стоп-кадра (f40 — шапка в окне, f86 — крест из иконки, f150 — готовый промпт, f230 — две карточки), прежде чем рендерить фильм целиком.
</start>
Открыть в каталоге
Права на промпт принадлежат автору @notdwd. За коммерческое использование — продвижение нейросетей, агрегаторов, Telegram-ботов — отвечаете вы: mozgi.io ответственности не несёт. Подробнее →
Модель
Claude Opus 5.5
Формат
16/9
Автор
@notdwd
Оригинал
x.com ↗

Похожие промпты

Все промпты для Claude Opus 5.5

Скопировано