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

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


ansaralhojah
10-20-2008, 12:28 AM
السلام عليكم

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

مقدمة :

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

لم افهم قصدك كيف يكون في اطار عمل محدد ؟؟

اقصد هنا ان تصميم الاستايلات يحتوي على 4 اجزاء
1_ الهيدر
2_ الفوتر
3_ الاعمدة
4_نقاط التمدد

في بداية الموضوع قلت انك سوف تعلمنا تصميم استايل متمدد ما هو قصدك بالمتمدد ؟

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

هل يوجد مثال للاستايل الغير متمدد ؟

من خلال بحثي السريع لا على التعيين رأيت هذا المنتدى انظروا كيف انه محدد ولا يتمدد التصميم مع الصفحة كاملاُ :
http://ayaam.com/vb/

ذكرت لنا ان هناك نقاط تمدد لم توضح ما هي ؟

سوف اقوم بشرحها داخل الدرس


بعد هذه المقدمة البسيطة التي تجيب على بعض الاسئلة نبتدأ بالدرس .


قم بفتح الفوتوشوب وعمل صفحة جديدة

http://www.jannatalhusain.info/2008/uploads/982f7ab09f.jpg (http://www.jannatalhusain.info/2008/)

اعمل قياسات الصفحة 800*600 كما في الصورة

http://www.jannatalhusain.info/2008/uploads/0aba55ffd0.jpg (http://www.jannatalhusain.info/2008/)

بعد فتح الصفحة من منسق الالوان قم باختيار لون هادئ قريب من الابيض ولكن لا تجعله يميل للابيض كثيراُ لانه سوف يأذي العين :22: وكل واحد وذوقه في اختيار الالوان


http://www.jannatalhusain.info/2008/uploads/1b37ca4b4a.jpg (http://www.jannatalhusain.info/2008/)


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


http://www.jannatalhusain.info/2008/uploads/e28990de53.jpg (http://www.jannatalhusain.info/2008/)


سيكون كالتالي :

http://www.jannatalhusain.info/2008/uploads/5309f32391.jpg (http://www.jannatalhusain.info/2008/)

طبعاً هنا يجب ان تتفنن بنفسك بتصميم الاستايل وهذا تصميم على السريع فقط كمثال للشرح

http://www.jannatalhusain.info/2008/uploads/202acdb462.jpg (http://www.jannatalhusain.info/2008/)

الان سوف اقوم بشرح اقسام التصميم كما قلت لكم سابقاً ان اقسام تصميم الاستايل 4 وهي
1_ الهيدر
2_ الفوتر
3_ الاعمدة
4_نقاط التمدد

1_ الهيدر : وهو القسم الاعلى للتصميم وتستطيع التفنن باشكاله فانا هنا عملته مستطيل فتستطيع اضافة المنحنيات والزخرفات وماشابه

http://www.jannatalhusain.info/2008/uploads/0b8fbd61a8.jpg (http://www.jannatalhusain.info/2008/)

2_ الفوتر : وهو القسم الاسفل للتصميم انا تركته فارغ عادةً يوضع به حقوق المصمم او حقوق المنتدى او ما شابه

http://www.jannatalhusain.info/2008/uploads/48c497c363.jpg (http://www.jannatalhusain.info/2008/)

3_ الأعمدة : وهي التي تكون على جانب المنتدى اليمين واليسار والتي تحوي التصميم من الجانبين

http://www.jannatalhusain.info/2008/uploads/2a125888ce.jpg (http://www.jannatalhusain.info/2008/)

نقاط التمدد : سوف نقوم بشرحها في الجزء الثاني


يتبع بأذن الله بالجزء الثاني



الان احفظ عملك بصيغة psd لكي نكمل بأذن الله تعالى في الجزء الثاني


ملاحظة : اتمنى منكم تطبيق الدرس ووضع ما قد قمتم بتصميمه بالموضوع وانا جاهز لاي استفسار .



تحياتي

ام فاطمة
10-20-2008, 04:23 AM
http://up.stop55.com/upfiles/geT33375.gif (http://up.stop55.com/)


http://up.stop55.com/upfiles/Ynk59763.gif (http://up.stop55.com/)

عاشت الايادي ننتظر الدرس القادم
http://up.stop55.com/upfiles/EHf44740.gif (http://up.stop55.com/)

عاشقه اهل البيت
10-21-2008, 11:09 AM
http://up.stop55.com/upfiles/SH075092.gif

SALAM_313
10-21-2008, 11:23 PM
حياكم الله اخي الكريم انصار الحجة ومشكور كثيرا على هذه الدروس القيّمة والتي فيها الفائدة ان شاء الله ونتمنى الاستمرار فيها مع خالص التقدير