راه‌اندازی: ویدیوی رونمایی فریم به فریم

از من بخواهید: نام محصول، یک لوگو (یا اجازه دهید یک علامت ساده رسم کنید)، چیزی که کاربر در کادر سوال تایپ می‌کند، صفحه‌ای که به آن پاسخ می‌دهد (عنوان + ۲-۳ جمله با یک عبارت کلیدی)، دو نام ویژگی برای کارت‌های روی هم چیده شده و یک آهنگ موسیقی. اگر هر کدام را از قلم انداختم، از موارد پیش‌فرض استفاده کنید: محصول "فریم به فریم" که در مرکز Whop آن قرار دارد، یک علامت منظره‌یاب (چهار براکت گوشه‌ای دور یک "FF" پررنگ)، درخواست "یک ویدیوی راه‌اندازی برای برنامه من بسازید"، یک صفحه درس با عنوان "۲.۱ انتخاب مرجع"، کارت‌های "راه‌اندازی" و "صدا"، و آهنگ هاوس رایگان Mixkit "جنگل در حال طلوع" که به ۱۲۴ BPM کاهش یافته است.

یک صحنه‌ی مربعی ۱۲ ثانیه‌ای، وضوح تصویر ۱۰۸۰x۱۰۸۰، تعداد فریم‌ها ۲۹.۹۷ فریم بر ثانیه (f0-f359)، رندر نهایی ۵۹.۹۴ فریم بر ثانیه. حس و حال سخنرانی اپل: نرم، سفید، آبی روشن، شیشه‌ای. دوربین هرگز روی یک فریم ثابت کات نمی‌زند: هر نما وارد یک حرکت از قبل در حال حرکت می‌شود (کاهش نمایی، ۱۲ تا ۱۹٪ از فاصله‌ی باقی‌مانده در هر فریم) و با یک حرکت شتاب‌دار یا یک شیب محوشدگی از آن خارج می‌شود. محوشدگی در هر حرکت، سرعت و جهت را دنبال می‌کند.
پالت رنگ: page #FDFDFB، haze #B7CFEB، ice #E6F0FA، آبی تیره #294376 → گرادینت آسمانی #769CC2، سرمه‌ای #1E2F52، آبی‌های تند #2F6BFF / #3CC8F0 / نعناعی #4ED6A0، سفید. نوع: Inter (400/500/600/700). در هیچ کجا از رنگ‌های بنفش، ارغوانی، سرخابی یا نارنجی استفاده نشده است.
داستان: عنوان محصول از یک مه آبی درون یک پنجره برنامه روشن بیرون می‌آید → یک مکان‌نما به آرامی وارد می‌شود، به سمتی که می‌رود برمی‌گردد، با نگه داشتن ماوس بزرگ می‌شود و روی لوگو کلیک می‌کند → برش سخت روی موسیقی، به آیکون برنامه با چهار مربع که به شکل ضربدر دور هم می‌چرخند، می‌افتد → آیکون به یک نوار منوی مک تبدیل می‌شود → مکان‌نما روی آیکون نوار منو کلیک می‌کند، یک کادر راهنمای شیشه‌ای مات بیرون می‌آید و راهنما تایپ می‌شود → با حرکت سریع و سریع از طریق یک فلش آبی روشن به صفحه پاسخ می‌رسد و در جای خود قرار می‌گیرد → یک کارت روی آن بالا می‌آید → محو شدن...
موارد ممنوع: کراس‌فیدها، فریم‌های ثابت (به جز یک مورد در S7)، کیت‌های رابط کاربری پیش‌فرض، درخشش روی متن رابط کاربری، Math.random، هر چیزی که شبیه الگو باشد.

