صورة متحركة جميلة ..

المقدمة
في هذا الدرس سنتعلم كيفية توظيف أداة رسم الأشكال Shape لتصميم صورة متحركة جميلة ..
حيث ستكتسب مهارات جيدة في التعامل مع أكثر من صورة ودمجها في مساحة عمل واحدة .. وكيفية تحريكها في الإمج ردي ..
درس 3 × 1 = مميز ومسلي ومفيد ..
صورة متحركة جميلة .. 337

مثال على الدرس
صورة متحركة جميلة .. 28

خطوات التنفيذ
الخطوة الأولى
اختر عدداً من الصور التي ترغب بتطبيق الحركة عليها ،، وافتحها في برنامج الفوتوشوب عن طريق
File >> Open
في الدرس .. اخترت 3 صور .. وهي كالآتي:
صورة متحركة جميلة .. 1

عند كل صورة ستقوم بفتحها في برنامج الفوتوشوب ،، ستلاحظ وجود علامة القفل صورة متحركة جميلة .. Qfl

في بوكس الليرات ..

مثلاً عندما فتحت الصورة الأولى ..
صورة متحركة جميلة .. 01

كان وضع بوكس الليرات كالآتي:
صورة متحركة جميلة .. 0

عليك أن ترفع علامة القفل ..

عفواً .. ما هو علامة القفل؟؟ ولماذا علي رفعه؟؟ وكيف أرفعه أصلاً؟؟ صورة متحركة جميلة .. Thinking

سؤال جيد .. ولتحصل على الإجابة ،، والمزيد من المعلومات عن القفل ,, اتبع الرابط التالي

..
عليك أن ترفع القفل من جميع الصور ،، المستخدمة كل على حدا
بعد أن تنتهي من تجهيز الصور ،، اتركها على جنب ،، واتجه للخطوة الثانية
صورة متحركة جميلة .. 337

الخطوة الثانية
قم بفتح مساحة عمل جديدة ،، عن طريق:
File >> New
صورة متحركة جميلة .. FileNewJ

سيظهر لك بوكس لاختيار الحجم ،، أدخل المقاييس التالية: 300 × 300 Pixels واجعل الخلفية شفافة = Transparent
لاحظ الصورة ...
صورة متحركة جميلة .. 4

لاحظ أننا اخترنا مساحة متوسطة الحجم ،، أنصحك باستخدام نفس المساحة ـ على الأقل عند تطبيقك الأول للدرس ، خاصة إن كنت مبتدئً ـ حتى يسهل عليك السيطرة على الصور في التطبيق ،،
انتقل للخطوة الثانية
صورة متحركة جميلة .. Ryadhah2

الخطوة الثالثة

اتجه لقائمة الأدوات واختر أداة رسم الأشكال ـ Shape ـ ورمزه

الآن قم باستخدام الشكل في مساحة العمل ..

لاحظ مساحة العمل بعد تنفيذ هذه العملية ..
صورة متحركة جميلة .. 7

جميل !
معلومة .. تلاحظ أن الشكل باللون الأسود .. هذا لأن الألوان عندي وقت تنفيذ الخطوة السابقة كانت كالآتي

أي أن اللون في الواجهة كان أسوداً ،، والخلاصة أن الـ Shape يتلون بلون الواجهة ،، فلو كانت الواجهة باللون الأزرق

لكان الشكل هكذا صورة متحركة جميلة .. 8

على كلٍ ،، عامل اللون غير مؤثر في درسنا اليوم ،، فأي لون سيفي بالغرض صورة متحركة جميلة .. Colora12

،،
عفواً .. مازلت مبتدئ في الفوتوشوب ،، ولا أعرف أين أجد أداة الـ Shape في قائمة الأدوات .. ولا كيفية استخدامه؟؟
ستحصل على كل ما تحتاجه من معلومات حول الأشكال Shape إذا اتبعت هذا الرابط ..

صورة متحركة جميلة .. 337

الخطوة الرابعة
بعد أن أرحنا الشكل على مساحة العمل ،، واسترحنا منه مبدئياً صورة متحركة جميلة .. Woosht

.. وحصلنا على بعض المعلومات العامة عن الـ Shape
سنقوم بإضافة بعض التأثير عليه من خلال الـ Style
اختر ما يلي ..
Layer >> Layer Style >> Blending Options

تابع الصورة
صورة متحركة جميلة .. LStyleBO

