Vídeo de lanzamento fotograma a fotograma

Pídeme: o nome do meu produto, un logotipo (ou deixar que debuxes unha marca simple), a cousa dunha liña que un usuario escribe na caixa de solicitude, a páxina que a responde (título + 2–3 frases cunha frase clave), dous nomes de funcións para as tarxetas apiladas e unha pista de música. Se salto algunha, úsanse os valores predeterminados: o produto "Fotograma a fotograma" dentro do seu centro Whop, unha marca no visor (catro corchetes nas esquinas arredor dun "FF" en negra), a solicitude "Crear un vídeo de lanzamento para a miña aplicación", unha páxina de lección titulada "2.1 Escolle unha referencia", as tarxetas "Lanzamento" e "Son", e a pista de música house gratuíta de Mixkit "Rising Forest" ralentizada a 124 BPM.

Unha imaxe cadrada de produto de 12 segundos, 1080x1080, números de fotogramas a 29,97 fps (f0–f359), renderización maestra a 59,94 fps. Sensación de presentación de Apple: suave, branco, azul brillante, vítreo. A cámara nunca corta nun fotograma estático: cada toma entra xa en movemento (redución exponencial, 12–19 % da distancia restante por fotograma) e sae nun movemento acelerado ou nunha rampa de desenfoque. O desenfoque segue a velocidade e a dirección en cada movemento.
Paleta: páxina #FDFDFB, néboa #B7CFEB, xeo #E6F0FA, azul intenso #294376 → #769CC2 degradado ceo, azul mariño #1E2F52, azuis de acento #2F6BFF / #3CC8F0 / menta #4ED6A0, branco. Tipo: Inter (400/500/600/700). Sen púrpura, violeta, maxenta ou laranxa en ningún lugar.
Historia: a cabeceira do produto sae dunha néboa azul dentro dunha xanela luminosa da aplicación → un cursor deslízase cara a dentro, xira para mirar cara a onde vai, medra ao pasar o rato e fai clic no logotipo → corte fixo na música, solta ata a icona da aplicación con catro cadrados que orbitan unha cruz → a icona colápsase nunha barra de menú de Mac → o cursor fai clic na icona da barra de menú, aparece unha caixa de solicitude de vidro esmerilado e a solicitude escribe → inclínase cara arriba a través dun flash azul claro ata a páxina de respostas, desprazándose ata o seu lugar → unha tarxeta elévase sobre ela → disólvese borrosa en dúas tarxetas apiladas con títulos xigantes de vidro esmerilado → disólvese borrosa no único disco do logotipo → corte fixo a unha tarxeta negra ao final cunha marca denominativa brillante.
Prohibidos: transicións cruzadas, fotogramas conxelados (agás un en S7), kits de IU estándar, brillos no texto da IU, Math.random, calquera cousa que pareza un modelo.

