فيديو ترويجي لـ prompts.chat باستخدام Remotion

أنشئ فيديو ترويجيًا مدته 30 ثانية لموقع prompts.chat

الأصول المطلوبة

- https://prompts.chat/logo.svg - شعار SVG
- https://raw.githubusercontent.com/flekschas/simple-world-map/refs/heads/master/world-map.svg - خريطة العالم SVG لمشهد المجتمع العالمي

سمة الألوان (فاتح)

- الخلفية: #ffffff
- الخلفية البديلة: #f8fafc
- الأساسي: #6366f1 (نيلي)
- الأساسي الفاتح: #818cf8
- التمييز: #22c55e (أخضر)
- النص: #0f172a
- النص الخافت: #64748b

الخط

- Inter (الأوزان: 400، 600، 700، 800)

---
هيكل المشهد (8 مشاهد)

المشهد 1: الافتتاح (5 ثوانٍ)

- يظهر الشعار
- الشعار في المنتصف، يتدرج في الحجم مع حركة زنبركية
- بعد الحركة: يظهر نص "prompts.chat" من اليسار إلى اليمين أسفل الشعار باستخدام clip-path
- يظهر الشعار: "المنصة الاجتماعية المجانية لموجهات AI"

المشهد 2: المجتمع العالمي (4 ثوانٍ)

- خريطة عالمية بملء الشاشة (شفافية 25%) كخلفية
- 16 نقطة نشاط نابضة في المدن الكبرى (لوس أنجلوس، نيويورك، تورونتو، ساو باولو، لندن، باريس، برلين، لاغوس، موسكو، دبي، مومباي، بكين، طوكيو، سنغافورة، سيدني، وارسو)
- كل نقطة لها حلقة نبض خارجية، ونبض داخلي، ونقطة مركزية مع توهج
- العنوان: "مجتمع عالمي من منشئي الموجهات"
- صف الإحصائيات: 8 آلاف+ مستخدم، 3 آلاف+ زائر يومي، 1 آلاف+ موجه، 300+ مساهم، 10+ لغات
- تراكب متدرج في الأسفل لسهولة قراءة النص

المشهد 3: الحل (2.5 ثانية)

- تظهر ثلاث كلمات بالتتابع مع حركة زنبركية: "اكتشف." "شارك." "اجمع."
- كل كلمة بلون مختلف (أساسي، تمييز، أساسي فاتح)

المشهد 4: مصمم للجميع (4 ثوانٍ)

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

المشهد 5: أنواع الموجهات (5 ثوانٍ)

- العنوان: "موجهات لكل حاجة"
- إطار يشبه المتصفح (1400x800) مع أضواء مرور macOS وشريط URL يعرض "prompts.chat"
- لقطة شاشة هيكلية متدرجة (masonry skeleton) تمرر عموديًا بحركة سلسة (cubic ease-in-out)
- 7 تسميات عائمة على شكل حبوب حول الحواف مع أيقونات:
  - نص (أرجواني)، صورة (وردي)، فيديو (كهرماني)، صوت (أخضر)، سير عمل (بنفسجي)، مهارات (أزرق مخضر)، JSON (أحمر)

المشهد 6: الميزات (4 ثوانٍ)

- 4 بطاقات ميزات تظهر بالتتابع مع حركة زنبركية:
  - مكتبة الموجهات (أيقونة كتاب) - "آلاف الموجهات عبر جميع الفئات"
  - المهارات وسير العمل (أيقونة صاعقة) - "أتمتة مهام AI متعددة الخطوات"
  - المجتمع (أيقونة مستخدمين) - "شارك واكتشف من المبدعين"
  - مفتوح المصدر (أيقونة دائرة زائد) - "استضف ذاتيًا بخصوصية كاملة"

المشهد 7: الإثبات الاجتماعي (4 ثوانٍ)

- عداد نجوم GitHub متحرك (0 ← 143,000+)
- أيقونة نجمة بجانب العدد
- شارة: "أول مكتبة موجهات — منذ ديسمبر 2022" مع أيقونة كأس
- النص: "معتمد من قبل المؤسسين المشاركين لـ OpenAI • يستخدمه هارفارد، كولومبيا والمزيد"

المشهد 8: دعوة لاتخاذ إجراء (3.5 ثوانٍ)

- حركة توهج خلفية (تدرج شعاعي نابض)
- العنوان: "ابدأ الاستكشاف اليوم"
- زر كبير مع الشعار + نص "prompts.chat" (خلفية متدرجة، نبض خفيف)
- العنوان الفرعي: "مجاني ومفتوح المصدر"

---
الانتقالات (0.4 ثانية لكل منها)

- المشهد 1←2: تلاشي
- المشهد 2←3: انزلاق من اليمين
- المشهد 3←4: تلاشي
- المشهد 4←5: تلاشي
- المشهد 5←6: انزلاق من اليمين
- المشهد 6←7: انزلاق من الأسفل
- المشهد 7←8: تلاشي

تقنيات الرسوم المتحركة المستخدمة

- spring() لحركات التدرج النطاطة
- interpolate() للشفافية والموضع و clip-path
- Easing.inOut(Easing.cubic) للتمرير السلس
- Math.sin()/Math.cos() لحركات العائمة
- تأخيرات متقطعة لظهور العناصر بالتتابع

المكونات الرئيسية

- مكونات أيقونات SVG مخصصة لجميع الأيقونات (لا توجد رموز تعبيرية)
- مكون الشعار مع مسار "P" الخاص بـ prompts.chat
- مكون FeatureCard قابل لإعادة الاستخدام
- TransitionSeries لإدارة المشاهد