التصميم والبرمجة بتقنية الـ Flash

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

فإذا كنت مطلع على أخبار هذه التقنية فستكون على علم أنها أصدرت النسخه العاشرة من مشغل هذه التقنية Flash Player منذ فتره قريبه وهذه النسخة تحتوي على تطويرات قوية وعظيمه من دون أي مبالغةبما فيها خمس إضافات رئيسية تنقلك نقله نوعية ورائعة :

3D Effects
تتكون النسخة العاشرة من إضافة تأثيرات وتحكم ثلاثي الأبعاد في العناصر مثل تحريك ثلاثي أبعاد ودقة الضوء المنبعث على العنصر والكثير ..
Custom Filters and Effects
إضافة إمكانية عمل فلاتر وتأثيرات خاصه بك عن طريق برنامج Adobe Pixel Bender الذي يحتوي على نفس تأثيرات برنامج After Effects الخيالي .
Advanced Text Layout
تهيئة النصوص بشكل جديد حيث بالإمكان عمل حقل النص من اليمين إلى اليسار حالياً وأيضاً كتابة نصوص عمودياً والكثير من العمليات التي تعطي مرونه عاليه .
Enhanced Drawing API
الرسم وإضافة العناصر في وقت التنفيذ اصبح اسهل وأكثر قوة من قبل بإضافة خصائص جديده ..
Visual Performance Improvements
هذا التحديث يتعلق بالتطبيقات والفيديو حيث سيكون عرض الفيديو أكثر صفاوة وسرعة وكذالك إستخدام التطبيقات, حيث تم عمل تشغيل بعض المهام على ذاكرة الفيديو وذالك ليعطي مساحة أوفر المعالج CPU
يمكنك تحميل النسخة العاشرة [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

ويمكنك مشاهدة بعض الأمثلة لمميزات النسخة العاشره بإنتاج أدوبي من هناhttp://labs.adobe.com/technologies/flashplayer10/demos/index.html ومثال آخر من هناhttp://labs.adobe.com/technologies/flashplayer10/demos/pixelbender/.

حالياً سنتطرق إلى البرامج المستخدمه لعمل تقنيات بالفلاش وما هي لغة البرمجة المستخدمه لهذه التقنية مع بداية بسيطه لتنفيذ عمل جميل


البرامج التي يمكنك عمل بها فلاش ليس واحد او اثنين بل أكثر من برنامج مثل :

برنامج فلاش بروفيشنال المشهور Flash CS3 Professional
برنامج سويتش ماكس المعروف كذالك SWISH Max
وبرنامج Flex العادة هو غير معروف , هذا البرنامج يعطيك أدوات خاصه بالبرمجة أكثر من التصميم يعني بعكس الفلاش بحيث ان هذا البرنامج يستهدف المبرمجين والمطورين أكثرأما الفلاش فيستهدف المصممين أكثر والكثير من البرامج المتنوعه من شركات أخرى التي هي غير معروفه .
يوجد برامج لعمل فلاش لكن مع ذالك يمكنك عمل تطبيقات او تأثيرات فلاشيه من دون وجود برنامج فلاش فقط بالنوت باد التي تكون مع ويندوز أو بأي محرر نصوص

ولكن ستقوم بكتابة العمل بإستخدام لغة برمجة تسمى Actionscript وآخر إصدار منها هي الإصدار الثالث بحيث تسمى Actionscript 3 لأنه النسخه التي قبل النسخه الأخيره تختلف طريقة كتابتها وعملها عن النسخه الأخيره نظراً للتطورات التي عملتها أدوبي للنسخة الأخيرة من لغة البرمجة.

بإمكانك عمل نموذج فلاشي ولكنه سيكون صعب بحيث انه تقوم بعمل النموذج كتابة بالأكواد ثم عمل Compile ليتم تحويل الأكواد إلى لغة الآله وإنشاء ملف SWF لتنفيذه , وإذا كنت تحب أن تعرف هذه الطريقه يمكنك ذالك من هنا ( Beginners Guide to Getting Started with AS3 ) على هذا الرابط: [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

أفضل إستخدام للفلاش بشكل مبدئي وإحترافي هو Flash Professional وهذا ما أطبق عليه دائماً , وسأشرح دروس طريق البدايه مع هذا البرنامج لعمل تقنيات جميلة بالفلاش.

أولا نصب البرنامج (Flash CS3 Professional)

الأن قم بفتح البرنامج ستظهر لك نافذة الترحيب :
تتكون نافذة الترحيب من 5 أجزاء :
Open a Recent Item عبارة عن الملفات التي قمت بإنشاءها وحفظها مؤخراً بحيث يسهل لك فتح ملفات المشروع الأخير الذي تقوم بالعمل عليه في كل مره تفتح الفلاش
هناك زر Open في نهاية القائمه لفتح أي ملف آخر.
Create New لإنشاء ملف جديد , القائمة تحتوي على خيارات لنوع الملف الجديد الذي تريد إنشاءه , هل هو بلغة البرمجة AS3 أو AS2 لأنني كما سبق وقلت لكم أنها تختلف عن بعضها , الأفضل دائماً أن تنشأ ملف جديد بـ AS3 لأنها آخر إصدار لكن AS2 متاح للذين يودون العمل بها او لديهم مشاريع سابقه بالـ AS2.
هذا الجزء عبارة عن قوالب جاهزة بإمكانك إستخدامها في مشروعك.
الجزء الرابع المحدد بالصورة هو معلومات عامة خارجية بالضغط عليها يفتح لك متصفح إنترنت.
هذا الزر عند الضغط عليه لن تظهر هذه النافذة مره أخرى, ويمكنك إعادة إظهارها مره أخرى من الإعدادات Edit -> Preferences
الأن لنبدأ العمل , أضغط على Flash File Actionscript 3 تحت الجزء Create New لننشأ ملف جديد.
ستظهر لك صفحة فارغة بمقاس 550 × 400 كالصورة التالية :
أدوات الرسم والتحديد.

نافذة الإطارات والطبقات التي تتحكم بالحركة (Time Line) للعناصر في الطبقة.
الجزء الأيمن به نوافذ الخصائص المتعلقة بأدوات الرسم والتحديد وخصائص العناصر التي تم رسمها او تحديدها.
التحكم بخصائص وإعدادات الصفحة والإطار, التاب Actions – Frame هنا يتم كتابة أكواد لغة البرمجة Actionscript ليتم تنفيذه لكل إطار
و Filters هي خصائص العنصر عباره عن تأثيرات يتم إعدادها على العنصر مثل ضل وتموج.
أتوقع الرسم والكتابة وتغيير إعداداتها سهله جداً وواضحه اضغط على الأداة التي تريد استخدامها من اليسار ثم ارسم
لكي تتضح بعض الخطوات ولكي اشرح خطوه مهمه في برنامج Flash سأتطرق لهذا الدرس.
تحريك العناصر بإستخدام الإطارات
قم بإختيار اداة الرسم الدائرة ثم ارسم دائرة في الطبقة الأولى
أرسم الدائرة في إطار العمل ( الصفحة )
أختر أداة التحريك بالضغط عليها من الأدوات في الجزء الأيسر أو أضغط V من لوحة المفاتيح ثم قم بتحديد جميع أجزاء الدائرة بالضغط على شكل الدائرة مرتين
قم بتحويل الرسمة من رسمة في الصفحة إلى عنصر من المكتبة مضيوف في الصفحة
بالضغط من القائمة العلوية على Modify ثم Convert To Symbol أو F8 من لوحة المفاتيح
ستظهر لك نافذة التحويل ستجد حقل name هنا تكتب اسم العنصر مثلاً MyCircle
وستجد خيارات Type وهي خيارات نوع العنصر هل هو Movie clip أو Button أو Graphic
Movie clip و Graphic لا يتخلفان عن بعض كثيراً لكن يفضل إستخدام Movie clip لأنه بإمكانك عمل فيه تأثيرات مثل ضل وتموج اما جرافيك فلا
وبالنسبه للنوع Button فمعروف ما هو يتم تحويل الشكل إلى زر وتظهر فيه خيارات مثل عند مرور الفأره وعند الضغط على العنصر
ونحن في درسنا هذا سنختار Movie clip لأننا بكل بساطه سنجعل العنصر يتحرك فقط
وهناك خيار آخر بأسم Registration وهو يحدد مركز نقطه العنصر بحيث لما تختار وسط وتقوم بعمل تدوير للعنصر يدور في الوسط أي الدائرة تدور حول نفسها ولكن عند إختيارك لليمين وعمل تدوير للعنصر فسترى ان الكورة كأنها تدور على جنب وليس حول نفسها.
اجعل خيار Registration كما هو في الوسط وأضغط OK.
الأن سترى أن الرسمه تحولت إلى عنصر في المكتبه مضافه في الصفحة كما ترى في الصورة التالية :
الأن أنتهينا من الرسم في الإطار الأول سننتقل إلى الإطارات لتحريك العنصر.
في نافذة الإطارات أو الـ Time Line اختر الإطار العاشر بالضغط عليها من الماوس الزر الأيمن ثم أضغط على Insert Keyframe أو F6 من لوحة المفاتيح
هنا سينشأ إطار جديد في الإطار رقم 10 والإطارات من 1 إلى 9 هي تعتبر إطارات متكرره من الإطار الأول.
الأن في الإطار رقم 10 قم بتحريك العنصر الموجود إلى اليمين
الأن اضغط بالزر الأيمن من الماوس في أي مكان من الإطار 1 حتى 9 واختر Create Motion Tween
الأن تم تفعيل الحركه من اليسار إلى اليمين لمشاهدة الحركة ,ضغط من القائمة العلوية Control ثم Test Movie او Ctrl + Enter من لوحة المفاتيح وشاهد النتيجة