9 ستايلات أنيميشن جديدة بـ Claude، وبرومت كل ستايل جاهز للنسخ

سو لي أنيميشن بستايل رسم الحبر، كأنها قصة ستيكمان مرسومة باليد.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1.5 ث: ديوانية كويتية. ثلاث شخصيات ستيكمان بدشاديش بيض وغتر بيض، قاعدين على مساند أرضية، وبينهم دلة قهوة وفناجين. فوقهم لوحة خشب مكتوب عليها «الديوانية قبل الجوالات».
- من 1.5 إلى 3 ث: يسولفون ويضحكون، وتطلع فوقهم فقاعات كلام فيها «هههه»، وواحد منهم يصب قهوة لربعه.
- من 3 إلى 4.5 ث: اللوحة تنقلب ويصير مكتوب عليها «الديوانية اليوم». كل واحد ماسك جوال وراسه منزّل، ووجوههم منوّرة بضو أزرق، وفوقهم فقاعة فيها «...» بس.
- من 4.5 إلى 6 ث: الدلة بروحها تتنهد، ويطلع منها بخار على شكل علامة استفهام.

الستايل:
- خطوط حبر سودا سميكة بيد مهزوزة شوي، والخطوط ترتجف بخفة 8 مرات بالثانية مثل الأنيميشن المرسوم باليد.
- ألوان مسطحة فاتحة داخل الخطوط: جدار بيج، سجادة حمراء بنقش بسيط، وغتر ودشاديش بيض.
- الوجوه دوائر بعيون نقط وتعابير مبالغ فيها، والحركة نطّات بسيطة مو ناعمة زيادة.
- بالخلفية شباك ومكيف شباك قديم، والتفاصيل قليلة عشان يبقى الرسم نظيف.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.

سو لي أنيميشن بستايل ظل النيون، مشهد مزاجي وقت الغروب.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 2 ث: غرفة مظلمة، وطالب قاعد على مكتب، شكله ظل أسود كامل بعيون بيض مضيئة. ورا الشباك سماء غروب بنفسجي وبرتقالي، وخط مدينة الكويت: أبراج الكويت وبرج التحرير وبرج الحمراء. لمبة مكتب معلّقة ترمي مخروط ضو أصفر. على المكتب ساعة قلّابة تقول 11:59، ولابتوب فيه شريط رفع ملف.
- من 2 إلى 4 ث: الشريط يتقدم ببطء لين يعلق على 99%، والطالب يقرّب من الشاشة وعيونه تكبر.
- من 4 إلى 4.5 ث: الشريط يكمل ويطلع «تم التسليم» بعلامة صح خضرا، وبعدها مباشرة الساعة تقلب على 12:00.
- من 4.5 إلى 6 ث: الطالب يطيح على الكرسي مرتاح.
- فوق بالشاشة عنوان بحروف رفيعة متباعدة: «آخر دقيقة».

الستايل:
- ظل أسود صافي للشخص والأثاث، والإضاءة من مصدرين: الغروب من الشباك وضو اللمبة، مع وهج ناعم حولهم.
- الألوان: بنفسجي غامق وكحلي، وغروب برتقالي ووردي، وضو اللمبة كهرماني، ونجوم خفيفة فوق المدينة.
- الساعة القلّابة تقلب بطاقتها نصّين كأنها ساعة حقيقية.
- غبار خفيف يطفو بمخروط الضو، وضو اللابتوب الأزرق على وجه الظل.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.

سو لي أنيميشن بستايل المخطط الأزرق الهندسي ثلاثي الأبعاد، كأنه شرح من مهندس.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1.5 ث: مكيف سبليت: الوحدة الخارجية (صندوق فيه مروحة كبيرة) والوحدة الداخلية على جدار، وبينهم أنبوبين. يدخلون الكادر وهم يدورون بهدوء، وفوق عنوان: «شلون يشتغل المكيف».
- من 1.5 إلى 3 ث: غطاء الوحدة الخارجية يصير شفاف، ويبان الكمبروسر (أسطوانة) وملف المكثف (أنابيب متعرجة)، والمروحة تدور.
- من 3 إلى 5 ث: خطوط ضو تمشي داخل الأنابيب بالدورة: من الكمبروسر حمرا حارة إلى المكثف، وتطلع منه أسهم حرارة لبرا. بعدها تصير زرقا باردة وتروح للوحدة الداخلية، ويطلع منها هوا بارد بخطوط زرقا متموجة.
- من 5 إلى 6 ث: الكاميرا تثبت والملصقات كلها ظاهرة.
- الملصقات تطلع وحدة وحدة بخطوط إشارة رفيعة: «الكمبروسر»، «المكثف»، «المبخر»، «هوا بارد».

