فريم بائي فريم لانچ وڊيو
ترت
مون کان پڇو: منهنجو پراڊڪٽ جو نالو، هڪ لوگو (يا توهان کي هڪ سادو نشان ڪڍڻ ڏيو)، هڪ لائن واري شيءِ جيڪا هڪ صارف پرامپٽ باڪس ۾ ٽائيپ ڪري ٿو، اهو صفحو جيڪو ان جو جواب ڏئي ٿو (عنوان + 2-3 جملا هڪ اهم جملي سان)، اسٽيڪ ٿيل ڪارڊن لاءِ ٻه فيچر نالا، ۽ هڪ ميوزڪ ٽريڪ. جيڪڏهن مان ڪنهن کي به ڇڏي ڏيان ٿو، ته ڊفالٽ استعمال ڪريو: پراڊڪٽ "فريم بائي فريم" ان جي هوپ هب اندر رهي ٿو، هڪ ويو فائنڊر نشان (هڪ بولڊ "FF" جي چوڌاري چار ڪنڊ بریکٹ)، پرامپٽ "منهنجي ايپ لاءِ لانچ وڊيو ٺاهيو"، هڪ سبق صفحو جنهن جو عنوان آهي "2.1 هڪ حوالو چونڊيو"، ڪارڊ "لانچ" ۽ "آواز"، ۽ ميڪس ڪٽ جو مفت هائوس ٽريڪ "رائزنگ فاريسٽ" 124 BPM تائين سست ٿي ويو.
12 سيڪنڊ چورس پراڊڪٽ اسٽنگ، 1080x1080، فريم نمبر 29.97 fps (f0–f359) تي، ماسٽر 59.94 fps تي پيش ڪيا ويا. ايپل-ڪي نوٽ احساس: نرم، اڇو، روشن نيرو، شيشي وارو. ڪئميرا ڪڏهن به هڪ اسٽل فريم تي نه ڪٽيندو آهي: هر شاٽ اڳ ۾ ئي حرڪت ۾ داخل ٿئي ٿو (ايڪسپونيشل ايز آئوٽ، هر فريم جي باقي فاصلي جو 12–19٪) ۽ هڪ تيز رفتار حرڪت يا بلور ريمپ تي ڇڏي ٿو. بلور هر حرڪت تي رفتار ۽ هدايت جي پيروي ڪري ٿو.
پيليٽ: صفحو #FDFDFB، ڌوڙ #B7CFEB، برف #E6F0FA، ڳوڙهو نيرو #294376 → #769CC2 آسماني گريڊينٽ، نيوي #1E2F52، ايڪسينٽ بلوز #2F6BFF / #3CC8F0 / منٽ #4ED6A0، اڇو. قسم: Inter (400/500/600/700). ڪٿي به جامني، واڱڻائي، ميجنٽا يا نارنگي نه آهي.
ڪهاڻي: پراڊڪٽ هيڊر هڪ هلڪي ايپ ونڊو اندر نيري ڌوڙ مان نڪرندو آهي → هڪ ڪرسر اندر گلائڊ ٿئي ٿو، ان طرف رخ ڪري ٿو جتي اهو وڃي رهيو آهي، هوور تي وڌي ٿو ۽ لوگو تي ڪلڪ ڪري ٿو → ميوزڪ ڊراپ تي هارڊ ڪٽ ايپ آئڪن ڏانهن چار چورس سان هڪ ڪراس ۾ گردش ڪري ٿو → آئڪن ميڪ مينيو بار ۾ ڪري ٿو → ڪرسر مينيو بار آئڪن تي ڪلڪ ڪري ٿو، هڪ فراسٽڊ شيشي جي پرامپٽ باڪس ٻاهر نڪرندو آهي ۽ پرامپٽ ٽائپس → هلڪي نيري فليش ذريعي مٿي ڇڪي جوابي صفحي ۾ جاءِ تي اسڪرول ڪندي → هڪ ڪارڊ ان جي مٿان اڀري ٿو → بلور-ڊزل ٻن اسٽيڪ ڪارڊن ڏانهن جن ۾ وڏي فراسٽڊ-گلاس ٽائيٽل آهن → بلور-ڊزل لون لوگو ڊسڪ ڏانهن → هڪ چمڪندڙ لفظ نشان سان هڪ ڪاري اينڊ ڪارڊ ڏانهن هارڊ ڪٽ.
منع ٿيل: ڪراس فيڊ، منجمد فريم (S7 ۾ هڪ هولڊ کانسواءِ)، اسٽاڪ UI ڪِٽس، UI ٽيڪسٽ تي چمڪ، Math.random، ڪا به شيءِ جيڪا ٽيمپليٽ وانگر نظر اچي ٿي.
ڪوآرڊينيٽس 1080 اسٽيج تي px آهن. ميوزڪ بيٽ k = 0.048 + 0.4838·ks (124 BPM ، هڪ بيٽ = 14.5 فريم). ٽي هارڊ ڪٽ f72، f101، f159 هڪ بيٽ کان اڳ 2 فريم لينڊ ڪن ٿا: اهي صحيح فريم رکو.
S1 f0–71، هيڊر + ونڊو + ڪلڪ: ڌوڙ #B7CFEB f28 ذريعي #FDFDFB ڏانهن ڌوڙ ٿي رهيو آهي، هيٺان نيرو فرش چمڪ #DBEEFD رکو. هڪ لائن تي هيڊر: لوگو ڊسڪ ⌀132 (#FBFCFE، 1px رِم #E8E8EA، ڳاڙهو نشان)، پراڊڪٽ جو نالو (Inter 500)، هڪ ڳاڙهو ڪيپسول پِل "آن هوپ" (#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)، ساڄي ۽ هيٺان کان هلندو آهي. اندر: مٿين بينڊ ۾ هڪ سرچ پِل، هڪ کاٻي آئڪن ڪالم (ڪورسز آئڪن (537,739) تي، فيڊڊ چيٽ آئڪن (537,900) تي)، ۽ (764,700) آف فريم مان هڪ ڪورس ڪارڊ ان جي ڪور تصوير، عنوان ۽ "ڪورس · 8 سبق" سان. Cursor (ڪارو macOS تير، اڇو آئوٽ لائن، 32x39) f27 تي (891,393) نظر اچي ٿو، کاٻي پاسي گلائڊ ڪري ٿو (770,383) f44 ڏانهن سست ٿئي ٿو، هيٺ-کاٻي f47–51 ڏانهن اشارو ڪرڻ لاءِ گھمندو آهي جيئن اهو غوطا کائيندو آهي، ڊسڪ جي هيٺين ساڄي پاسي (629,564) f56 → (587,546) f59 → (555,531) f71 تي لهي ٿو؛ f56 کان هور ڪرڻ تي ×1.55 وڌندو آهي؛ هڪ نرم برف جو دائرو (#D5F3FF → #F7FEFF، ٻاهرين ⌀174) f53 کان ڊسڪ جي چوڌاري روشن ٿئي ٿو. ڪئميرا زوم ڪري ٿو تقريباً (540,540): 1.0 f46 → 1.2 f60 آساني سان اندر اچي ٿو، f61 کي رکي ٿو، پوءِ آساني سان ٻاهر نڪري ٿو f71 تي 1.04 تائين تيز ٿئي ٿو جڏهن ته ڪرسر دٻايو وڃي ٿو (f69–71 15% گهٽجي ٿو).
S2 f72–100، آئڪن + مدار: نيوي اسڪوائرل ايپ آئڪن (#294376 → #1E2F52، اڇو نشان)، f72 تي 276 px f86 ذريعي 178 px تائين ايزي آئوٽ سُڪڙجي رهيو آهي، ويڪر جو 28٪ ريڊيس، هڪ گرين هالو ڊسڪ #E9E9E7 تي ⌀240 (f75) → 326 (f86) وڌي رهيو آهي. چار 92 px چورس (ريڊيس 26) گھڙيال جي مخالف طرف گھمندا آهن، سست ٿيندا آهن، ۽ مدار جي ريڊيس ≈216 by f86 تي هڪ ڪراس ۾ بند ٿيندا آهن: اڇو (1px #E3E8EF ڪنارو + هلڪو پاڇو) کاٻي پاسي، #2F6BFF مٿي، #3CC8F0 ساڄي پاسي، #4ED6A0 هيٺان. f88–100: آئڪن ≈40 px تائين تيزيءَ سان سُڪڙجي ٿو، چورس ان جي ساڄي پاسي هڪ قطار ۾ سلائڊ ٿين ٿا (آئڪن جي پويان اڇو سلپ ٿئي ٿو)، بلر ريمپ 0.3 → 6 px.
S3 f101–158، مينيو بار + پرامپٽ: هڪ ڪاري ليپ ٽاپ بيزل بينڊ جي مٿان اڇو صفحو (y425–475، مٿيون نمايان #686866)، هڪ ڳاڙهو نيوي مينيو بار (y477–538)، هيٺ ڏنل وال پيپر = پتلي اڇي لڪير واري آرٽ سان نيرو آسمان گريڊينٽ (هڪ وڏو دائرو، ٻه افقي لائينون، هڪ عمودي، ڪراسنگ تي چار پوائنٽن وارو چمڪ، مٿي ساڄي پاسي نرم ٽيل چمڪ). مينيو بار ساڄي ڪلسٽر اڇي ۾: وائي فائي، بيٽري، ٽوگلز، پراڊڪٽ جو نشان x531–584 تي، ٽي ⌀36 نقطا #2F6BFF / #3CC8F0 / #4ED6A0 x612 تي، 661، 709، "سومر جون 22 9:41 AM" 34 px. ڌُنڌلي 3 px ۾ داخل ٿئي ٿو ۽ f110 سان آباد ٿئي ٿو. Cursor هيٺان کان اڀري ٿو (f102)، نشان تي ويھي ٿو، f113–117 کي دٻائي ٿو. ڪئميرا مواد کي ساڄي پاسي +125 px f115–130 (تيز ترين f118–120) پين ڪري ٿو. هڪ ٿلهو شيشي جو دٻو (آسمان تي اڇو-نيرو شيشو، روشن مٿيون ڪنڊ، ريڊيس 60) نشان f116 جي هيٺان کان نڪرندو آهي: ويڪر f126 تي 744 چوٽي تي پهچي ٿي ۽ x196–922، y568–797 جي چوڌاري f138 ذريعي 726x228 تي آباد ٿئي ٿي. پرامپٽ f121 (پهرين پڙهڻ لائق "ٺاهيو") کان f150 (مڪمل) تائين لڳ ڀڳ 1 ڪردار/فريم تي ٽائپ ڪري ٿو جنهن ۾ هر 2–3 ڪردارن تي 1 فريم هولڊ هوندو آهي؛ ڪيريٽ هميشه آن؛ هيٺان ٽي اڇا آئوٽ لائن آئڪن؛ بٽڻ موڪليو #2F6BFF ⌀51 هڪ اڇي مٿي تير سان. f136 کان سڄو منظر مٿي چڙهي ٿو، هڪ وِپ-ٽِلٽ ۾ تيز ٿئي ٿو (f158 ≈25 px/فريم حرڪت ڪري ٿو، عمودي بلور ≈6–8 px) جڏهن ته صفحو f154–158 تي #E6F4FE رنگ ڪري ٿو.
S4 f159–186، جوابي صفحو: هڪ هلڪو ڪورس سبق صفحو (بريڊ ڪرمب، عنوان، باڊي): ٽيڪسٽ ڪالم x120، باڊي 47 px Inter 400 گرين #BCBCBA، لائن پچ 58، هڪ اهم جملو ("فريم لاءِ فريم") ڪارو 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 f165 ذريعي #FDFDFB ڏانهن ختم ٿي رهيو آهي. هڪ ڪرسر سڌو مٿي اشارو ڪندي اسڪرول تي سوار ٿئي ٿو ۽ اهم جملي (≈(450,591) f180) جي هيٺان بيهي ٿو، پوءِ ساڄي طرف هليو وڃي ٿو.
S5 f187–214، ڪارڊ: هڪ اڇو ڪارڊ (x203–878، هيٺان کان هلندو آهي) صفحي جي مٿان اڀري ٿو: ڪور تصوير 627x536 انسيٽ 24 px، ريڊيس 64، ان جي مٿئين مرڪز تي هڪ هلڪو گريبر بار، ڪيپشن سيمي بولڊ 38 px ڪارو، سب ڪيپشن گرين 23 px. ڪور ٽاپ y642 (f187) → 456 (f191) → 395 (f196) → 369 (f200) → 348 (f205)، پوءِ ~4 px/فريم مٿي وهندو رهي ٿو. ڪارڊ بلور f189 تي 3.8 px جي چوٽي تي پهچي ٿو، f201 کان تيز؛ پويان صفحو ≈2.5 px تائين بلور ٿي وڃي ٿو. f207–214 مان نڪرو: ڪارڊ ~5٪ گهٽجي ٿو ۽ مٿي اڀري ٿو جڏهن ته سڄو فريم بلور ٿي وڃي ٿو 1 → 7 px؛ ڌنڌلي چوٽي تي ڪٽ.
S6 f215–244، ٻه ڪارڊ: اڇو صفحو، ٻه اسٽيڪ ٿيل ڪارڊ 538x348 (ريڊيس 57، گيپ 36) x540 تي مرڪز ۾، مٿيون ڪارڊ y168 تي f230 ذريعي سيٽنگ ڪري رهيو آهي، هيٺان y552 تي. هر هڪ: ڪور آرٽ (ان ۾ ڪو به متن پڪل ناهي)، هڪ ٿلهو ٿيل پِل مٿي کاٻي پاسي ("ماڊيول 3" / "ماڊيول 5")، هڪ ٿلهو ٿيل گول "•••" مٿي ساڄي پاسي، ۽ ٿلهو ٿيل شيشي مان ٺهيل هيٺئين ڪنڊ سان هڪ وڏو بولڊ عنوان (خطن تي ڪلپ ٿيل تصوير جي هڪ ڌُرلي، هلڪي ڪاپي، ڪارڊ جي هيٺئين ڪنڊ سان ڪٽيل): "لانچ" ۽ "آواز". ٻئي ڌُرلي 12 px ۾ داخل ٿين ٿا ۽ f224 ذريعي تيز؛ مٿيون ڪارڊ 8٪ وڏو داخل ٿئي ٿو ۽ y264 کان مٿي اڀري ٿو؛ هيٺيون ڪارڊ y927 کان مٿي اڀري ٿو، ان جي پويان بيٺو آهي. اهي 3 px/فريم f230–238 مٿي ڇِڪي ويندا آهن، پوءِ تيز ٿي ويندا آهن ۽ ڪٽ ۾ ڌُنڌلي ٿي ويندا آهن.
S7 f245–300، لوگو ڊسڪ: صفحو #FDFDFB، ڊسڪ ⌀168 #F6F6F6 ڳاڙهي نشان سان، مرڪز ۾ مٿي ٿئي ٿو (مٿي y569 f245 → 491 f250 → 468 f255 → 456 f269) ڪٽيل فريم تي عمودي سمير سان، اڃا f269–287 (واحد منجمد اسٽريچ) رکي ٿو، پوءِ f300 تي ⌀123 تائين تيزيءَ سان سُڪڙجي ٿو.
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 تائين وڌي رهيو آهي. فلم وچ ۾ ٽٽڻ تي ختم ٿئي ٿي.
1. هڪ HTML صفحو، 1080x1080، فريم نمبر جي خالص فنڪشن جي طور تي seek(t) پاران ٺهيل. ڪابه CSS ٽرانزيڪشن، ڪابه ٽائمر، ڪابه Math.random (صرف ٻج ٿيل هيش) نه. شاٽ {f0، f1، render(localFrame)} جي طور تي رجسٽر ٿين ٿا.
2. فريم نمبر ۾ هر ويليو مسلسل آهي (59.94 ماسٽر اڌ فريم پيش ڪري ٿو): ڪي فريم ٽيبلن سان اينيميٽ ڪريو kf(فريم، [[f، ويليو]،...]، ايزي) ۽ في فريم لوڪ اپ ٽيبلن کي لڪير انٽرپوليشن سان. حرڪت تي ڪو به Math.floor ناهي.
3. بلر: گول بلر لاءِ CSS فلٽر بلر، هدايتي سميئرز لاءِ الڳ x/y stdDeviation سان SVG feGaussianBlur. آخر ڪارڊ تي زوم سمير = لفظ جون 20-30 اسڪيل ٿيل، ختم ٿيل ڪاپيون. ٿڌڙي شيشي = پويان ڇا آهي ان جي هڪ ڌُندلي، هلڪي ڪاپي، شڪل ۾ ڪلپ ڪئي وئي.
4. Cursor: هڪ SVG macOS تير (ڪارو فل، اڇو آئوٽ لائن، نرم پاڇو) گردش ۽ اسڪيل سان، S1، S3، S4 ۾ ٻيهر استعمال ڪيو ويو.
5. آواز (ڪو به آواز ناهي)، بلڪل 12.075 سيڪنڊ: موسيقي 124 BPM تي، نرم تعارف، ڊراپ 2.47 سيڪنڊن تي (بيٽ 5، f72 ڪٽ ان کي 2 فريم کان اڳتي وٺي ٿو). سنٿيسائزڊ SFX: نرم اثر 0.10 سيڪنڊ؛ هوش ڪٽ 2.402، 3.370، 5.305، 10.043 سيڪنڊن تي چوٽي تي پهچي ٿو؛ منتقلي بلڪل 6.240 سيڪنڊن ۽ 8.175 سيڪنڊن تي هٽ ٿئي ٿي؛ 2.33 ۽ 3.83 سيڪنڊن تي ڪلڪون؛ تمام خاموش ڪي ٽِڪس هر ~32 ms تي 4.04–5.00 سيڪنڊن تي؛ 10.05 سيڪنڊن تي هڪ نرم چمڪ. ماسٽر کان −14 LUFS، سچي چوٽي -1 dBTP، آخري 60 ms کان سواءِ ڪو به فيڊ ناهي.
6. Playwright سان رينڈر ڪريو (في فريم هڪ اسڪرين شاٽ، پهريان فونٽ لوڊ ڪيا ويا)، H.264 yuv420p کي 60000/1001 تي انڪوڊ ڪريو، آڊيو کي ملائي ڇڏيو.
فونٽ لوڊ ٿيڻ کان پوءِ ئي ٽيڪسٽ جي ماپ ڪريو. هڪ ڊگهو پراڊڪٽ نالو 5 اکرن واري نالي جي جاءِ تي نه فٽ ٿيندو: پوري لاڪ اپ (ڊسڪ گيپ، نالو، پِل) کي اسپين x474–1063 ۾ فٽ ڪرڻ لاءِ اسڪيل ڪريو، پِل کي فريم کان ٻاهر نه ڪرڻ ڏيو. هڪ اڇو مدار چورس سفيد صفحي تي 1px ڪنڊ ۽ هڪ هلڪي پاڇي کان سواءِ غائب ٿي ويندو آهي. S6 ڪارڊن اندر انهن جي پنهنجي متن سان تصويرون نه لڳايو، يا شيشي جو عنوان ٻيڻو ٿي ويندو آهي. ڪٽيل فريم کي صحيح رکو جيتوڻيڪ اهي هڪ بيٽ تي نه ويهن. S7 f269–287 کان سواءِ ڪجهه به منجمد نه ٿيندو آهي. ڳري بلور ٽيبل هڪ شڪل کي مڪمل طور تي صاف ڪري سگهن ٿا: جيڪڏهن هڪ فريم خالي نظر اچي ٿو، بلور کي گهٽ ڪريو جيستائين شڪل اڃا تائين نه پڙهي.
مون کان ان پٽ لاءِ پڇو. پوءِ مڪمل فلم پيش ڪرڻ کان اڳ مون کي 4 اسٽلز (ونڊو ۾ 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.
- ماڊل
- Opus 5.5
- شايع ٿيل
اهڙي وڊيو ٺاهيو
اسان جي گوگل Chrome ايڪسٽينشن سان اهڙيون وڊيوز پاڻ ٺاهيو - API کان 7 ڀيرا سستا.. Claude سان MCP ذريعي ڪم ڪري ٿو: توهان ڪم کي بيان ڪريو ٿا، ۽ ايڪسٽينشن پرامپٽ کان مڪمل فائل تائين جنريشن جي عمل کي سنڀاليندو آهي. اهو وڊيوز ٺاهي ٿو، انهن کي گڏ ڪري ٿو، انهن کي آواز ڏئي ٿو، ۽ انهن جو ترجمو ڪري ٿو.
Automation — MCP для Google Flow, Google Vids и Claude
TikTok Symphony Creative Studio MCP Claude Code
SeedFlow — Seedance 2.5 в Dreamina, Qwen-Audio-3.1-TTS и Claude MCP