لم تعد صناعة فيديوهات الأنيميشن التوضيحية تحتاج بالضرورة إلى خبرة طويلة في برامج الموشن جرافيك أو التصميم. اليوم يمكن الاستفادة من أدوات الذكاء الاصطناعي لتحويل فكرة أو تعليق صوتي إلى مشاهد متحركة تساعد على شرح المعلومات بطريقة أكثر وضوحًا وجاذبية.
في الفيديو الجديد أشرح بالتفصيل كيف أصنع فيديوهات الأنيميشن التي أستخدمها داخل الشروحات، بداية من تجهيز المحتوى وحتى الوصول إلى النتيجة النهائية.
من التعليق الصوتي إلى مشاهد متحركة
تبدأ العملية بتجهيز التعليق الصوتي أو النص الذي تريد تحويله إلى فيديو. بعد ذلك يمكن استخراج الترانسكريبت مع التوقيتات الزمنية، وهي خطوة مهمة جدًا لأنها تساعد على معرفة اللحظة التي يجب أن يظهر فيها كل عنصر داخل المشهد.
بعد تقسيم النص إلى أجزاء، يمكن استخدام الذكاء الاصطناعي لإنشاء وصف دقيق لكل مشهد، مثل ظهور شخصية، تحرك سهم، ظهور رسم بياني، انتقال بين فكرتين، أو عرض نص وأيقونات متزامنة مع الكلام.
الذكاء الاصطناعي يكتب الأنيميشن أيضًا
الأمر المثير للاهتمام أن الأدوات الحديثة لا تساعد فقط في كتابة السيناريو، بل يمكنها كذلك إنشاء HTML وCSS وJavaScript وSVG لبناء أنيميشن كامل قابل للتشغيل داخل المتصفح.
وهذا يسمح بتعديل الألوان، النصوص، سرعة الحركة، ترتيب العناصر، وحتى توقيت ظهورها بدون الحاجة إلى إعادة تصميم الفيديو من البداية.
في الفيديو أستعرض طريقتين مختلفتين: طريقة أسرع تعتمد على أدوات مدفوعة، وطريقة أخرى يمكن تنفيذها مجانًا أو بتكلفة أقل باستخدام أدوات مثل ChatGPT وClaude وGoogle AI Studio.
هل تحتاج إلى خبرة في الأنيميشن؟
ليس بالضرورة.
الأهم هو أن تعرف كيف تصف النتيجة التي تريدها. كلما كان الـPrompt أكثر وضوحًا في تحديد شكل المشاهد، أسلوب الرسوم، الألوان، حركة العناصر والتوقيتات، أصبحت النتيجة أقرب إلى فيديو Motion Graphics احترافي.
وبالطبع قد تحتاج بعد التوليد الأول إلى بعض التعديلات لتحسين المشاهد أو تغيير سرعة الحركة، لكن العملية أصبحت أسهل بكثير من الطرق التقليدية.
🎬 إذا أردت مشاهدة الطريقة كاملة عمليًا خطوة بخطوة، شاهد الفيديو المرفق الذي أشرح فيه كيف أحوّل المحتوى إلى فيديو أنيميشن، وما الأدوات والأوامر التي أستخدمها للوصول إلى النتيجة النهائية.
الأمر المستخدم في الفيديو:
تصرّف كمخرج Motion Graphics ومطوّر Creative Coding محترف. حوّل القصة العربية المرفقة «الوجه الآخر للذكاء الاصطناعي» إلى فيديو أنيميشن توضيحي كامل واجعل التسجيل الصوتي، مرجع التوقيت الأساسي واربط ظهور العناصر بلحظة ذكرها.
1. الهوية البصرية
اعتمد أسلوب:
Minimal Flat Vector Motion Graphics / Animated Infographic Explainer.
- خلفيات مسطحة تتناوب بين الأصفر الدافئ والأزرق السماوي.
- لوحة ألوان مقترحة قريبة من المرجع:
- أصفر: #F4D45C
- أزرق: #75B6D5
- أبيض: #FFFFFF
- أسود داكن: #182126
- أحمر محدود للتحذيرات: #D95757
- رسومات SVG هندسية بسيطة، بخطوط متناسقة السماكة وتفاصيل قليلة وواضحة.
- استخدم الدوائر والمستطيلات والخطوط لبناء الشخصيات والمكاتب والشاشات والكتب والرموز.
- تكوين بصري نظيف، مع فراغات واسعة وعنصر رئيسي واضح في كل لحظة.
- حافظ على نفس تصميم الشخصية الرئيسية ورمز الذكاء الاصطناعي طوال القصة.
- تجنّب الصور الواقعية و3D والتدرجات المعقدة والـGlow والخلفيات التقنية الداكنة والإيموجي.
- لا تنقل واجهة يوتيوب أو المتصفح الظاهرة في تسجيل المرجع إلى التصميم.
2. لغة الحركة
اجعل الحركة قريبة من أعمال الموشن جرافيك المصممة يدويًا:
- Staggered Entrances: ظهور أجزاء الرسم بالتتابع بفواصل تقريبية 80–160ms.
- Line Reveal: رسم الخطوط باستخدام stroke-dasharray وstroke-dashoffset.
- Scale-in: نمو العناصر من نقطة الارتكاز مع Overshoot خفيف.
- Slide-in: انزلاق قصير وناعم، ثم استقرار.
- Ease-in-out لمعظم الحركات، وElastic/Bounce محدود للتأكيد فقط.
- مدة دخول العنصر غالبًا 400–800ms، مع منح المشاهد وقتًا لفهمه.
- حرّك الأجزاء التي تشرح الفكرة: عقارب الساعة، الأوراق، مسارات البيانات، ومؤشر الكتابة.
- خفّف الحركة عند الأسئلة التأملية والمقاطع الجادة.
- استخدم انتقالات تربط المشاهد: دائرة الساعة تتحول إلى لمبة، ورقة تتمدد لتصبح شاشة، وخط بيانات يتحول إلى طريق.
- عند صعوبة تحويل مسارين SVG، استخدم أشكالًا وسيطة أو انتقالًا متطابق الموضع يحافظ على الاستمرارية.
- تجنّب الوميض والحركة العشوائية والزوم المستمر.
3. معالجة القصة بصريًا
حافظ على السرد الأصلي وترتيب الأفكار. كل فقرة يجب أن يقابلها فعل بصري مفهوم؛ لا تختزل القصة في عناوين أو شرائح نصية.
نفّذ التسلسل مع تقسيم المقاطع الطويلة إلى لقطات فرعية
4. النص العربي
- استخدم على الشاشة كلمات مفتاحية وجملًا قصيرة فقط، غالبًا من كلمتين إلى خمس كلمات.
- اجعل عرض الترجمة الكاملة اختياريًا ومعطلًا افتراضيًا.
- ادعم RTL ووصل الحروف العربية، ولا تقسّم الكلمة العربية إلى حروف منفصلة لتحريكها.
- حرّك النص على مستوى الكلمة أو الجملة.
- استخدم خطًا عربيًا واضحًا مع خط بديل محلي؛ وإذا أمكن، ضمّن الخط داخل الملف للعمل دون إنترنت.
5. التوقيت والمزامنة
اجعله مرجع التوقيت الأساسي واربط ظهور العناصر بلحظة ذكرها.
- إذا لم يوجد تسجيل، أنشئ توقيتًا تقديريًا بناءً على قراءة عربية هادئة بنحو 125–145 كلمة في الدقيقة، مع وقفات إضافية للأسئلة والتحولات.
- لا تضغط القصة الطويلة داخل مدة قصيرة تفقد معها وضوحها.
- ميّز التوقيت التقديري عن المزامنة الفعلية.
- ضع بيانات المشاهد في مصفوفة واضحة تتضمن:
id، start، duration، narration، keywords، animation cues. - أضف إمكانية تحميل تسجيل صوتي محلي ومراجعة توقيت المشاهد. تحميل الصوت وحده لا يعني تحقق المزامنة تلقائيًا.
7. أدوات العرض
أضف لوحة تحكم منفصلة عن مساحة الأنيميشن تشمل:
- تشغيل وإيقاف.
- إعادة من البداية.
- شريط تقدم مع علامات بداية المشاهد.
- الزمن الحالي والمدة الكلية.
- التحكم في سرعة التشغيل.
- ملء الشاشة.
- تحميل ملف صوتي محلي.
- إظهار الترجمة وإخفاؤها.
- زر إخفاء لوحة التحكم، واختصار H لإظهارها مجددًا.
أضف وضع عرض نظيفًا مناسبًا لتسجيل الشاشة، دون أزرار أو عناصر واجهة داخل الكادر.
تحقق من:
- ظهور العربية بشكل صحيح.
- عدم تداخل النصوص والرسومات.
- ارتباط كل مشهد بالفقرة التي يشرحها.
- صحة التشغيل والإيقاف والقفز والعودة.
- عدم تراكم العناصر من المشاهد السابقة.
- اكتمال القصة حتى مشهد النهاية.
الهدف: فيلم موشن جرافيك قصصي واضح ومترابط، بنفس بساطة المرجع وألوانه المسطحة ورسوماته الهندسية وحركته المتدرجة.
وإليك النص كاملاً وقم بكتابة النص هنا {} او يمكن الاكتفاء بالTime Stamps