الستايل:
- خلفية زرقا ملكية بشبكة مخطط هندسي بيضا رفيعة، وخطوط أسمك كل خمس مربعات، وتغمق عند الأطراف.
- المجسمات بيضا ورمادية فاتحة بإضاءة ناعمة وظلال خفيفة، مثل موديل هندسي نظيف، وحوافها بخط أبيض.
- خطوط الحرارة برتقالي وأحمر مضيء، والبرودة سماوي، وتتحرك بحركة مستمرة.
- الملصقات بخط عربي أبيض واضح، وخط الإشارة يرسم نفسه قبل ما يطلع النص.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.
- Three.js عبر importmap من https://unpkg.com/three@0.160.0/build/three.module.js والإضافات من https://unpkg.com/three@0.160.0/examples/jsm/ ، والـrenderer بخيار preserveDrawingBuffer: true. كل المجسمات من الكود بدون موديلات جاهزة.

سو لي أنيميشن بستايل فضاء سينمائي، كأنه لقطة من فيلم.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 2 ث: ثقب أسود بالنص: دائرة سودا صافية حولها قرص مضيء ذهبي وبرتقالي يدور، والقرص ينحني فوق الثقب وتحته من الجاذبية، وخلفهم نجوم.
- من 2 إلى 4 ث: نجم أبيض مزرق يقرّب من الطرف، ويتمطط لخيط طويل من الضو يلف حول الثقب.
- من 4 إلى 5 ث: الخيط يدخل بالقرص، ويصير وميض قوي، والقرص يلمع أكثر.
- من 5 إلى 6 ث: يرجع الهدوء والقرص يدور.
- تحت بخط صغير: «ثقب أسود يبلع نجم».

الستايل:
- إضاءة سينمائية: وهج ناعم، وحبيبات فيلم خفيفة جداً، وأطراف غامقة.
- القرص ألوانه من الأبيض الحار بالداخل إلى البرتقالي والأحمر بالأطراف، وفيه خيوط وتفاصيل تدور بسرعات مختلفة.
- الكاميرا مايلة شوي، وتقرّب بهدوء طول المشهد.
- القرص وانحناء الضو بـshader داخل Three.js.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.
- Three.js عبر importmap من https://unpkg.com/three@0.160.0/build/three.module.js والإضافات من https://unpkg.com/three@0.160.0/examples/jsm/ ، والـrenderer بخيار preserveDrawingBuffer: true. كل المجسمات من الكود بدون موديلات جاهزة.

سو لي أنيميشن بستايل الكرتون الفلات حق الشركات، مثل فيديوهات الشرح التسويقية.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1 ث: موظف كويتي بدشداشة وغترة واقف جنب لوحة بيضا فيها رسم بياني عنوانه «رصيدك»، والخط فوق عالي. فوق الشاشة شريط مكتوب عليه «يوم الراتب»، والموظف مبتسم ونقود ورقية تطير حوله.
- من 1 إلى 3.5 ث: الشريط يتحول لعدّاد أيام (يوم 1، 2، 3 إلى 7)، ومع كل يوم تطلع أيقونة صرف: كوب قهوة، كيس توصيل، كيس تسوق، تذكرة سينما، والخط ينزل درجة مع كل وحدة.
- من 3.5 إلى 4.5 ث: الخط يطيح لتحت بسهم أحمر كبير، والشريط يقول «بعد أسبوع»، والموظف يحط يدينه على راسه وعيونه مفتوحة ونقط عرق.
- من 4.5 إلى 6 ث: يطلّع محفظته ويفتحها، وتطير منها فراشة صغيرة.

