منتديات تو زوو - الــــدرس الســـادس ( لعبــة ترتيب الصور ) مدعم بالصور

http://www.shy22.com/upfiles/AKO39527.jpg

http://dc12.arabsh.com/i/02905/ewp0lfj4zkoy.png

بســـــــــــم الله الرحمـــــــــن الرحيـــــــــم

الســـــــــــــلام عليكم ورحمة الله وبركــــــــاته

الــــــــــدرس الســـادس

لعبــة ترتيـــــــــــب الصــــور

الصـــــــورة قــــبل تنفيــــــذ الدرس ..

http://dc343.4shared.com/img/shrZhkf...644151/0_6.jpg

النتيجة النهائية بعد تنفيذ الدرس

http://dc343.4shared.com/img/xM-UFbe...794645/0_2.gif

الخــطــــــــــــــــوات ..

نفتــــــــح بــــــــرنامج الفـــــــــوتوشوب ..

من قائمة ابـــدء --> Photoshop CS4 ..

نختــــــــار .. Open <------- File بالعربي ملف -----> فتح

http://dc343.4shared.com/img/hYJ9YU3J/s3/1_10.jpg

نختار الصورة لي نبي نطبق عليها الدرس

http://dc343.4shared.com/img/1-RR2mZe/s3/2_5.jpg

هذه اهي اظهرت لنا بمساحة العمل

http://dc343.4shared.com/img/CFex_goN/s3/3_5.jpg

احين نروح عند قائمة View نختار منها Show وبنحط علامة صح يم Grid

http://dc343.4shared.com/img/ChW46H2v/s7/4_6.jpg

شوفوا شلون صارت مساحة العمل ..

صارت مربعات عشان نقدر نقايس بالضبط ..

http://dc343.4shared.com/img/n5L6V-gJ/s3/5_9.jpg

طبعا حنا نبي نقسم الصورة الى 9 مربعات متساوية ..

اذا حسيتم انها الصورة تحتاج الى قص .. تقدرون تسخدمون الاداة لي بالصورة

http://dc343.4shared.com/img/TzDZNifb/s3/7_5.jpg

احين مثل مالصورة موضحة شايفين المسطرة لي فوق والي بالجنب ..

لي انا مؤشرة عليهم بالسهم ..

تروحون لما المسطرة لي فوق وتحطون السهم عليها وتسحبون عشان تقسمون الصورة

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

طبعا حنا عشان نقسم الصورة الى 9 اقسام متساوية لازم نقسمها بالعرض

الى 3 اقسام وهم بالطول الى 3 اقسام .. يعني خطين افقيين وخطيين عموديين

احين يبيلنا عشان نقسمها ,,

نسحب المسطرة لي فوق مرتين :

المرة الاولى بنسحبها و بتلاحظون انه يظهر خط افقي.. سحبوها بحيث

انكم تحطونها بالمكان المناسب عشان تتقسم الصورة ..

وكرروا هالخطوة للمرة الثانية .. وحطوه بالمكان الثاني

عشان يصير تقسمت الصورة افقيا الى ثلاثة اقسام ..

نفس هالخطوات سوها ويا المسطرة لي عالجنب ..

الاختلاف بيكون انها بتعطيكم خطوط عامودية ..

http://dc343.4shared.com/img/uaEgX4Pd/s3/6_5.jpg

احين ذي الصورة عقب ماقسمتها باستخدام المسطرة وذي الخطوط لي باللون السماوي

اهي الخطوط مال المساطر .. شوفو وين حطيتها ..

طبعا هني واضح انه التقسيمات متساوية .. طبعا تقدرون تحسبون عدد المربعات عشان

تصيرون دقيقين بالشغل .. واذا زاد مربع استخدمو اداة القص مثل ماخبرتكم قبل ..

http://dc343.4shared.com/img/BF8MzaI9/s3/8_4.jpg

احين عقب ماقسمنا الصورة .. نبي نقطعها .. يعني نبيها تصير 9 مربعات ..

كل مربع ابروحه .. بنروح عند الاداة 1 بنختار منه اداة 2 .. لي اهي slice tool

في بعض اصدارات الفوتوشوب تلاقون هالاداة ظاهرة من غير ما تضغطون على الاداة رقم 1

http://dc343.4shared.com/img/gll-e0x4/s3/9_5.jpg

احين ذي الصورة بتوضح لكم شلون تستخدمو اداة slice tool لتقطيع الصورة ..

وللمعلومية انا هني مطبقتها على مربع واحد فقط عشان الشرح انتم بتطبقونها على

جميع المربعات ..ركزوا بالصورة من وين نبتدي والى وين ننتهي

http://dc09.arabsh.com/i/02951/795y8qfwvmt3.gif

احين عقب ذي الخطوة .. بنحفظ الصورة

http://dc312.4shared.com/img/rJRzc-n...26758/10_2.jpg

احين بنروح بنختار Open <----- File بالعربي ملف -----> فتح

ومثل مو شايفين بتلاقون الصورة تقطعت الى 9 مربعات ..

بتحددون كل المربعات وبتختارون فتح ..

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

ضغطوا CTRL + A وبتحدد كل الصور لي بنفس المجلد ..

اذا كان في صور ضغطوا على CTRL وحددو الصور وحدة وحدة ..

http://dc343.4shared.com/img/_d_zyVE...21921/12_2.jpg

1 - احين بتروحون لما الـ History وترا مو اي History لا الـ History

حق مساحة العمل الي اشتغلنا عليها وبتضغطون على لي انا مؤشره..

