بحث متقدم | التسجيل
الويب العربي
  تسجيل دخول
 
   
   

  ملاحظة
الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.




الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.

عـودة للخلف   الويب العربي سوق البرمجة والتصميم تبادل خبرات التصميم

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

موضوع مغلق اضف موضوع جديد
 
خيارات الموضوع طريقة العرض
  #1  
قديم 02-10-2010, 10:22 AM
neogeni neogeni غير متصل
عضو
 
تاريخ التسجيل: Jun 2010
مشاركة: 12
مستوى تقييم العضوية: 0
neogeni is on a distinguished road
الافتراضي شرح تصميم هيدر موقع ويب مع الازرار


منتدايات جرافيكس اكديمي

GRAPHICS ACADEMY

http://neogeni.yoo7.com

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






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

الحمدلله والصلاة والسلام على رسول الله وعلى آله وصحبه أجمعين

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


بكل الحب والخير أسعد الله جميع أوقاتكم وأهلاُ بكم

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


~¤ô§§§§[ تصميم هيدر موقع ويب + ازرار ]§§§§ô¤~

مستوى الدرس ـ ـ متقدم
إصدار فوتوشوب ـ ـ CS4 - CS3 - CS2 - CS

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

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



ملاحظة: لاتتقيد بأحجام الصور أو النصوص بالشرح لأني قد أقوم بتصغيرها للتنسيق

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

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

ثم نقوم باختيار أداة الرسم البيضوية Rounded Rectangle Tool

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



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



الآن سنقوم بتطبيق المؤثرات المطلوبة على طبقة headr كما سنشاهد بالأشكال التالية

مع مراعاة الانتبـاه بشكل جيـد للإعدادات والقيـم الموضحة بكـل شكل كما هـوى موضـح

Drop Shadow



Gradient Overlay



Stroke



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



الآن نقوم بإنشاء طبقة جديدة ونطلق عليها اسم Glass لنضيف لمعة زجاجية للشكل

بعد إنشاء طبقة Glass نقوم بتحديد الشكل بطبقة headr ويتم ذلك من خلال الضغط على

مفتاح Ctrl والضغط على الطبقة بزر الماوس الأيمن مع التنويه لأن العمل على طبقة Glass

بعد عمل التحديد نقوم باختيار أداة Rectangular Marquee Tool مع اختيار الإعدادات

الموضح بالشكل التالي



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



بعد ذلك نملأ التحديد بالون الأبيض ونغير خصائص اوبتكل الطبقة لنسبة Opacity %25

وللتنويه من يجيد استخدام أدوات الرسم Pen Tool يمكنه استخدامها لعمل منحنيات جميله

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

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

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

ونقوم باختيار أداة رسم الخط الأفقي Line Tool ونقوم برسم خط افقي مستقيم بحجم PX 2

مع مراعاة الضغط على مفتاح Shift بلوحة المفاتيح أثناء رسم الخط للحصول على خط مستقيم

كما يوضح لنا الشكل المتحرك التالي



بعد ذلك نقوم بتطبيق المؤثر Outer Glow على طبقة Mile بنفس القيم والإعدادات الموضحة



من المفترض الآن أن تكون نتيجة تطبيقك مشابهة للشكل التالي



الآن نقوم بإنشاء طبقة جديدة أسفل طبقة Headr ونطلق عليها اسم Button

بعد إنشاء الطبقة نقوم باختيار أداة الرسم البيضوية Rounded Rectangle Tool

ونرسم شكل مقارب للشكل الموضح بالصورة التالية



الآن نبدأ بإضافة المؤثرات المطلوبة للزر بحسب الإعدادات والخيارات الموضحة بالأشكال التالية

Drop Shadow



Gradient Overlay



Stroke



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

أما أنا فأكتفي بهذا ودعونا نرى الترتيب النهائي للشكل ولوحة الطبقات معاً للتوضيح



وهذا شكل تطبيقي النهائي بعد توزيع الأزرار على التصميم بمايناسب تطبيقي



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

ونفسـح المجـال لكـم للإبداع والتألـق بالمسائـل الفنيـة والجماليـة للمتابعـة والابتكارات



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

وهــو معـرض للنقص والزيــادة فـإن وجدتــم فيــه ضالتكــم فالحمــد لله

وإن غير ذلك فتصدقوا على أخيـكــم بعفوكــم وصفحكــم عنــه فيما قصر

وإلى أن ألقاكــم بـموضــوع جـديــد لكــم منــي خالص الشكــر والتقـديــر


الموضوع الأصلي

http://neogeni.yoo7.com/montada-f1/topic-t510.htm





  #2  
قديم 19-11-2010, 11:32 PM
BetterHost.org BetterHost.org غير متصل
عضو
 
تاريخ التسجيل: Dec 2007
مشاركة: 62
مستوى تقييم العضوية: 17
BetterHost.org is on a distinguished road
الافتراضي

شرح رائع ، مشكور أخي

جزاك الله خيراً






التوقيع
- اسم الشركة : المجد للإستضافة وتصميم المواقع
- دومين الشركة : http://BetterHost.org
- مالك الموقع : أمجد فوزي خليل
- المقر/محل الإقامة : دمياط - مصر
- رابط الدعم الفني : http://betterhost.org/support/supporttickets.php
- رقم الهاتف : 20114545900+
  #3  
قديم 21-11-2010, 02:47 AM
الصورة الشخصية لـ ابو رجب
ابو رجب ابو رجب غير متصل
عضو
 
تاريخ التسجيل: Dec 2009
مشاركة: 127
مستوى تقييم العضوية: 15
ابو رجب is on a distinguished road
إرسال رسالة عبر MSN إلى ابو رجب
الافتراضي

مشكور فعلا علي المجهود الرائع
ولكن يفضل ان يقوم الاعضاء بالمشاركه وعمل تصاميم وعرضها هنا
ويتم النظر عليها من قبلك استاذي وتقوم بالقاء النصائح
ويكون لنا الشرف لكي نتعلم منك
وفي انتظار المزيد المتميز منك






التوقيع
أســـــم الشــــركه : مؤسسة إبتكار الدولية للتصميم والاستضافه والبرمجه.
رابـــط الشــــركه : www.eptkar.com
مجـال الشـــــركه : تصميم - استضافه - برمجه .
للاتصال بالمبيعات: ragab@eptkar.com
طــرق الاتصـــال : الهاتف الجوال (للمبيعات): 0100064587 - 002
  #4  
قديم 24-11-2010, 01:52 AM
diginew.net diginew.net غير متصل
عضو
 
تاريخ التسجيل: Mar 2008
مشاركة: 62
مستوى تقييم العضوية: 17
diginew.net is on a distinguished road
الافتراضي

جزاك الله كل خير درس مفيد جدا





  #5  
قديم 24-11-2010, 03:36 PM
وائل الغامدي وائل الغامدي غير متصل
عضو
 
تاريخ التسجيل: Sep 2010
مشاركة: 34
مستوى تقييم العضوية: 0
وائل الغامدي is on a distinguished road
الافتراضي

شرح بسيط وسهل

يعطيك العافية






التوقيع
www.waelg.com
وائل محمد الغامدي
المملكة العربية السعودية - المدينة المنورة
admin@waelg.com
من داخل السعودية ( 0544887536 ) - من خارج السعودية ( 00966544887536 )
  #6  
قديم 25-11-2010, 06:47 PM
الأمير العربي الأمير العربي غير متصل
عضو
 
تاريخ التسجيل: Nov 2010
مشاركة: 21
مستوى تقييم العضوية: 0
الأمير العربي is on a distinguished road
الافتراضي

شكراا بارك الله فيك






التوقيع
منتديات فوزي نت
للتواصل مع الاداره


موضوع مغلق




قوانين المشاركة
لا يمكنك إضافة موضوع جديد
لا يمكنك الرد على المواضيع
لا يمكنك إضافة مرفقات
لا يمكنك تعديل مشاركاتك

كود vB متاح
كود [IMG] متاح
كود HTML مغلق
إنتقل إلى

مواضيع مشابهة
الموضوع الكاتب القسم مشاركة آخر مشاركة
طلب تصميم هيدر ( للمحترفين فقط ) ابو بسام طلبات البرمجة والتصميم والتطوير 3 07-07-2010 02:40 PM
مطلوب تصميم هيدر احترافي enjooy طلبات البرمجة والتصميم والتطوير 0 08-06-2010 11:11 PM
كيف استخدم هيدر المجله ليكون هو هيدر المنتدى hazza مجتمع ديموفنف 3 06-01-2010 04:51 PM
درس تصميم هيدر جد إحترافي لموقعك byassir تطويرالمواقع 0 07-01-2007 07:45 PM
طلب تصميم هيدر متمدد al3mad طلبات البرمجة والتصميم والتطوير 8 09-12-2005 09:35 PM


جميع الأوقات بتوقيت مكة المكرمة. الساعة الآن » 07:43 AM.

Powered by vBulletin
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.


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

صحيفة متخصصة في متابعة أخبار وجديد الإنترنت العربي
والحوارات الصحفية ومعلومات تقنية متنوعة .

   
 
 

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

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