الستايل:
- ألوان فلات زاهية بدون تدرجات قوية: أزرق فاتح وأبيض، وأحمر للسهم، وأصفر للمحفظة، وظلال مسطحة بسيطة.
- مكتب وورا الشباك مدينة بأشكال مستطيلة فاتحة، ونبتة على الطاولة.
- الشخصية بنسب كرتونية: راس كبير وأطراف بسيطة، وحركات مرنة تنضغط وتتمدد.
- النصوص العربية بخط عريض واضح.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.

سو لي أنيميشن بستايل عالم مضيء ثلاثي الأبعاد، كأنه مشهد من لعبة جوال.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1.5 ث: منصة مضيئة بحلقة سماوية، وسط عالم بنفسجي بالليل، وحولها صخور صغيرة طايفة ونجوم. فوق المنصة محارة كبيرة مسكّرة، لونها وردي ولؤلؤي.
- من 1.5 إلى 3 ث: المحارة ترتجف، وضو أبيض ذهبي يطلع من الشق.
- من 3 إلى 4 ث: المحارة تنفتح، وينفجر ضو وجزيئات لامعة.
- من 4 إلى 6 ث: لؤلؤة بيضا مضيئة ترتفع وتلف بهدوء، وفوقها شارة صغيرة مكتوب عليها «لؤلؤة».

الستايل:
- منظور ايزومتري بزاوية من فوق، والكاميرا تلف بهدوء حول المنصة.
- الألوان: بنفسجي وأزرق غامق للخلفية، ووردي وذهبي للمحارة، وسماوي للحلقة، ووهج قوي حول اللؤلؤة.
- مواد ناعمة شبه كرتونية، ووهج حول كل مصدر ضو.
- جزيئات صغيرة تطفو طول الوقت.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.
- Three.js عبر importmap من https://unpkg.com/three@0.160.0/build/three.module.js والإضافات من https://unpkg.com/three@0.160.0/examples/jsm/ ، والـrenderer بخيار preserveDrawingBuffer: true. كل المجسمات من الكود بدون موديلات جاهزة.

سو لي أنيميشن بستايل زجاج ثلاثي الأبعاد مضيء، كأنه خريطة تقنية بالأشعة.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1.5 ث: مدينة صغيرة ايزومترية بالليل، مبانيها وشوارعها كلها زجاج أزرق شفاف بحواف مضيئة على خلفية سودا. على مبنى منها علامة «المطعم».
- من 1.5 إلى 4.5 ث: نقطة حمرا مضيئة (السايق) تطلع من المطعم وتمشي بالشوارع، وتخلّي وراها خط أحمر مضيء، وتلف عند زوايا الشوارع.
- من 4.5 إلى 5.5 ث: توصل لبيت بالطرف عليه علامة «بابك»، ويطلع منه نبض أحمر بدوائر.
- من 5.5 إلى 6 ث: المسار كله يلمع.
- ملصقات صغيرة رفيعة جنب المحطات: «المطعم 8:40» و«بابك 9:05»، وعنوان فوق: «طريق طلبك».

الستايل:
- المباني صناديق زجاج أزرق شفاف بحواف بيضا مضيئة، وتفاصيلها الداخلية مثل الرفوف والسيارات بخطوط رفيعة.
- الأحمر هو اللون القوي الوحيد بالمشهد، للسايق والمسار.
- الكاميرا ايزومترية، وتقرّب بهدوء وتتبع النقطة.
- خطوط إشارة رفيعة للملصقات، والأرقام بخط mono صغير.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.
- Three.js عبر importmap من https://unpkg.com/three@0.160.0/build/three.module.js والإضافات من https://unpkg.com/three@0.160.0/examples/jsm/ ، والـrenderer بخيار preserveDrawingBuffer: true. كل المجسمات من الكود بدون موديلات جاهزة.

سو لي أنيميشن بستايل دودل على ورق، كأنه رسم يوميات بالقلم.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1 ث: شخص راسه دائري بهودي أخضر، قاعد على مكتب وقدامه لابتوب، مبتسم ومتحمس. جنبه رزنامة أوراق مكتوب عليها «يوم 1»، وفوق عنوان بخط يد: «انت تتعلم برمجة».
- من 1 إلى 4 ث: أوراق الرزنامة تطير ورقة ورقة (2، 10، 30، 60)، وجنبه أكواب قهوة تتكدس فوق بعض لين تصير برج، ووجهه يتغير من متحمس إلى تعبان إلى مصدوم.
- من 4 إلى 5 ث: الرزنامة توقف على «يوم 100»، وعلى شاشة اللابتوب تطلع «Hello World» بعلامة صح.
- من 5 إلى 6 ث: يبتسم ابتسامة كبيرة مجنونة وعينه ترمش، وبرج الأكواب يتمايل.