عليه بالسهم يعني بيعيدنا من اول ويديد وبينحذف كل شي ولا كاننا اشتغلنا ..

2- مثل مو شايفن ذي المربعات الـ 9 لي قطعناهم وادرجناهم من اشوي ..

بنروح عند كل مربع بنضغط عليه وبنضغط CTRL + C عشان ننسخه ..

وبنروح لما مساحة العمل الي من شوي حذفنا كل شي منها وبنضغط CTRL + V

عشان نلصقه .. وبنسوي هالخطوة مع كل المربعات الـ 9

http://dc343.4shared.com/img/R9MUy5tn/s3/13_2.jpg

احين ذي الصورة عقب ما لصقناهم بمساحة العمل ..

طبعا ماعليكم امبين انه مربع 1 لكن الصج اهوا 9 مربعات بس كلهم فوق بعض = )

http://dc343.4shared.com/img/qqtNEeY-/s3/14_2.jpg

احين بنرتب المربعات ... بنحط كل مربع بمكانه الصحيح .. شوفو شلون الصورة

http://dc343.4shared.com/img/Hc6OkEYz/s3/15_2.jpg

احين بنختار واحد من المربعات بنشيل من يمه العين عشان يختفي ..

لانه لازم يكون في مربع ابيض عشان تتحرك الصورة ..

انا هني اخترت ذا لانه ماياثر على الصورة ..

http://dc343.4shared.com/img/it9S_EdN/s3/16_2.jpg

احين انا هني رقمت المربعات عشان الشرح فقط يعني لاحد يرقم مثلي

http://dc343.4shared.com/img/2XN9OPxr/s3/17_online.jpg

عقب مارتبنا الصورة وعرفنا اماكن المربعات ..

احين بنغير الاماكن لكن لازم تكونون عارفين شلون تردون ترتبونها من اول ويديد ..

وهم لازم يكون تغير اماكن المربعات على حسب المربع الابيض ..

يعني شوفوا هني كان المربع الابيض رقم 1 .. احين عشان نغير الاماكن ..

عندنا خيارين اما نخلي المربع رقم 2 مكان المربع رقم 1 او نخلي المربع رقم 4 مكان المربع رقم 1

انا هني اخترت الخيار الثاني ..

احين عقب ما غيرت الاماكن صار عندي خيارين ..

اما اخلي المربع رقم 5 مكان المربع رقم 4 او اخلي المربع رقم 7 مكان المربع رقم 4 ..

ان شاء الله اوصلت الفكرا .. انه مايكون غيير الاماكن باسلوب عشوائي ..

http://dc343.4shared.com/img/K1FhBdk.../18_online.jpg

احين ذي الصورة عقب ما غيرت الاماكن كاملة ..

http://dc343.4shared.com/img/myjN19Hu/s3/19_online.jpg

ابروح لقائمة Animation <--- Windows

http://dc149.4shared.com/img/38rPZFE...503716/1_2.jpg

ذا الصورة توضح شريط الانميشن ظهر وفيه فريم واحد ..

http://dc343.4shared.com/img/vcAK_rbx/s3/20_2.jpg

احين بنضيف فريم .. واعتقد كلكم تعرفون من وين نضيف الفريمات

لني شارحتها بالدروس السابقة ..

ونحرك مربع واحد فقط مثل مالصورة موضحة ..

http://dc343.4shared.com/img/uDRPwMYC/s3/21_online.jpg

يعني باختصار بتكررون هالخطوات بالترتيب لين ما تترتب الصورة من يديد ..

- اضافة فريم يديد

- تحريك مربع واحد فقط لاعادة ترتيب الصورة .

يعني مع كل اضافة فريم نحرك مربع واحد ونحطه مكان المربع الابيض

عشان نرد نرتب الصورة من يديد ..

http://dc343.4shared.com/img/NNnurnT...31944/22_5.jpg

اهني عقب مارديت رتبت الصور كاملة .. يعني لازم بعد الترتيب يصير عندكم 9 فريمات ..

كل فريم المربع الابيض فيه يختلف عن الفريم لي قبله

+ ممكن يكون المربع الابيض بالفريم الاخير في نفس مكانه بالفريم الاول

مثل عندنا اهني بالصورة وممكن يكون يختلف وهالشي

يعتمد على طريجتكم في تغيير الاماكن .

http://dc343.4shared.com/img/FEHgm2z...58193/23_3.jpg

اهني تعرفون نغير مدة التنقل بين الفريمات .. يفضل انه اخر فريم تخلون المدة اشوي

طويلة وباجي الفريمات تكون المدة فيهم متساوية ..

انا الفريمات خليت مدتها 1 والفريم الاخير خليته 5

http://dc343.4shared.com/img/sIkCHmV...44426/24_2.jpg

احين نروح عند قائمة View نختار منها Show و نشيل علامة الصح من يم Grid

http://dc343.4shared.com/img/ChW46H2v/s7/4_6.jpg

وهذه اهي الصورة

http://dc343.4shared.com/img/ZDaUaUt...48002/25_3.jpg

وهني تحفظون الصورة من ..save for web and devices <-- File

http://dc312.4shared.com/img/rJRzc-n...26758/10_2.jpg

تـــــــــــــم بحـــــــــــمدالله

المـــــــــوضــــــــوع من مجهـــــــودي الشخصي ..و اي ســـــــــــؤال انا حاضـــــــرة

فـــــــلا تنسوني من صالح دعــــائكم .

اختـــــكم في الله : الهـــــــــام