As coordenadas son px no escenario 1080. Compás musical k = 0,048 + 0,4838·ks (124 BPM, un compás = 14,5 fotogramas). Os tres cortes fixos f72, f101, f159 aterran 2 fotogramas antes dun compás: mantén estes fotogramas exactos.
S1 f0–71, cabeceira + xanela + clic: néboa #B7CFEB esvaecéndose a #FDFDFB en f28, mantense un brillo azul no chan #DBEEFD na parte inferior. Cabeceira nunha liña: disco do logotipo ⌀132 (#FBFCFE, bordo de 1 px #E8E8EA, marca escura), o nome do produto (Inter 500), unha pílula cápsula escura "en Whop" (#2F2E2F, texto branco); todo o bloqueo abrangue x474–1063, a liña central elévase y932 (f0) → 776 (f2) → 683 (f5) → 608 (f10) → 546 (f24) → 536 (f37), desviándose 1 px/fotograma despois. O nome aparece f2 borroso, a pílula f4–5 moi borrosa e deslizándose 15 px á esquerda mentres se enfoca. Unha xanela central de luz (radio 93, recheo #FCFDFF, banda superior #F1F6FF, brillo azul no chan interior) desvanécese ao seu redor: opacidade de 0 a f14, 0,53 f15, 0,7 f19, 1,0 f24; esquina superior esquerda (408,405), esténdese pola dereita e abaixo. Dentro: unha pílula de busca na banda superior, unha columna de iconas esquerda (icona de Cursos en (537,739), icona de Chat desvanecida en (537,900)) e unha tarxeta de curso de (764,700) fóra de fotograma coa súa imaxe de portada, título e "Curso · 8 leccións". Cursor (frecha negra de macOS, contorno branco, 32x39) aparece f27 en (891,393), deslízase cara á esquerda desacelerando ata (770,383) f44, xira para apuntar cara abaixo á esquerda f47–51 mentres se mergulla, aterra na parte inferior dereita do disco (629,564) f56 → (587,546) f59 → (555,531) f71; medra ×1,55 ao pasar o rato desde f56; un anel de xeo brando (#D5F3FF → #F7FEFF, ⌀exterior 174) ilumínase arredor do disco desde f53. A cámara fai un zoom arredor de (540,540): 1,0 f46 → 1,2 f60, entra e sae gradualmente, mantén premido f61 e logo sae gradualmente acelerando ata 1,04 en f71 mentres o cursor preme (redúcese un 15 % f69–71).
S2 f72–100, icona + órbita: icona da aplicación esquío azul mariño (#294376 → #1E2F52, marca branca), 276 px a f72 reducindo a suavización a 178 px por f86, radio 28 % do ancho, nun disco halo gris #E9E9E7 que medra ⌀240 (f75) → 326 (f86). Catro cadrados de 92 px (radio 26) xiran en sentido antihorario, desaceleran e bloquéanse nunha cruz no radio da órbita ≈216 por f86: branco (1px #E3E8EF bordo + sombra tenue) esquerda, #2F6BFF arriba, #3CC8F0 dereita, #4ED6A0 abaixo. f88–100: a icona encolle acelerando ata ≈40 px, os cadrados deslízanse nunha fila á súa dereita (o branco deslízase detrás da icona), o desenfoque aumenta de 0,3 a 6 px.
S3 f101–158, barra de menú + aviso: páxina branca sobre unha banda de bisel negra para portátil (y425–475, resaltado superior #686866), unha barra de menú azul mariño escuro (y477–538), fondo de pantalla abaixo = o degradado do ceo azul con liñas brancas finas (un círculo grande, dúas liñas horizontais, unha vertical, un brillo de catro puntos nun cruce, un brillo verde azulado suave na parte superior dereita). Grupo dereito da barra de menú en branco: Wi-Fi, batería, interruptores, a marca do produto en x531–584, tres puntos ⌀36 #2F6BFF / #3CC8F0 / #4ED6A0 en x612, 661, 709, "luns 22 de xuño 9:41 AM" 34 px. Entra borroso 3 px e aséntase en f110. Cursor sobe desde abaixo (f102), sitúase na marca, preme f113–117. A cámara fai panorámicas á dereita +125 px f115–130 (a máis rápida f118–120). Unha caixa de vidro esmerilado (vidro branco-azul sobre o ceo, bordo superior brillante, radio 60) sae de debaixo da marca f116: o ancho alcanza un pico de 744 en f126 e aséntase en 726x228 por f138 arredor de x196–922, y568–797. A indicación escribe de f121 (primeiro "Crea" lexible) a f150 (completo) a aproximadamente 1 carácter/fotograma cunha retención de 1 fotograma cada 2–3 caracteres; circunflexo sempre activado; tres iconas de contorno branco na parte inferior; botón de envío #2F6BFF ⌀51 cunha frecha branca cara arriba. Desde f136, toda a escena desprázase cara arriba, acelerando nun látego inclinado (f158 movéndose ≈25 px/fotograma, desenfoque vertical ≈6–8 px) mentres a páxina se tinxe #E6F4FE sobre f154–158.
S4 f159–186, páxina de respostas: unha páxina de lección dun curso lixeiro (miña de navegación, título, corpo): columna de texto x120, corpo 47 px Inter 400 gris #BCBCBA, paso entre liñas 58, unha frase clave ("fotograma a fotograma") en negro 600. Chega borrosa e 420 px baixa, desprázase cara arriba con desprazamentos 420, 315, 210, 170, 140, 116, 96, 81 (f166) … 14 (f175) … 0 (f180), despois avanza -6 px en f186. Desenfoque 24 px (f159) → 1,5 (f165) → 0. Flash #E2F4FE esvaecéndose a #FDFDFB en f165. Un cursor apuntando cara arriba percorre o desprazamento e detense debaixo da frase clave (≈(450,591) f180) e logo desprázase cara á dereita.
S5 f187–214, cartolina: unha cartolina branca (x203–878, sae da parte inferior) elévase sobre a páxina: imaxe da portada 627x536 inserida 24 px, radio 64, unha barra de agarre de luz na súa parte superior central, lenda seminegra 38 px negra, sublenda gris 23 px. Parte superior da portada y642 (f187) → 456 (f191) → 395 (f196) → 369 (f200) → 348 (f205), despois segue subindo ~4 px/fotograma. O desenfoque da cartolina alcanza un máximo de 3,8 px a f189, nítido en f201; a páxina que hai detrás desenfocase a ≈2,5 px. Saída de f207–214: a cartolina contrae ~5 % e elévase mentres que todo o fotograma se desenfoca 1 → 7 px; cortar no pico de desenfoque.
S6 f215–244, dúas tarxetas: páxina branca, dúas tarxetas apiladas de 538x348 (radio 57, espazo 36) centradas en x540, a tarxeta superior asentándose en y168 por f230, a inferior en y552. Cada unha: portada (sen texto integrado), unha pílula esmerilada na parte superior esquerda ("Módulo 3" / "Módulo 5"), un "•••" redondo esmerilado na parte superior dereita e un título enorme en negra no bordo inferior feito de vidro esmerilado (unha copia borrosa e aclarada da imaxe recortada ás letras, cortada polo bordo inferior da tarxeta): "Lanzamento" e "Son". Ambas entran borrosas a 12 px e nítidas a f224; a tarxeta superior entra cun 8 % de tamaño e sae desde y264; a tarxeta inferior sae desde y927, cambaleándose detrás dela. Suben 3 px/fotograma f230–238, despois aceleran e saen desenfocadas no corte.
S7 f245–300, disco do logotipo: páxina #FDFDFB, disco ⌀168 #F6F6F6 coa marca escura, ascende cara ao centro (parte superior y569 f245 → 491 f250 → 468 f255 → 456 f269) cunha mancha vertical no marco cortado, mantense quieta f269–287 (o único tramo conxelado) e logo contrae acelerando ata ⌀123 a f300.
S8 f301–359, tarxeta final: fondo radial negro (esquinas #020204, ≈#272729 arredor da palabra), a marca denominativa en Inter 600, #F3F3F5 branca cun brillo axustado máis un halo amplo e suave, centrado (540,540). Largura da palabra: ≈1650 px f301 (manchada horizontalmente, raias de zoom) → 1350 f302 → 1110 f303 → 1049 f304 → 734 f309 → 678 f311 → 563 f320 → 516 f342 (≈1 px/fotograma de contracción) → 492 f350, despois contraese con facilitación de entrada: 450 f355 → 267 f359 cun desenfoque que aumenta a 3,5 px. A película remata a metade do contraemento.

1. Unha páxina HTML, 1080x1080, debuxada por seek(t) como unha función pura do número de fotograma. Sen transicións CSS, sen temporizadores, sen Math.random (só hashes con sementes). As tomas rexístranse como {f0, f1, render(localFrame)}.
2. Cada valor é continuo no número de fotograma (o mestre 59,94 renderiza medios fotogramas): anima con táboas de fotogramas clave kf(fotograma, [[f, valor],...], facilidade) e táboas de busca por fotograma con interpolación lineal. Sen Math.floor no movemento.
3. Desenfoque: desenfoque de filtro CSS para desenfoque redondo, feGaussianBlur SVG con stdDeviation x/y separada para manchas direccionais. Mancha de zoom na tarxeta final = 20–30 copias escaladas e descoloridas da palabra. Vidro esmerilado = unha copia borrosa e aclarada do que hai detrás, recortada á forma.
4. Cursor: unha frecha SVG de macOS (recheo negro, contorno branco, sombra suave) con rotación e escala, reutilizada en S1, S3 e S4.
5. Son (sen voz), exactamente 12,075 s: música a 124 BPM, introdución suave, caída aos 2,47 s (tiempo 5, o corte a f72 adiántao por 2 fotogramas). SFX sintetizados: impacto suave 0,10 s; sibilos con picos nos cortes 2,402, 3,370, 5,305, 10,043 s; transición exactamente aos 6,240 s e 8,175 s; clics a 2,33 e 3,83 s; tic-tacs de tecla moi suaves cada ~32 ms durante 4,04–5,00 s; un brillo suave a 10,05 s. Masterizado a −14 LUFS, pico verdadeiro −1 dBTP, sen fade agás os últimos 60 ms.
6. Renderizar con Playwright (unha captura de pantalla por fotograma, cargando primeiro as fontes), codificar H.264 yuv420p a 60000/1001, multiplexar o audio.

Mide o texto só despois de cargar as fontes. Un nome de produto longo non encaixará onde encaixaba un nome de 5 letras: escala todo o bloqueo (espazo do disco, nome, pílula) para que se axuste ao intervalo x474–1063, non deixes que a pílula caia fóra do cadro. Un cadrado orbital branco desaparece na páxina branca sen un bordo de 1 px e unha sombra tenue. Non coloques imaxes co seu propio texto dentro das tarxetas S6, ou o título de vidro duplícase. Mantén os cadros cortados exactos mesmo onde non se asenten nun ritmo. Nada se conxela agás S7 f269–287. As táboas de desenfoque pesado poden borrar unha forma por completo: se un cadro parece baleiro, reduce o desenfoque ata que a forma aínda se lea.

Pídeme as entradas. Despois móstrame 4 imaxes fixas (f40 cabeceira na xanela, f86 icona cruz, f150 solicitude de finalización, f230 as dúas tarxetas) antes de renderizar a película completa.

Ask me for: my product name, a logo (or let you draw a simple mark), the one-line thing a user types into the prompt box, the page that answers it (title + 2–3 sentences with one key phrase), two feature names for the stacked cards, and a music track. If I skip any, use the defaults: product "Frame by Frame" living inside its Whop hub, a viewfinder mark (four corner brackets around a bold "FF"), prompt "Make a launch video for my app", a lesson page titled "2.1 Choose a reference", cards "Launch" and "Sound", and Mixkit's free house track "Rising Forest" slowed to 124 BPM.

A 12 second square product sting, 1080x1080, frame numbers at 29.97 fps (f0–f359), master rendered at 59.94 fps. Apple-keynote feel: soft, white, bright blue, glassy. The camera never cuts on a still frame: every shot enters already moving (exponential ease-out, 12–19% of the remaining distance per frame) and leaves on an accelerating move or a blur ramp. Blur follows speed and direction on every move.
Palette: page #FDFDFB, haze #B7CFEB, ice #E6F0FA, deep blue #294376 → #769CC2 sky gradient, navy #1E2F52, accent blues #2F6BFF / #3CC8F0 / mint #4ED6A0, white. Type: Inter (400/500/600/700). No purple, violet, magenta or orange anywhere.
Story: the product header rises out of a blue haze inside a light app window → a cursor glides in, turns to face where it's going, grows on hover and clicks the logo → hard cut on the music drop to the app icon with four squares orbiting into a cross → the icon collapses into a Mac menu bar → the cursor clicks the menu-bar icon, a frosted glass prompt box springs out and the prompt types → whip-tilt up through a light-blue flash into the answer page scrolling into place → a card rises over it → blur-dissolve to two stacked cards with giant frosted-glass titles → blur-dissolve to the lone logo disc → hard cut to a black end card with a glowing wordmark.
Banned: crossfades, frozen frames (except one hold in S7), stock UI kits, glows on UI text, Math.random, anything that looks like a template.

Coordinates are px on the 1080 stage. Music beat k = 0.048 + 0.4838·k s (124 BPM, one beat = 14.5 frames). The three hard cuts f72, f101, f159 land 2 frames before a beat: keep these exact frames.
S1 f0–71, header + window + click: haze #B7CFEB fading to #FDFDFB by f28, keep a blue floor glow #DBEEFD at the bottom. Header on one line: logo disc ⌀132 (#FBFCFE, 1px rim #E8E8EA, dark mark), the product name (Inter 500), a dark capsule pill "on Whop" (#2F2E2F, white text); the whole lockup spans x474–1063, centre line rises y932 (f0) → 776 (f2) → 683 (f5) → 608 (f10) → 546 (f24) → 536 (f37), drifting 1 px/frame after. Name appears f2 blurred, pill f4–5 heavily blurred and sliding 15 px left as it sharpens. A light hub window (radius 93, fill #FCFDFF, top band #F1F6FF, blue inner floor glow) fades in around it: opacity 0 to f14, 0.53 f15, 0.7 f19, 1.0 f24; top-left corner (408,405), runs off the right and bottom. Inside: a search pill in the top band, a left icon column (Courses icon at (537,739), faded Chat icon at (537,900)), and a course card from (764,700) off-frame with its cover image, title and "Course · 8 lessons". Cursor (black macOS arrow, white outline, 32x39) appears f27 at (891,393), glides left decelerating to (770,383) f44, rotates to point down-left f47–51 as it dives, lands on the disc's lower right (629,564) f56 → (587,546) f59 → (555,531) f71; grows ×1.55 on hover from f56; a soft ice ring (#D5F3FF → #F7FEFF, outer ⌀174) lights around the disc from f53. Camera zooms about (540,540): 1.0 f46 → 1.2 f60 ease-in-out, holds f61, then eases out accelerating to 1.04 at f71 while the cursor presses (shrinks 15% f69–71).
S2 f72–100, icon + orbit: navy squircle app icon (#294376 → #1E2F52, white mark), 276 px at f72 shrinking ease-out to 178 px by f86, radius 28% of width, on a grey halo disc #E9E9E7 growing ⌀240 (f75) → 326 (f86). Four 92 px squares (radius 26) spin in counter-clockwise, decelerating, and lock into a cross at orbit radius ≈216 by f86: white (1px #E3E8EF edge + faint shadow) left, #2F6BFF top, #3CC8F0 right, #4ED6A0 bottom. f88–100: the icon shrinks accelerating to ≈40 px, the squares slide into a row on its right (white slips behind the icon), blur ramps 0.3 → 6 px.
S3 f101–158, menu bar + prompt: white page above a black laptop bezel band (y425–475, top highlight #686866), a dark navy menu bar (y477–538), wallpaper below = the blue sky gradient with thin white line art (one big circle, two horizontal lines, one vertical, a four-point sparkle at a crossing, soft teal glow top-right). Menu bar right cluster in white: Wi-Fi, battery, toggles, the product mark at x531–584, three ⌀36 dots #2F6BFF / #3CC8F0 / #4ED6A0 at x612, 661, 709, "Mon Jun 22  9:41 AM" 34 px. Enters blurred 3 px and settling by f110. Cursor rises from below (f102), sits on the mark, presses f113–117. Camera pans content right +125 px f115–130 (fastest f118–120). A frosted glass box (white-blue glass over the sky, bright top rim, radius 60) springs out from under the mark f116: width peaks 744 at f126 and settles 726x228 by f138 around x196–922, y568–797. The prompt types from f121 (first legible "Make ") to f150 (complete) at about 1 char/frame with a 1-frame hold every 2–3 chars; caret always on; three white outline icons along the bottom; send button #2F6BFF ⌀51 with a white up arrow. From f136 the whole scene drifts up, accelerating into a whip-tilt (f158 moving ≈25 px/frame, vertical blur ≈6–8 px) while the page tints #E6F4FE over f154–158.
S4 f159–186, answer page: a light course lesson page (breadcrumb, title, body): text column x120, body 47 px Inter 400 grey #BCBCBA, line pitch 58, one key phrase ("frame for frame") in black 600. It arrives smeared and 420 px low, scrolls up with offsets 420, 315, 210, 170, 140, 116, 96, 81 (f166) … 14 (f175) … 0 (f180), then creeps −6 px by f186. Blur 24 px (f159) → 1.5 (f165) → 0. Flash #E2F4FE fading to #FDFDFB by f165. A cursor pointing straight up rides the scroll and stops under the key phrase (≈(450,591) f180), then drifts right.
S5 f187–214, card: a white card (x203–878, runs off the bottom) rises over the page: cover image 627x536 inset 24 px, radius 64, a light grabber bar at its top centre, caption semibold 38 px black, sub-caption grey 23 px. Cover top y642 (f187) → 456 (f191) → 395 (f196) → 369 (f200) → 348 (f205), then keeps drifting up ~4 px/frame. Card blur peaks 3.8 px at f189, sharp by f201; the page behind blurs to ≈2.5 px. Exit f207–214: card shrinks ~5% and rises while the whole frame blurs 1 → 7 px; cut at the blur peak.
S6 f215–244, two cards: white page, two stacked cards 538x348 (radius 57, gap 36) centred on x540, top card settling at y168 by f230, bottom at y552. Each: cover art (no text baked into it), a frosted pill top-left ("Module 3" / "Module 5"), a frosted round "•••" top-right, and a huge bold title along the bottom edge made of frosted glass (a blurred, lightened copy of the image clipped to the letters, cut off by the card's bottom edge): "Launch" and "Sound". Both enter blurred 12 px and sharp by f224; the top card enters 8% large and rises from y264; the bottom card rises from y927, staggered behind it. They drift up 3 px/frame f230–238, then accelerate up and blur out into the cut.
S7 f245–300, logo disc: page #FDFDFB, disc ⌀168 #F6F6F6 with the dark mark, rises into the centre (top y569 f245 → 491 f250 → 468 f255 → 456 f269) with a vertical smear on the cut frame, holds still f269–287 (the only frozen stretch), then shrinks accelerating to ⌀123 at f300.
S8 f301–359, end card: black radial background (#020204 corners, ≈#272729 around the word), the wordmark in Inter 600, white #F3F3F5 with a tight glow plus a wide soft halo, centred (540,540). Word width: ≈1650 px f301 (horizontally smeared, zoom streaks) → 1350 f302 → 1110 f303 → 1049 f304 → 734 f309 → 678 f311 → 563 f320 → 516 f342 (≈1 px/frame shrink) → 492 f350, then collapses ease-in: 450 f355 → 267 f359 with blur rising to 3.5 px. The film ends mid-collapse.

1. One HTML page, 1080x1080, drawn by seek(t) as a pure function of the frame number. No CSS transitions, no timers, no Math.random (seeded hashes only). Shots register as {f0, f1, render(localFrame)}.
2. Every value is continuous in the frame number (the 59.94 master renders half frames): animate with keyframe tables kf(frame, [[f, value], ...], ease) and per-frame lookup tables with linear interpolation. No Math.floor on motion.
3. Blur: CSS filter blur for round blur, SVG feGaussianBlur with separate x/y stdDeviation for directional smears. Zoom smear on the end card = 20–30 scaled, faded copies of the word. Frosted glass = a blurred, lightened copy of what's behind, clipped to the shape.
4. Cursor: one SVG macOS arrow (black fill, white outline, soft shadow) with rotation and scale, reused in S1, S3, S4.
5. Sound (no voice), exactly 12.075 s: music at 124 BPM, soft intro, the drop at 2.47 s (beat 5, the f72 cut leads it by 2 frames). Synthesized SFX: soft impact 0.10 s; whooshes peaking at the cuts 2.402, 3.370, 5.305, 10.043 s; transition hits exactly on 6.240 s and 8.175 s; clicks at 2.33 and 3.83 s; very quiet key ticks every ~32 ms over 4.04–5.00 s; a soft shimmer at 10.05 s. Master to −14 LUFS, true peak −1 dBTP, no fade except the last 60 ms.
6. Render with Playwright (one screenshot per frame, fonts loaded first), encode H.264 yuv420p at 60000/1001, mux the audio.

Measure text only after the fonts load. A long product name won't fit where a 5-letter name did: scale the whole lockup (disc gap, name, pill) to fit the span x474–1063, don't let the pill fall off-frame. A white orbit square vanishes on the white page without a 1px edge and a faint shadow. Don't put images with their own text inside the S6 cards, or the glass title doubles up. Keep the cut frames exact even where they don't sit on a beat. Nothing freezes except S7 f269–287. Heavy blur tables can wipe a shape out completely: if a frame looks empty, lower the blur until the shape still reads.

Ask me for the inputs. Then show me 4 stills (f40 header in the window, f86 icon cross, f150 finished prompt, f230 the two cards) before you render the full film.

Solicitude tomada de publicación @notdwd.