سيظهر لك بوكس كبير على يساره قائمة بالخصائص المتنوعة ،، سنستخدم خاصيتين ،، وهما Drop Shadow و Stroke
اتبع الخطوات التي في الصورة ..
صورة متحركة جميلة .. 9

إذا واجهت صعوبة في تطبيق الخطوات الموضحة في الصورة اتبع الشرح ..
1- Drop Shadow .. اضغط بالماوس ــ الفأرة ــ على المربع الصغير التي بجانب الخاصية ،، لتحديدها بعلامة صح .
2- اضغط بالماوس ـ الفأرة ـ على كلمة Stroke نفسها ،، حتى يتغير محتو البوكس لتظهر لنا أوامر التحكم بالخاصية ،، وسنقوم بتغير الآتي :
3- Size ،، غالباً ما ستجد الرقم عند هذا الأمر 3 .. قم بتغييرها لـ 1 .. وهو يحدد سمك الحدود ..
4- Position ،، أي وضعية الحدود ،، هل تريها من الخارج = Outside ،، أم الداخل Inside ،، أم الوسط = Center ،، وفي الدرس اخترته من الداخل أي Inside
شاهد الصورة
صورة متحركة جميلة .. 10

5- لنحدد لون الخط ،، واختيارك للون يعتمد على الألوان الغالبة في الصور التي ستستخدمها في التصميم ،، وبالنسبة لصوري وجدت أن اللون الأحمر الترابي ـ إن صح الوصف ـ مناسب للتصميم ،، ودرجته 996666 #
أما عن كيفية إظهار بوكس الألوان ،، فما عليك إلا الضغط على المربع الملون الصغير الذي ستجده بجانب كلمة Color ثم اختر اللون المناسب ..

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

شاهد النتيجة بعد هذا العمل
صورة متحركة جميلة .. 11

حدث تغيير بسيط صورة متحركة جميلة .. Smile

.. لكن سيظهر بشكل أفضل بعد أن نضيف الصور للعمل ..
لذا .. انتقل للخطوة الخامسة
صورة متحركة جميلة .. Tzalj

الخطوة الخامسة
انتقل لصور الآنسات .. ثم قم بتفعيل الصورة الأولى التي ستعمل عليها ..

عفواً كيف أفعّل الصورة صورة متحركة جميلة .. Shay

؟؟
اضغط على الصورة كي يصبح لون الإطار أزرق فاقع ،، وبذلك تكون قد فعّلت الصورة ..

شاهد معي كيف
صورة متحركة جميلة .. 12

والآن من لوحة المفاتيح .. اضغط على Ctrl + A ،، وذلك لتحديد كل عناصر اللير ،، وهي صورة الفتاة كاملة ..
يفترض أن تحصل على هذه النتيجة ..
صورة متحركة جميلة .. 13

بالمناسبة .. بإمكانك أن تطبق أمر تحديد الكل باتباع الأمر التالي ..
Select >> All
والآن سنقوم بنسخها ،، أيضاً من لوحة المفاتيح اضغط على Ctrl + C
أو من القائمة الرئيسية اتبع الأمر التالي ..
Edit >> Copy

والآن عد لمساحة العمل التي رسمنا عليها الشكل ـ Shape ـ

قم بتفعيلها أولا .. هل تذكر كيف فعّلنا صورة الفتاة ،، اتبع نفس الطريقة ،، فقط اضغط علي مساحة العمل ،،
بعد التفعيل ،، من لوحة المفاتيح اضغط على Ctrl + V
أو من القائمة الرئيسية ،، اتبع الأمر التالي ..
Edit >> Past
ملاحظة .. هناك طريقة أخرى لنقل الصور من مساحة عمل إلى أخرى ،، وهي سحبها بأداة المؤشر صورة متحركة جميلة .. MoAsherjewels

،، إن كنت من محبي استخدام هذه الطريقة ،، فعليك رفع علامة القفل كما ذكرناه في بداية الدرس ،، وإن استخدمت طريقة التحديد والنسخ واللصق ،، فلن تحتاج لرفعه .. ولكن بالتأكيد تعلمت الكثير عن الأقفال وكيفية رفعها ،، فلم تخسر شيءً على أي حال ..
كيف حال مساحة العمل عندك ..
سأريك الحال عندي ..
صورة متحركة جميلة .. 14

