إعـــــــلان

تقليص
لا يوجد إعلان حتى الآن.

[2] دورة تصميم استايل vCard3 و تركيبه بالكامل .. تقطيع الاستايل

تقليص
هذا الموضوع مغلق.
X
X
 
  • تصفية - فلترة
  • الوقت
  • عرض
إلغاء تحديد الكل
مشاركات جديدة

  • [2] دورة تصميم استايل vCard3 و تركيبه بالكامل .. تقطيع الاستايل

    [frame="3 85"]

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

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

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

    أهلاً بكم في الحلقة الثانية من دورة تصميم استايل مكتبة الصور (البطاقات) و تركيبه بالكامل ،،،

    [DOWN]
    * روابط دروس الدورة:

    تصميم واجهة موقع أو استايل للمنتدى
    تحميل اسكربت vCard3
    الدرس الأول
    الدرس الثاني
    الدرس الثالث
    الدرس الرابع
    :bar:
    [/DOWN]

    بسم الله نبدأ :

    بعد قيامنا بتصميم الاستايل، نقوم الآن بفتح صورة الاستايل على الفوتوشوب و بالطبع الصورة بصيغة JPG كما ذكرنا في آخر الحلقة الأولى بتخزينها بهذا الامتداد .. و من ثم في منطقة الطبقات سنجد قفل على طبقة الصورة نقوم بالضغط عليه مرتين و من ثم OK .. الآن نقوم باختيار أداة التقطيع كما في الصورة :


    و قبل كل شيء نقوم بإظهار نافذة التحديدات و الأحجام عن طريق Window من الأعلى و من ثم نقوم باختيار Info و ستظهر لنا النافذة، و بعد ذلك نقوم بالضغط على علامة + في النافذة و نختار Pixels كما في الصورة :


    و أول عملية هي التحديد من الزاوية العلوية اليمنى إلى الزاوية السفلية اليمنى و من ثم نسحب إلى اليسار لتحديد الأعمدة و جزء بسيط من محتوى الواجهة (أنا طلع عندي العرض 14 بكسل على نافذة Info) كما في الصورة :


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


    بعد ذلك نقوم بتحديد البانر بالكامل كما في الصورة :


    و من ثم نقوم بتقطيع البانر إلى ستة قطع بالبدء من اليمين على التوالي إلى اليسار (و نأخذ جزء بسيط من المحتوى أيضاً) و القطع كالتالي :

    [1] القطعة العلوية اليمنى المطابقة لعرضها للعامود الأيمن
    [2] القطعة التي تليها اليمنى أيضاً
    [3] القطعة المتوسطة
    [4] جزء بسيط من التمدد
    [5] القطعة اليسرى
    [6] القطعة العلوية اليسرى المطابقة لعرضها للعامود الأيسر

    و سنجدها كما في الصورة التالية :


    و من ثم نطبق بنفس الطريقة العمل على الفوتر (الأسفل) بتحديده بالكامل و من ثم تقطيعه لستة قطع بحيث تكون مطابقة للأعلى (عند التقطيع يتم تلقائياً التحديد بمطابقة الجزء للجزء المقابل) و سنجد عملنا كما في الصورة :


    و بعد ذلك نحدد المحتوى الداخلي بالكامل كما في الصورة :


    و أخيراً نقوم بتخزين القطع بكاملها عن طريق اختيار File بالأعلى و من ثم Save for Web كما في الصورة :


    و بعد ذلك ستظهر لنا نافذة التخزين و نقوم بالضغط على زر Save في أعلى اليمين كما في الصورة :


    و أخيراً ستظهر لنا نافذة مكان تخزين مجلد الصور المقطعة و نقوم باختيار مكان التخزين و فئة التخزين (فقط صور Images Only) كما في الصورة التالية :


    و سيقوم برنامج الفوتوشوب بتخزين مجلد images في المكان المحدد و بداخله الصور جميعها، و الصور التي تهمنا عددها 14 صورة (6 للبانر تم ذكرهم، 6 للفوتر، 2 العامودان الأيمن و الأيسر) و المجلد يحتوى على 15 صورة منهم صورة المحتوى الداخلية فنقوم بحذفها فهي لا تهمنا و يصبح لدينا الصور جاهزة و عددها 14 كما ذكرت ... كما في الصورة التالية :

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

    مع أحر التمنيات لكم بالتوفيق .. انتظرونا بالحلقات القادمة
    أخوكم...AhMeD

    منقـ(مع أجمل تحية للكاتب)ـول

    [/frame]

  • #2
    شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

    تعليق


    • #3
      شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

      تعليق


      • #4
        جزاكم الله خيرا على مروركم العطر وتواصلكم الجاد

        بالتوفيق

        تعليق


        • #5
          جزاك الله خيرا اخي ابو همام وبارك الله فيك

          تعليق

          مواضيع تهمك

          تقليص

          المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 06-08-2025 الساعة 11:33 PM
          المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 06-04-2025 الساعة 05:29 PM
          المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 05-31-2025 الساعة 10:07 PM
          المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 05-30-2025 الساعة 11:48 PM
          المنتدى: التصنيع والانتاج نشرت بواسطة: HaMooooDi الوقت: 05-30-2025 الساعة 09:36 AM
          يعمل...
          X