النتائج 1 إلى 1 من 1
  1. #1
    :: + عضو شرف + :: الرتبةالرتبةالرتبةالرتبة Array الصورة الرمزية vista-design
    تاريخ التسجيل
    04-05-2008
    الدولة
    EGYPT
    المشاركات
    1,623
    معدل تقييم المستوى
    10

    الدرس الثانى: درس تصميم الهيدر والفوتر وتقطيعـــه

    الدرس الثانى: درس تصميم الهيدر والفوتر وتقطيعـــة




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

    نعود معكم من جديد ونبدأ الشغل الجد

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


    يلا بينا..........

    اولا : نقتح عمل جديد بمقاسات 777 x 666

    شوف



    ثم نقوم بأختيار اللون اللى راح نرسم بيه كلا من الهيدر والفوتر ( الكحلى)
    شوف.....ولاحظ رقم اللون



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



    ملحوظه: ( اضغط ctrl+' حتى يتقسم العمل الى مربعات) -- او من view فوق ثم show ثم grid

    الحين احفظ الصورة اليسرى لمطور على جهازك وقم باستيرادها على الفوتوشوب
    file ثم open



    بعدين نختار بأداة التحديد المنقطة الجزء الاوسط ما عدا الاجزاء العلوية والسفلية
    ثم نضغط ctrl +c للنسخ

    شوف.......



    ثم نروح للعمل اللى احنا شغالين عليه وبعدين اضغط ctrl+v للصق الصورة فى العمل

    شوف.....




    نختار بأداة التحريك ونحرك الصورة لليسار كما بالصورة...

    شوف....




    باستخدام اداة الاشكال ,نرسم مستطيل سفلى واخر علوى
    شوف.......



    نقوم بتطبيق الكلام السابق بالظبط على الصورة اليمنى

    احفظها على جهازه وسوى مثل السابق

    شوف.....






    شوف.....









    نأتى الان لكى نزيل حواف الصورة حتى يكون شكل الهيدر حلو


    راح نستخدم اداة الممحاة بتركيز 45

    شوف.......






    شوف.....



    بهيك نكون سوينا الهيدر بكل خفة وبساطة




    ثانيا: تصميم الفوتر

    وراح نرسمه بسيط

    شوف.......



    الحين انتهينا من التصميم.....



    ننتقل لمرحلة التقطيع

    اولا: قواعد أساسية قبل ان نكمل:

    1-يجب وانت بتقطع لازم تكون الاطوال نفس الشىء
    2-يجب ان تكون نقطة التمدد منطقة صافية ما فيها شىء

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



    شوف الهيدر بما انه صورتين , صورة يسار وصورة يمين
    راح نقوم بتقسيمة كالاتى:

    1-جزء ايسر
    2-جزء اوسط (نقطة التمدد)
    3-جزء أيمن

    شوف الصورة.....



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

    شوف.......







    بهيك نكون انتهينا من التقطيع



    الحين راح نحفظ عملنا


    اضغط

    file

    ثم

    save for web


    ثم شوف الصورة......





    شوف.....





    بهيك يكون انتهى الدرس الاول....


    نرجو من جميع الاعضاء تطبيق الدرس حتى نرى شغل كل عضو
    ونعطى التوجيه المناسب

    ولن يتم الدخول فى الدرس الثلث الا بعد ان يتم مناقشة الدرس الثانى





    أتمنى يكون عجبكم

    أخوكم vista-design

    انتظروا الدرس الثانى

    التوزيع على الفرونت بيج

    التعديل الأخير تم بواسطة vista-design ; 18-07-2008 الساعة 12:39 AM
    عالم مطورى الويب لتعليم برمجة وتصميم المواقع
    www.advphp.com

    ----------------
    اول برمجياتى,اسكربت AraDown العملاق لاشهار المواقع وزيادة دخلك من ادسنس

    http://aradown.info

المواضيع المتشابهه

  1. دروس تصميم استايلات منتديات، (إضافة للدرس الثانى ) تعلم فنون التقطــيع وشرح الدرس الثانى
    بواسطة vista-design في المنتدى دورة تصميم ستايلات منتديات الفي بي vBulletin
    مشاركات: 58
    آخر مشاركة: 25-07-2011, 08:58 AM
  2. الدرس الاول من دوره توزيع الوجهات توزيع الهيدر والفوتر
    بواسطة قناص جوبا في المنتدى لغات برمجة مواقع PHP, ASP, Java Script, Perl
    مشاركات: 5
    آخر مشاركة: 13-07-2011, 02:22 PM
  3. مشكلة في الهيدر والفوتر ونقاط تمددهم
    بواسطة photoshop girl في المنتدى دعم فني ، و صيانة المنتديات مجاناً
    مشاركات: 5
    آخر مشاركة: 19-11-2010, 03:08 PM
  4. [joomla4] شرح تصميم الهيدر والفوتر للقالب والتعديل عليه
    بواسطة vista-design في المنتدى دورة تصميم المجلات الإلكترونية
    مشاركات: 1
    آخر مشاركة: 17-08-2009, 04:13 PM

الكلمات الدلالية لهذا الموضوع

ضوابط المشاركة

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