لاحظ مساحة العمل مع وضع بوكس الليرات ..

إن لم تجد بوكس الليرات على الشاشة ،، اتبع الرابط التالي ،،
من لوحة المفاتيح مجدداً .. اضغط على التالي ..
Ctrl + G
أو من القائمة الرئيسية .. اتبع الأمر التالي ..
Layer >> Group with previous
صورة متحركة جميلة .. 337

عفواً .. أقوم بتطبيق الخطوة السابقة كما تم ذكره بالضبط .. لكني لا أصل لنفس النتيجة؟!!
هذا الدرس تم تطبيقه على النسخة السابعة Adobe Photoshop 7.0 me ..
هل تستخدم الإصدار الأخير Adobe Photoshop CS ؟؟

هام لمستخدمي الإصدار الأخير Adobe Photoshop CS

بعض الأوامر قد تم تغيير أماكنها في النسخة الأخيرة من البرنامج ..
لكن لا تقلق .. فالأمر تحت السيطرة صورة متحركة جميلة .. Smile

يمكنكم تطبيق الأمر السابق .. بإتباع التالي:
Layer >> Create Clipping Mask
واختصاره من لوحة المفاتيح
Alt + Ctrl +G

شاهد التغيير العجيب الذي سيحصل في مساحة العمل ،، وبوكس الليرات صورة متحركة جميلة .. Eyelove

..

والآن قم بتعديل وضعية صورة الفتاة ،، تأكد من تحديد لير الفتاة ،، أي أن يكون لونه أزرق فاقع ،، كما في تم توضيحه في الصورة التي بالأعلى ــ لاحظ بوكس الليرات في الصورة السابقة ــ ،،
ثم استخدم أداة المؤشر صورة متحركة جميلة .. MoAsherjewels

من قائمة الأدوات ــ ستجده في أعلى القائمة ــ ،، واتجه لمساحة العمل ،، واضغط على صورة الفتاة وعدل من وضعيتها ..

لاحظ مساحة العمل ،، بعد أن قمت بتعديل وضعية الصورة حسب الشكل ـ Shape ـ الذي رسمته ..
صورة متحركة جميلة .. 16

مبرووووووووووووك صورة متحركة جميلة .. Kloloosh

.. أنهيت الخطوة الخامسة ،، وهي الخطوة الجذرية في الدرس ،، سنجعل الخطوة السادسة عبارة عن اختبار لمراحل هذه الخطوة ..
هل أنت جاهز؟؟
نحن لها .. إلى الخطوة السادسة .. هيا بنااااااا صورة متحركة جميلة .. 79an

الخطوة السادسة
كرر نفس العملية في الخطوة الخامسة ،، مع الصورتين الباقيتين معنا ،،
بعد أن تتقنها ،، ستجدها ممتعة ،، كأنها لعبة مسلية ،، ثق بكلامي
إبدأ

::
::
::
أين وصلت
::
::
::
بالنسبة لي .. لقد انتهيت من نقل الصورة الثانية
شاهد مساحة العمل عندي مع وضع بوكس الليرات ..
صورة متحركة جميلة .. 17

::
::
::
ما الأخبار عندك؟؟
جيد ،،
شاهد عملي بعد الانتهاء من نقل الصورة الثالثة والأخيرة ،، مع وضع بوكس الليرات ..
صورة متحركة جميلة .. 18

هل انتهيت؟
أحسنت .. تتعلم بسرعة صورة متحركة جميلة .. Wooow

.. لك مستقبل باهر في الفوتوشوب صورة متحركة جميلة .. Thum3

..
اصعد على متن الطائرة المتجهة من الفوتوشوب للإمج ردي على خطوط طيران جواهر الإمارات .. كابتن الطائرة jewels سيسرها اصطحابك إلى هناك ..
صورة متحركة جميلة .. Sfar2

عفواً .. كيف أنتقل للإمج ردي؟!!
من لوحة المفاتيح .. اضغط على Shft + Ctrl + M

ممممم .. هل وجدت صعوبة في تنفيذ الأمر السابق ،، أو أردت أن تتعرف أكثر على الإمج ردي وطرق الانتقال إليه .. عزيزي الراكب

،، في هذه الحالة .. تذكرتك ليست مباشرة ـ ترانزييييييت ـ عليك أن تنتقل أولا للرابط التالي .. ثم تلحقنا إلى الخطوة السابعة من الدرس ،، في دولة الإمج ردي .. استمتع برحلتك ..
صورة متحركة جميلة .. Plane2

