المساعد الشخصي الرقمي

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



said
10-30-2013, بتوقيت غرينيتش 01:40 AM
السلام عليكم ورحمة الله وبركاته

كيف حالكم شباب

اليوم طبعا أنا جاي ومعاي درس مفصل التقطيع بالفوتوشوب بس بطريقة مختلفة الدرس مفصل سهل وممتع بس يحتاج له شوية تركيز
طبعا راح نستخدم أداة (( السكين ))

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

عشان ما أطول عليكم بندأ الدرس مفصل

يلا جاهزين
نبدأ الدرس مفصل:

أول شي إفتح برنامج الفوتوشوب وإختار من الأدوات أدات (( السكين )) شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-1.JPG

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

http://www.mr-des.com/sc/up/up/cut-tr-2.JPG

بعدين نختار أداء السكين

http://www.mr-des.com/sc/up/up/cut-tr-3.JPG

وبعدين نضغط بزر الفأرة ونسحب من أحد أطراف التصميم إلى ما تصير كذا شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-4.JPG

الحين نبغى نعرف كم مقاس مربع التقطيع
أكيد الكل يسألون عن هذا السؤال
نروح ونضع الماوس داخل المربع إللي سويناه قبل شوي بس لازم تكون مفعل أداة السكين (( مأشر عليها من قائمة الأدوات ))
ونضغط على المربع بزر الفأرة الأيمن وبتطلع قائمة إختر منها مثل الموجود في الصورة شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-5.jpg

وبيظهر لك مربع حوار مثل ما في الصورة وهاذي إعدادات الصورة

http://www.mr-des.com/sc/up/up/cut-tr-6.jpg

حاول إحفظ الأرقام

شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-7.jpg

الحين بعد ما خلصنا إعدادات الصورة نختار (( أوكي ))
ونسوي هاذ الطريقة على الأركان الأخرى
بس أكيد الأركان السفلية راح تكون أطول شوي عشان كذا حاول قلل من طولها على حسب تصميمك

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

::..::..:: ركز شوي في هذا الجزء ::..::..::

بعد ما قسمنا ركن واحد وبالمقاسات إللي إحنا نبغاها نروح ونحط الماوس داخل المربع إلي قسمناه (( ولا تنسى تفعل أداة السكين ))
ونضغط على زر Alt في لوحة المفاتيح ونضغط في نفس الوقت على زر الفأرة الأيسر ونسحب شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-8.jpg

طبعا بد ما ظهرتلك حدود المربع الجديد تقدر تشيل يدك عن زر Alt

وتحطها في الركن الثاني وبتصير كذا شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-9.jpg

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

http://www.mr-des.com/sc/up/up/cut-tr-10.jpg

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

بس طبعا الطول إنت تعدل عليه يعني ما راح يتعدل أوتوماتيكيا

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

طبعا الأركان السفلية بيكون إرتفاعها كبير عشان كذا صغرها على حسب تصميمك وسوي نفس الشي للركن الثاني

إضغط على زر Alt من الكيبورد والزر الأيسر من الماوس وإنسخه وحطه في الجهة الثانية إلى ما يصير كذا
شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-11.jpg

الحين نكون كذا خلصنا من الأركان ..
إن شاء الله تكونوا فهمتوا الجزء الأول

=====================

نجي الحين لمناطق التمدد




مناطق التمدد راح تكون سهلة جدا

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

http://www.mr-des.com/sc/up/up/cut-tr-12.jpg

طبعا ما راح تشوف خطوط باهتة في التصميم بس راح يتعدل طولها أتوماتيكيا

نجي الحين لمنطقة التمدد في الأسفل
يفضل إنك تنسخها أحسن

تظغط على Alt من الكيبورد والزر الأيسر من المواس وتحركها إلى الأسفل تنزلها إلى تهاية التصميم إلى حد الصفحة
شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-13.jpg

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

http://www.mr-des.com/sc/up/up/cut-tr-14.jpg

سويها في الفوتوشوب عشان توضح أكثر

نجي الحين للخطوة الأخيرة طبعا منطقة التمدد الموجودة تحت لازم تكون مباشرة تحت منطقة التمدد الموجودة فوق عشان ما يحصل مشاكل في تركيب install الستايل style مثلا
فإيش الحل الحين

طبعا إنت تشوف الخطين الباهتين الموجوديتن أسفل خليت التمدد إللي فوق ما عليك إلا إنك تسحب المربع الموجود تحت توديه بين الخطين مباشرة
طبعا مش لازم تتعب نفسك عشان تحطها تحتها بالظبط الفوتوشوب تلقائيا راح يحطها لك بس إنت ما عليك إلا إنك تحركها بس ويفضل يكون التحريك بالماوس
أحسن من أسهم الكيبورد

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


بس ما عليك إلاإنك تعدل على إعدادات الطول فقط وبنفس الطريقة ننسخ المربع من اليمين ونحطعه في اليسار ولازم نراعي أماكنهم عشان يظبط التقطيع 100 %

هذا هو ما يتعلق بالجزء الثاني للدرس مفصل

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

http://www.mr-des.com/sc/up/up/cut-tr-15.jpg


بعد ما شفنا التصميم بعد التقطيع نجي نحفظه من قائمة ملف نختار
شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-16.jpg

بتظهرلك الشاشة التالية
شاهد الصورة

http://www.mr-des.com/sc/up/up/cut-tr-17.jpg

وبعد ما يجيلك مربع حوار حفظ الملف سوي غير الإسم إلى الإسم إللي إنت تبغاه
وعدل الخيارات إلى نفس الموجود في الصورة التالية

http://www.mr-des.com/sc/up/up/cut-tr-18.jpg

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

الحين بعد ما حفظت التصميم بيكون مقطع و وراح يتكون لك ملفين
واحد ملف HTML والثاني مجلد الصور
شاهد الصور

http://www.mr-des.com/sc/up/up/cut-tr-19.jpg


ولازم تسوي مثل الموجود في الصورة

طبعا الخيار الأول معناه (( حفظ التصميم كملف HTML ومجلد صور ))
الخيار الثاني (( حفظ التصميم صور بس بدون ملف HTML ))
الخيار الثالث (( حفظ التصميم ملف HTML بدون صور ))



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

وإذا كان في سؤال على الدرس مفصل أنا حاضر

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

تحياتي أخوكم :: دريم التصميم

إن شاء الله الدرس مفصل يكون عجبكم وإن شاء الله يكون سهل وأهدي هذا الدرس مفصل إلى حبيبي الأخ تركي الودعاني جزاه الله ألف خير على ما قدمه لبناء هذا المنتدى forum المتميز جدا
وعند نقل الدرس مفصل أرجو ذكر المصدر

::::: منتديات ديزاد باتنة :: دريم التصميم :::::



https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى