[درس] : تصميم واجهة موقع احترافيه

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

كيف حالكم اخواني الأعزاء

اليوم بفضل وحمد الله تم الانتهاء من هذا الدرس

وهو درس تصميم واجهه أحترافيه

واتمنى ان الجميع أنشالله يستفيدون منه

وهذا الدرس انا مصممه بالتفصيل الممل وبالصور

ونقول بسم الله

::+:+:+:+::

طبعا أفتح برنامج الفوتوشب ( انا استخدم Adobe Photoshop 7.0 ME )


1 - افتح ملف << جديد : file << new



2 - حط المقاسات الطول 777 والعرض 600 كما بالصوره



3 - أختر الألوان الي تعجبك بالنسبه لي انا اخترت اللون الأزرق



4 - اختر اداه التعبئة وعب الخلفيه باللون الي انت مختاره



5 - اضغط Alt + H وستظهر لك شبكة بالواجهه كما في الصوره



6 - اختر اداة المربع علشان نسوي البنر



7 - الحين نحط مربع علي حسب الارقام الي موجود 10 مربعات
الارقام انا كاتبهم يعني انت لا تسوي نفسي بس انا حطيتهم علشان تعرف العدد



8 - نختار فلتر Wave



9 - الان تحط القياسات والمجموعات نفس الي بالصوره



10 - الان طلع الشكل نفس جذي ومخربط البنر



11 - علشان نعدل البنر ونعدله اضغط حرف V من الكيبورد
واضغط السهم فوق لين توصل المربع العاشر ويطلع لك الشكل هكذا



12 - نروح الحين نحدد لير البنر ونضغط الاف الي تحت انا
محددها بالاحمر ونختار اول دقمه ...



راح يعلق البرنامج شوي يعني لا تستعجل

13 - تطلع لنا هالنافذه الجديده ونضغط على اول اسم لها
بس دير بالك خل كل المربعات فاضيه بس المربع الاول حط صح
وعدل الارقام والقياسات نفس الصوره طبعا اللون
الي انا حاط مربع عليه انت علي كيفك بس يكون قريب
للون حق البنر والخلفيه ... ونضغط موافق



راح تلقى البنر الحين له ظل من تحت الحين باقي نحط فيه صور

14 - نضغط ملف << فتح | FILE <<< Open



15 - الحين نختار صوره لنضيفها مع البنر



16 - نسحب الصوره الحين الي البنر ونخليها فوق وعاد كيفك يمين ولا يسار
بس المهم فوق اول شي



17 - نضغط الحين Alt + t ونكبر الصوره شوي اذا كانت صغيره
ونضغط الحين Alt + G تلقى الصوره اندمجت مع البنرالحين
نعدل الخيارات الي باللير ونخليها نفس الي بالصوره



18 - الحين تلقى الواجهه صارت نفس هذي الصوره



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



20 - الحين نحط صورة مثلا صورة ورد او اي شي بين الصورتين
مثل جذي



21 - ونختار الفلتر التالي نفس الي بالصور



22 - الحين خلاص خلصنا من البنر كله بس باقي له كم لمسه ابداع
واسم الموقع والرابط وبسسسسس وهذا الشكل للبنر



23 - الحين باقي الفوتر الي هو اخر شي بالموقع نسويه نفس طريقه البنر
من فلاتر بس تغير الصور وتسوي نفس الخطوات وراح يطلع لك رووووعه
وهذي صوره للفوتر بعد ماخصلت منه انا



24 - الحين باقي بس الازرار وهي الحين عليكم
والي مايعرف
بالمرفقات تلقى ملف افتحه وتلقاه ازرار مصممه وجاهزه
الي عليك بس انك تغير اللون مالها
والطريقه تغير اللون هي انك تضغط Alt + u
وتغير براحتك وتكتب بالأزرار

والي ماتطلع عنده الصور بالملف المرفق فيه كل الصور

واتمنى من كل واحد يدخل انه يوريني تطبيقه

واي شي ناقص او استسفار لا تتردد في طرحه

وعاد لا تنسوني من ترشيحكم

وفي انتضار ردودكم

الصور المرفقة

ازرار.psd (92.7 كيلوبايت, عدد مرات المشاهدة 3880 مرة)

الملفات المرفقة

drs.zip (349.5 كيلوبايت, عدد مرات المشاهدة 6845 مرة)