الخطوة السابعة
الحمد لله على السلامة صورة متحركة جميلة .. Flowers

وصلت على الوقت صورة متحركة جميلة .. Time

يفترض أن تشاهد أمامك التالي ..
صورة متحركة جميلة .. 19

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

قم برفع علامة العين صورة متحركة جميلة .. Yey

من ليري الفتاتين اللاتي في الأعلى ..

توضيح .. علامة العين هي هذه صورة متحركة جميلة .. Yey

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

شاهد بوكس الليرات بعد أن قمت برفع علامة العين من الليرين المذكورين
صورة متحركة جميلة .. 20

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

الموجود بأسفل شريط الحركة Animation
صورة متحركة جميلة .. 21

ستلاحظ تكرار البرواز الأول ..

شاهد الصورة بعد إضافة البرواز الجديد
صورة متحركة جميلة .. 22

والآن عد إلى بوكس الليرات .. وارفع علامة العين صورة متحركة جميلة .. Yey

من اللير فتاة ذات الخلفية الزرقاء وضعة على لير الفتاة التي بالأعلى ..

شاهد معي الصورة
صورة متحركة جميلة .. 23

بعد هذه العملية ،، سيكون الوضع في شريط الأنيميشن كالتالي ..
صورة متحركة جميلة .. 25

هل فهمت الخدعة .. في كل برواز تنسخه صورة متحركة جميلة .. Layer

.. عليك رفع علامة العين صورة متحركة جميلة .. Yey

من لير الفتيات كلها .. وإبقاءها على صورة واحدة فقط .. هكذا حتى تنهيها كلها ..
بقيت مهنا صورة واحدة ..

في شريط الأنيميشن .. قم بنسخ آخر برواز صورة متحركة جميلة .. Layer

..
ثم اتجه لبوكس الليرات وارفع علامة العين صورة متحركة جميلة .. Yey

عن اللير السابق .. وضعه على لير الفتاة المتبقي

شاهد وضع بوكس الليرات بعد تنفيذ ما سبق
صورة متحركة جميلة .. 24

والوضع النهائي لشريط الأنيميشن يجب أن يكون هكذا
صورة متحركة جميلة .. 337

الخطوة الثامنة
ضبط التوقيت ..

في شريط الأنيميشن ،، ستلاحظ وجود صورة متحركة جميلة .. 0sec

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

لقد ضبطت الوقت على ثانيتان

شاهد كيفية تغيير التوقيت
صورة متحركة جميلة .. 27

والآن قم بمشاهدة التطبيق بالضغط على رمز التشغيل صورة متحركة جميلة .. Play

الموجود أسفل شريط الحركة Animation ..

إن أحسست بأن الحركة سريعة أو بطيئة يمكنك تعديل التوقيت باختيار رقم أكير أو أصغر .. حسب ما يناسبك ..
صورة متحركة جميلة .. 337

الخطوة التاسعة
قم يتخزين العمل عن طريق في الإمج ردي ..
اتجه لـ
File >> Save Optimized As
صورة متحركة جميلة .. FileSaveOptimized

ثم اختر اسما مناسبا واضغط OK

ملاحظة .. إن واجهت أية مشاكل في التخزين ،، فمرورك على هذا الرابط سيفيدك ..

وهذه هي النتيجة النهائية
صورة متحركة جميلة .. 28

شكراً على المتابعة
جزاكم الله خيراً

يسلمو قلبوو على الدرس لروعه

لاتحرميناا من جديدك

الصراحه انا كنت ادور على الدرس هذا بس لقيته في هذا المنتدى الروعه يسلمووو على هذا الدرس

شكرا ع الكلام الحلو

يسلمووووووووووووووووووووووو ع المرور العطر

اخـــ مشكووووووووووووووووورهـ ــتي

<table cellSpacing=0 cellPadding=0 width="100%" border=0><tr><td></TD> <td class=post-options vAlign=top noWrap></TD></TR> <tr><td class=hr colSpan=2></TD></TR> <tr><td colSpan=2>اخـــ مشكووووووووووووووووورهـ ــتي</TD></TR></TABLE>
:jioou:
اخـــ مشكووووووووووووووووورهـ ــتي

شكرااااااااااااااااااااااااااااااااااااااااااا