الحركة البينية Tweened Animation في فلاش Flash

الحركة البينية Tweened Animation

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

ومعني ذلك بعبارة أبسط أننا بدلا من أن نصنع تلك التغييرات بأنفسنا ومدي ما في ذلك من صعوبة بالغة واستحالة في التصميمات والمشاريع الكبري , فإننا نجعل البرنامج يقوم بحساب التغييرات , ومن ثم عرضها حسب ما وضعناه .

هذا النوع ينقسم إلي نوعين :

1- Shape Tween التحول البيني للشكل .

2- Motion Tween التحول البيني للحركة .

وفي هذا الصدد فنحن معنيون بالنوع الأول للحركة , ألا وهو : Frame by Frame Animation وهو ما سوف نركز عليه .

الحركة بتغيير كل إطار علي حدة

ويتم ذلك بإحدي طريقتين :

الطريقة الأولي : بإستعمال blank keyframe اي إطار مفتاحي .

والطريقة الثانية : بإستعمال Keyframe أي : إطار مفتاحي فارغ .

أولا : طريقة Balnk Keyframe

1- قم بتحديد الإطارات العشرة الأولي , وذلك بالسحب بالفارة نحو الإطار رقم 10 , ثم انقر بالزر الأيمن للفارة واختر : Convert to Blank Keyframes .

2- قم برسم خط مائل صغير بأداة القلم الرصاص Pencil .

3- انتقل للإطار التالي بالنقر عليه , ماذا تلاحظ ؟ لقد اختفي الخط (وأعتقد أنك تعلم سبب ذلك , لقد انتقلنا إلي إطار مفتاح فارغ ), وخطوتنا الآن أن نفعل كما كان مصصممو أفلام الكارتون يفعلون في الماضي , أي أن نضع الكادر أو المشهد تلو الآخر , ومن ثم يقوم برنامج Flash بعرض الفيلم كاملا بعد تركيب مشاهده .

4- انقر بالفارة علي زر Onion Skin , كما في الشكل التالي :

يعرض برنامج Adobe Flash CS3 في الحالة الطبيعية محتويات منصة العمل المقابلة لإطار واحد في كل مرة , لكن إذا قمت بتفعيل سمة Onion Skin فيمكنك أن تري محتويات عدة إطارات في الوقت نفسه .

الآن لاحظ ماذا يظهر لك ؟ لقد ظهر الخط علي منطقة العمل Workspace مرة أخري ولكن بلون خافت , كما ظهر شيئ آخر في منطقة الإطارات , علامتان مثل القوسين يحددان الإطارات التي ستظهر بمظهر قشرة السمكة , كما في الشكل التالي :

وبالطبع يمكنك سحب هذه الأقواس ؛ لتغطي الإطارات التي تريدها , اسحب القوس الأيمن إلي الإطار رقم 10 .

5- أنت الآن في الإطار رقم 2 , قم برسم خط فوق الخط الأول تماما مع إضافة خطا آخر عموديا عليه (اضغط علي مفتاح Shift أثناء الرسم ) , ثم انتقل للإطار رقم 3 , وارسم الشكل السابق , ثم أضف خطا عمودا آخر وهكذا .

في النهاية ستجد أنك حصلت علي شكل نجمة متحركة , كما في الصورة التالية :

والآن جاءت الخطوة المنتظرة , ألا وهي خطوة اختبار عملك ومشاهدة نتائجه , وهي ما سنتحدث عنه في النقطة التالية :

كيفية اختبار العمل ؟؟

أولا : لإختبار العمل في داخل البرنامج انقر علي Enter , حيث تشاهد حركة Playhead علي الإطارات , وتشاهد حركة الكائن أو الكائنات داخل بيئة العمل .

ولمزيد من التحكم في العرض يمكنك استخدام Controller من القائمة Window > Toolbars > Controller , ما في الشكل التالي :

ومن الشكل السابق نجد مجموعة من الخيارات علي النحو التالي :

1- للتشغيل .

2- تقدم لأمام بمقدار إطار .

3- الذهاب لنهاية المشهد .

4- رجوع للخلف بمقدار إطار .

5- الذهاب لبداية المشهد .

6- إيقاف .

ثانيا : لإختبار العمل بمشغل برنامج Flash Adobe Flash CS3

Player اذهب للقائمة Control > Test Movie , أو قم بالضغط علي مفتاحي Ctrl+ Enter من لوحة المفاتيح , فتظهر شاشة لعرض المشهد الذي قمت بإنشائه .

والآن تعالوا بنا نتعلم مزيدا من الخطوات التي تجعل الأمر أكثر متعة وسهولة واحترافا , سنقوم بعمل الخطوات السابقة , ولكن بشكل أكثر سهولة وحرفية :

1- ارسم خطا كما في الخطوة السابقة رقم (1) .

2- الأداة التي معك الآن هي لقلم الرصاص Pencil , لا تتركها , فقط استمر في الضغط علي مفتاح Ctrl لإستحضار أداة التحديد Selection Tool ,بشكل مؤقت , وقم بتحديد الخط بعمل إطار حوله , ثم اضغط Ctrl+C لنسخ الشكل .

3- انقر علي الإطار 2 , ثم من القائمة Edit > Paste in Place أو اضغط مفاتيح الإختصار Ctrl + Shift+V .

سيتم لصق الشكل في الإطار 2 , والآن أضف خطا عموديا , ثم استحضر أداة التحديد Selection Tool , وقم بعمل إطار حول الشكل كله لتحديده , ثم Ctrl+C لنسخ الشكل , ثم انتقل للإطار 3 , وكرر ما سبق , وهكذا ..

ثانيا : طريقة Keyframe

1- قم برسم خط كما في خطوة 1 في الطريقة السابقة .

2- انقر علي الإطار التالي , ثم اضغط [6 ؛ لإنشاء Keyframe , ثم قم برسم خط آخر عمودي علي الخط الأول , ثم انتقل للإطار التالي , واضغط F6 , وارسم خطا آخر بشكل عمودي .. وهكذا حتي تحصل علي شكل النجمة .

وفي النهاية ستحصل علي نفس الحركة كما في الطريقة الأولي .

لعلك لاحظت أن الطريقة الثانية أيسرا كثيرا , ولعلك تسأل الآن لما ذكرت الطريقة الأولي ؟! فأقول لك : إن الطريقة الأولي لها عدة فوائد لابد أن يتعلمها المصمم في برنامج Flash , ومن يريد احترافه , ونجملها في لآتي :

1- مزيد من التركيز علي معرفة الفرق بين Keyframe وBlank Keyframe .

2- معرفة وظيفة Onion Skin.

3- استخدام Paste in Place.