Einrichtung: UGC-Anzeigengenerator-Promo

Bitten Sie mich um Folgendes: den Produktnamen und ein kurzes Versprechen, 3 bis 5 UI-Momente, die Sie zeigen möchten, eine Akzentfarbe, 10 bis 20 echte vertikale Clips aus meinem Besitz und einen lizenzfreien Song mit einem klaren Drop (z. B. Mixkit, kostenlos für die kommerzielle Nutzung).

Hochwertiger Minimalismus. Eine Idee pro Einstellung, viel Leerraum, eine Akzentfarbe, eine klare serifenlose Schriftart (Geist oder Inter) mit präziser Kameraführung. Maskierte Texteinblendungen, Match Cuts, eine einheitliche Kamerasprache. Ausschließlich reales Filmmaterial, keine Platzhalter. Keine Punkte im Text auf dem Bildschirm.
Verboten: Schockwellenringe, Partikelexplosionen, RGB-Split, Kamerawackeln, Linsenreflexionen, Neonleuchten, Gitterböden, blinkende Hintergründe, federnde Übergänge.

10 Takte à 120 BPM, jeweils 2 Sekunden.
Takt 1: Der Refrain trifft Wort für Wort auf den Takt.
Balken 2: Ein Aufhängerwort verwandelt sich in die Produkt-Benutzeroberfläche. Ein Cursor tippt und klickt.
Der Fall: Aus dem Knopf öffnet sich ein Kreis in eine dunkle Szene.
Dann ein Move pro Balken: eine Wand aus echten Clips mit einer Scanlinie und 3 Gewinnern, die wichtigste Ausgabe in großer Schrift, ein 3D-Karussell aus echten Videos mit Bodenreflexionen und einem Bewegungsunschärfe-Effekt auf einen Hero-Clip, der Held in einem Handy neben einem Panel, das zu den Ergebnissen umklappt, große Statistiken bei Push-Cuts, ein 3-Wort-Ticker, eine Logo-Einblendung, ein Fade-to-Black.

1. Eine HTML Datei in der Auflösung 1920x1080. Jeder Stil wird innerhalb der Datei neu berechnet.
http://
window.seek(t): Keine CSS Animationen, keine Timer, kein Zustand zwischen den Frames.
2. Reales Video: Clips mit ffmpeg in 30-fps-JPEG-Sequenzen extrahieren und Bildquellen pro Frame austauschen. Die Suchfunktion wartet auf die Bilddekodierung.
3. Analysiere den Song mit NumPy: Tempo, Beatgrid, Energie pro Takt, Drop. Kalibriere das Grid anhand der tatsächlichen Kick-Schläge. Jeder Schnitt liegt auf einem Downbeat, jeder UI-Hit auf einem Beat.
4. Rendern mit Playwright: 3 Unterbilder pro Bild bei t minus, at und plus 1/240s, anschließend mit ffmpeg tmix für echte Bewegungsunschärfe bei 60fps mischen.
5. Platzieren Sie jeden Soundeffekt so, dass sein gemessener Spitzenwert, nicht sein Dateianfang, auf das Ereignis fällt. Halten Sie die Effekte leise im Hintergrund der Musik. Loudnorm auf -14 LUFS einstellen.
6. Prüfen Sie mindestens 20 Einzelbilder vor dem vollständigen Rendern. Korrigieren Sie dabei alle unübersichtlichen, überlappenden oder schwer lesbaren Elemente.

Setzen Sie niemals Deckkraft oder Filter auf ein 3D-Element mit der Option „3D beibehalten“, da es dadurch reduziert wird und beide Seiten sichtbar sind. Blenden Sie stattdessen den umgebenden Rahmen aus. Messen Sie die Elementpositionen zur Laufzeit für präzise Schnitte. Verwenden Sie ausschließlich Musik und Soundeffekte, deren Lizenz die kommerzielle Nutzung erlaubt.

Bevor du mit dem Programmieren beginnst, frag mich nach den Eingaben und zeig mir ein Storyboard, auf dem alle Timings im Beat-Grid eingezeichnet sind.

Ask me for: the product name and a one-line promise, 3 to 5 UI moments to show, one accent color, 10 to 20 real vertical clips I own, and a royalty-free song with a clear drop (e.g. Mixkit, free for commercial use).

High-end minimal. One idea per shot, lots of empty space, one accent color, one clean sans (Geist or Inter) with tight tracking. Masked type reveals, match cuts, one smooth camera language. Real footage only, never placeholder cards. No full stops in on-screen text.
Banned: shockwave rings, particle bursts, RGB split, camera shake, lens flares, neon glows, grid floors, flashing backgrounds, bouncy easing.

10 bars at 120 BPM, 2 seconds each.
Bar 1: the hook lands word by word on the beats.
Bar 2: one hook word morphs into the product UI. A cursor types and clicks.
The drop: a circle opens out of the button into a dark scene.
Then one move per bar: a wall of real clips with a scan line and 3 winners, the key output as big type, a 3D carousel of real videos with floor reflections and a motion-blurred whip onto one hero clip, the hero in a phone next to a panel that flips into results, big stats on push cuts, a 3-word ticker, a logo reveal, a fade to black.

1. One HTML file at 1920x1080. Every style is computed from time inside
http://
window.seek(t): no CSS animations, no timers, no state between frames.
2. Real video: extract clips to 30fps JPEG sequences with ffmpeg and swap img sources per frame. seek awaits the image decodes.
3. Analyze the song with numpy: tempo, beat grid, energy per bar, the drop. Calibrate the grid to the real kick hits. Every cut sits on a downbeat, every UI hit on a beat.
4. Render with Playwright: 3 subframes per frame at t minus, at, and plus 1/240s, then blend with ffmpeg tmix for real motion blur at 60fps.
5. Place each sound effect so its measured peak, not its file start, lands on the event. Keep the effects quiet under the music. Loudnorm to -14 LUFS.
6. Probe 20 or more frames before the full render. Fix anything cluttered, overlapping or hard to read.

Never set opacity or filter on a preserve-3d element, because it flattens and both faces show. Fade its wrapper instead. Measure element positions at runtime for match cuts. Only use music and sound effects whose license allows commercial use.

Ask me for the inputs, then show me a storyboard with every timing on the beat grid before you write any code.

Vorlage entnommen aus Post @twoclipping.