مختصات در صحنه ۱۰۸۰ پیکسل هستند. ضرب موسیقی k = 0.048 + 0.4838·ks (124 BPM ، یک ضرب = ۱۴.۵ فریم). سه برش سخت f72، f101، f159 دو فریم قبل از یک ضرب فرود می‌آیند: دقیقاً همین فریم‌ها را نگه دارید.
S1 f0–71، سربرگ + پنجره + کلیک: کدری #B7CFEB با f28 به #FDFDFB محو می‌شود، درخشش آبی کف #DBEEFD را در پایین نگه دارید. سربرگ در یک خط: دیسک لوگو ⌀132 (#FBFCFE، حاشیه 1 پیکسلی #E8E8EA، علامت تیره)، نام محصول (Inter 500)، یک قرص کپسول تیره "روی Whop" (#2F2E2F، متن سفید)؛ کل قفل در x474–1063 قرار دارد، خط مرکزی از y932 (f0) → 776 (f2) → 683 (f5) → 608 (f10) → 546 (f24) → 536 (f37) بالا می‌رود و 1 پیکسل در هر فریم بعد از آن حرکت می‌کند. نام در f2 تار شده، قرص f4–5 به شدت تار شده و با تیزتر شدن، 15 پیکسل به سمت چپ کشیده می‌شود. یک پنجره‌ی هاب نوری (شعاع ۹۳، رنگ پرکننده #FCFDFF، نوار بالایی #F1F6FF، درخشش آبی کف داخلی) در اطراف آن محو می‌شود: شفافیت ۰ تا f14، ۰.۵۳ f15، ۰.۷ f19، ۱.۰ f24؛ گوشه‌ی بالا سمت چپ (۴۰۸۴۰۵)، از سمت راست و پایین امتداد می‌یابد. داخل: یک قرص جستجو در نوار بالا، یک ستون آیکون سمت چپ (آیکون دوره‌ها در (۵۳۷۷۳۹)، آیکون چت محو شده در (۵۳۷۹۰۰)) و یک کارت دوره از (۷۶۴۷۰۰) خارج از قاب با تصویر جلد، عنوان و "دوره · ۸ درس". Cursor (فلش مشکی macOS، طرح کلی سفید، ۳۲x۳۹) در f27 در (۸۹۱۳۹۳) ظاهر می‌شود، به سمت چپ می‌لغزد و سرعتش را به (۷۷۰۳۸۳) f44 کاهش می‌دهد، در حین شیرجه به سمت پایین-چپ f47–51 می‌چرخد، در پایین سمت راست دیسک فرود می‌آید (۶۲۹۵۶۴) f56 → (۵۸۷۵۴۶) f59 → (۵۵۵۵۵۳۱) f71؛ با شناور شدن از f56، ۱.۵۵ برابر بزرگتر می‌شود؛ یک حلقه یخی نرم (#D5F3FF → #F7FEFF، بیرونی ⌀۱۷۴) در اطراف دیسک از f53 روشن می‌شود. دوربین حدود (540,540) زوم می‌کند: 1.0 f46 → 1.2 f60 با حرکت آهسته وارد-خارج می‌شود، f61 را نگه می‌دارد، سپس با سرعت گرفتن تا 1.04 در f71 و در حالی که مکان‌نما را فشار می‌دهید، به آرامی خارج می‌شود (15٪ f69-71 را کوچک می‌کند).
S2 f72–100، آیکون + مدار: آیکون برنامه با دایره سرمه‌ای (#294376 → #1E2F52، علامت سفید)، 276 پیکسل در f72 که به آرامی به 178 پیکسل در f86، شعاع 28٪ عرض، روی یک دیسک هاله خاکستری #E9E9E7 که ⌀240 (f75) → 326 (f86) رشد می‌کند، کوچک می‌شود. چهار مربع 92 پیکسلی (شعاع 26) در خلاف جهت عقربه‌های ساعت می‌چرخند، سرعتشان کاهش می‌یابد و در شعاع مدار ≈216 در f86 به شکل ضربدر قفل می‌شوند: سفید (لبه 1 پیکسلی #E3E8EF + سایه ضعیف) سمت چپ، #2F6BFF بالا، #3CC8F0 راست، #4ED6A0 پایین. f88–100: آیکون با سرعت به ≈40 پیکسل کوچک می‌شود، مربع‌ها در یک ردیف در سمت راست آن قرار می‌گیرند (رنگ سفید پشت آیکون می‌لغزد)، شیب‌های محوشدگی 0.3 → 6 پیکسل افزایش می‌یابد.
S3 f101–158، نوار منو + اعلان: صفحه سفید بالای نوار قاب لپ‌تاپ مشکی (y425–475، هایلایت بالا #686866)، نوار منو سرمه‌ای تیره (y477–538)، تصویر زمینه پایین = گرادیان آسمان آبی با خط سفید نازک (یک دایره بزرگ، دو خط افقی، یک خط عمودی، یک درخشش چهار نقطه‌ای در یک تقاطع، درخشش فیروزه‌ای ملایم در بالا سمت راست). خوشه سمت راست نوار منو به رنگ سفید: وای‌فای، باتری، دکمه‌های تغییر وضعیت، علامت محصول در x531–584، سه نقطه ⌀36 #2F6BFF / #3CC8F0 / #4ED6A0 در x612، 661، 709، "دوشنبه 22 ژوئن 9:41 صبح" 34 پیکسل. وارد می‌شود و 3 پیکسل تار می‌شود و با f110 تنظیم می‌شود. Cursor از پایین بالا می‌رود (f102)، روی علامت قرار می‌گیرد، f113–117 را فشار می‌دهد. دوربین محتوا را به سمت راست +125 پیکسل f115–130 (سریعترین f118–120) حرکت می‌دهد. یک جعبه شیشه‌ای مات (شیشه سفید-آبی بر فراز آسمان، لبه بالایی روشن، شعاع 60) از زیر علامت f116 بیرون می‌زند: عرض در f126 به 744 می‌رسد و در حدود x196–922، y568–797 به 726x228 در f138 می‌رسد. اعلان از f121 (اولین خوانا "Make") تا f150 (کامل) با حدود 1 کاراکتر/فریم با یک نگهدارنده 1 فریم در هر 2–3 کاراکتر تایپ می‌شود؛ نشانگر همیشه روشن است؛ سه آیکون حاشیه سفید در پایین؛ دکمه ارسال #2F6BFF ⌀51 با یک فلش سفید رو به بالا. از f136 به بعد، کل صحنه به سمت بالا حرکت می‌کند و با شیبی تند (f158 با حرکت ≈25 پیکسل در هر فریم، تاری عمودی ≈6-8 پیکسل) حرکت می‌کند، در حالی که صفحه روی f154-158 به رنگ #E6F4FE درمی‌آید.
S4 f159–186، صفحه پاسخ: یک صفحه درس دوره آموزشی سبک (نشانه، عنوان، بدنه): ستون متن x120، بدنه 47 پیکسل Inter 400 خاکستری #BCBCBA، فاصله خط 58، یک عبارت کلیدی ("قاب برای قاب") به رنگ مشکی 600. به صورت لکه‌دار و با وضوح 420 پیکسل پایین می‌رسد، با انحرافات 420، 315، 210، 170، 140، 116، 96، 81 (f166) … 14 (f175) … 0 (f180) به بالا اسکرول می‌شود، سپس با f186 به اندازه 6- پیکسل می‌خزد. Blur 24 px (f159) → 1.5 (f165) → 0. Flash #E2F4FE که با f165 به #FDFDFB محو می‌شود. مکان‌نمایی که مستقیماً به سمت بالا اشاره می‌کند، اسکرول را طی می‌کند و زیر عبارت کلیدی ‎(≈(450,591) f180)‎ متوقف می‌شود، سپس به سمت راست حرکت می‌کند.
S5 f187–214، کارت: یک کارت سفید (x203–878، از پایین شروع می‌شود) روی صفحه بالا می‌رود: تصویر جلد 627x536 با اندازه inset 24 پیکسل، شعاع 64، یک نوار نشانگر نور در مرکز بالای آن، عنوان نیمه پررنگ 38 پیکسل مشکی، عنوان فرعی خاکستری 23 پیکسل. بالای جلد y642 (f187) → 456 (f191) → 395 (f196) → 369 (f200) → 348 (f205)، سپس به سمت بالا حرکت می‌کند حدود 4 پیکسل در هر فریم. حداکثر میزان محوشدگی کارت در f189، 3.8 پیکسل است و در f201 واضح می‌شود؛ صفحه پشت آن تا ≈2.5 پیکسل محو می‌شود. خروج از f207–214: کارت حدود ۵٪ کوچک می‌شود و در حالی که کل قاب ۱ → ۷ پیکسل تار می‌شود، بالا می‌رود؛ در اوج تار شدن، برش داده می‌شود.
S6 f215–244، دو کارت: صفحه سفید، دو کارت روی هم چیده شده با ابعاد ۵۳۸x۳۴۸ (شعاع ۵۷، فاصله ۳۶) که روی x540 متمرکز شده‌اند، کارت بالایی در y168 در f230 و کارت پایینی در y552 قرار دارد. هر کدام: طرح جلد (بدون متن)، یک قرص مات در بالا سمت چپ ("ماژول ۳" / "ماژول ۵")، یک "•••" گرد مات در بالا سمت راست، و یک عنوان بزرگ و پررنگ در امتداد لبه پایین ساخته شده از شیشه مات (یک کپی تار و روشن از تصویر که به حروف چسبیده و توسط لبه پایین کارت قطع شده است): "Launch" و "Sound". هر دو با اندازه تار ۱۲ پیکسل و وضوح f224 وارد می‌شوند؛ کارت بالایی با اندازه ۸٪ بزرگ وارد می‌شود و از y264 بالا می‌رود؛ کارت پایینی از y927 بالا می‌رود و پشت آن قرار می‌گیرد. آنها به اندازه ۳ پیکسل در هر فریم f230-238 به سمت بالا حرکت می‌کنند، سپس سرعت می‌گیرند و در برش محو می‌شوند.
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). عرض کلمه: ≈۱۶۵۰ پیکسل f301 (به صورت افقی محو شده، رگه‌های زوم) → ۱۳۵۰ f302 → ۱۱۱۰ f303 → ۱۰۴۹ f304 → ۷۳۴ f309 → ۶۷۸ f311 → ۵۶۳ f320 → ۵۱۶ f342 (≈۱ پیکسل بر فریم کوچک‌تر) → ۴۹۲ f350، سپس با کاهش تدریجی به ۴۵۰ f355 → ۲۶۷ f359 با تاری که تا ۳.۵ پیکسل افزایش می‌یابد، می‌رسد. فیلم در اواسط جمع شدن به پایان می‌رسد.

۱. یک صفحه HTML ، ۱۰۸۰x۱۰۸۰، که توسط تابع seek(t) به عنوان تابعی خالص از شماره فریم رسم شده است. بدون انتقال CSS ، بدون تایمر، بدون Math.random (فقط هش‌های seeded). شات‌ها به صورت {f0, f1, render(localFrame)} ثبت می‌شوند.
۲. هر مقدار در شماره فریم پیوسته است (پردازنده اصلی ۵۹.۹۴ نصف فریم‌ها را رندر می‌کند): با جداول فریم کلیدی kf(frame, [[f, value],...], ease) و جداول جستجوی هر فریم با درون‌یابی خطی، متحرک‌سازی انجام می‌شود. بدون Math.floor در حرکت.
۳. محو کردن: فیلتر محو کردن CSS برای محو کردن گرد، SVG feGaussianBlur با انحراف معیار x/y جداگانه برای لکه‌های جهت‌دار. لکه بزرگ‌نمایی روی کارت پایان = ۲۰-۳۰ کپی محو شده و مقیاس‌بندی شده از کلمه. شیشه مات = یک کپی محو و روشن شده از آنچه در پشت است، که به شکل برش داده شده است.
۴. Cursor: یک فلش SVG macOS (پرکننده مشکی، خطوط بیرونی سفید، سایه ملایم) با چرخش و مقیاس، که در S1، S3، S4 دوباره استفاده شده است.
۵. صدا (بدون کلام)، دقیقاً ۱۲.۰۷۵ ثانیه: موسیقی با سرعت ۱۲۴ BPM ، مقدمه‌ی ملایم، افت صدا در ۲.۴۷ ثانیه (ضرب ۵، برش f72 آن را ۲ فریم جلوتر می‌برد). جلوه‌های ویژه صوتی ترکیبی: ضربه‌ی ملایم ۰.۱۰ ثانیه؛ صدای ووش در برش‌های ۲.۴۰۲، ۳.۳۷۰، ۵.۳۰۵، ۱۰.۰۴۳ ثانیه؛ انتقال دقیقاً در ۶.۲۴۰ ثانیه و ۸.۱۷۵ ثانیه اتفاق می‌افتد؛ کلیک در ۲.۳۳ و ۳.۸۳ ثانیه؛ تیک‌های بسیار آرام کلید هر حدود ۳۲ میلی‌ثانیه طی ۴.۰۴ تا ۵.۰۰ ثانیه؛ یک سوسوی ملایم در ۱۰.۰۵ ثانیه. مستر روی -۱۴ LUFS، اوج واقعی -۱ dBTP، بدون محو شدن صدا به جز ۶۰ میلی‌ثانیه آخر.
۶. با Playwright رندر بگیرید (برای هر فریم یک اسکرین‌شات، فونت‌ها اول بارگذاری شوند)، H.264 yuv420p را با نرخ ۶۰۰۰۰/۱۰۰۱ کدگذاری کنید، صدا را MUX کنید.

متن را فقط پس از بارگذاری فونت‌ها اندازه‌گیری کنید. یک نام محصول طولانی در جایی که یک نام ۵ حرفی جا می‌شد، قرار نمی‌گیرد: کل قفل (شکاف دیسک، نام، قرص) را طوری مقیاس‌بندی کنید که با فاصله x474-1063 مطابقت داشته باشد، اجازه ندهید قرص از قاب خارج شود. یک مربع دایره‌ای سفید بدون لبه ۱ پیکسلی و سایه کم‌رنگ روی صفحه سفید ناپدید می‌شود. تصاویر را با متن مخصوص به خود داخل کارت‌های S6 قرار ندهید، در غیر این صورت عنوان شیشه‌ای دو برابر می‌شود. قاب‌های برش داده شده را حتی در جایی که روی یک ضرب قرار نمی‌گیرند، دقیق نگه دارید. هیچ چیز به جز S7 f269-287 ثابت نمی‌شود. جداول تاری شدید می‌توانند یک شکل را کاملاً پاک کنند: اگر یک قاب خالی به نظر می‌رسد، تاری را تا زمانی که شکل هنوز خوانا باشد، کاهش دهید.

از من ورودی‌ها را بپرس. سپس قبل از اینکه فیلم کامل را رندر کنی، ۴ عکس ثابت (f40 سربرگ در پنجره، f86 آیکون ضربدر، f150 اعلان پایان، f230 دو کارت) را به من نشان بده.

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.

دستور العمل گرفته شده از پست @notdwd.