الستايل:
- ورق بيج فيه ملمس وحبيبات، وخطوط قلم أسود مهزوزة شوي، وتلوين خفيف كأنه أقلام ملونة بألوان هادية: أخضر زيتي وبيج ورمادي.
- الحركة بإطارات قليلة، من 8 إلى 12 بالثانية، كأنها مرسومة إطار إطار.
- تعابير الوجه بسيطة وواضحة: عيون نقط وفم خط.
- الأرقام والعنوان بخط يد.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.

سو لي أنيميشن بستايل خريطة تضاريس داكنة تغرق بالأحمر، كأنها وثائقي تاريخي.

القصة، 6 ثوانٍ ثم تعيد من البداية، بلا قطع:
- من 0 إلى 1.5 ث: الكاميرا فوق خريطة تضاريس سودا ورمادية لشمال الخليج: ساحل الكويت وجون الكويت وجزيرة بوبيان، وجزيرة فيلكا عند مدخل الجون. وفوق الخريطة شبكة خطوط رفيعة.
- من 1.5 إلى 3 ث: خط أحمر مضيء ينرسم على حدود جزيرة فيلكا، ويطلع اسمها «فيلكا».
- من 3 إلى 4.5 ث: الجزيرة تغرق بالأحمر وترتفع شوي، ويطلع تحت الاسم «إيكاروس · 324 ق.م».
- من 4.5 إلى 6 ث: خط أحمر منحني ينرسم من الشمال، من جهة بلاد الرافدين، لين يوصل فيلكا، وتطلع عملة فضية إغريقية جنب الجزيرة.

الستايل:
- التضاريس مجسم ثلاثي الأبعاد من خريطة ارتفاعات مولّدة بالكود، بإضاءة جانبية تبيّن النتوءات، ومبالغة بالارتفاع عشان تبان.
- كل شي أسود ورمادي، والأحمر المضيء هو اللون الوحيد، وحوله وهج.
- الكاميرا مايلة، وتقرّب بهدوء نحو فيلكا.
- الأسماء بخط عربي عريض، ممدودة على الأرض.

التنفيذ:
- ملف HTML واحد يفتح بالمتصفح، وكل الرسم بالكود بدون صور خارجية.
- المقاس 1080×1920 طولي، ويصغر بـCSS ليناسب النافذة وهو في الوسط.
- كل إطار يُحسب من الوقت فقط: دالة window.seek(t) ترسم اللحظة t بالثواني فوراً. بدون Math.random (استخدم مولداً ببذرة ثابتة)، وبدون timers أو CSS transitions، ولا حالة تتراكم بين الإطارات.
- التشغيل: requestAnimationFrame ينادي seek بالوقت باقي القسمة على 6. وإذا كان في الرابط ?render لا يشتغل لحاله.
- أي نص عربي بخط من Google Fonts، انتظر تحميله بـdocument.fonts.ready قبل الرسم، واكتب الكلمة كاملة لتبقى حروفها متصلة.
- العناصر كبيرة وواضحة، لأن الفيديو يُشاهد على شاشة جوال.
- Three.js عبر importmap من https://unpkg.com/three@0.160.0/build/three.module.js والإضافات من https://unpkg.com/three@0.160.0/examples/jsm/ ، والـrenderer بخيار preserveDrawingBuffer: true. كل المجسمات من الكود بدون موديلات جاهزة.

عندي ملف HTML فيه أنيميشن ودالة window.seek(t). صدّره فيديو MP4 بدقة 1080×1920 و30 إطاراً في الثانية ومدته 6 ثوانٍ: افتح الملف بمتصفح بدون واجهة عبر Puppeteer وأضف ?render للرابط، وعلى كل إطار نادِ seek ثم خذ لقطة شاشة، واجمع اللقطات بـ FFmpeg.