اذهب إلى المحتوى

البحث في الموقع

المحتوى عن 'فرش'.

  • ابحث بالكلمات المفتاحية

    أضف وسومًا وافصل بينها بفواصل ","
  • ابحث باسم الكاتب

نوع المحتوى


التصنيفات

  • الإدارة والقيادة
  • التخطيط وسير العمل
  • التمويل
  • فريق العمل
  • دراسة حالات
  • التعامل مع العملاء
  • التعهيد الخارجي
  • السلوك التنظيمي في المؤسسات
  • عالم الأعمال
  • التجارة والتجارة الإلكترونية
  • نصائح وإرشادات
  • مقالات ريادة أعمال عامة

التصنيفات

  • مقالات برمجة عامة
  • مقالات برمجة متقدمة
  • PHP
    • Laravel
    • ووردبريس
  • جافاسكربت
    • لغة TypeScript
    • Node.js
    • React
    • Vue.js
    • Angular
    • jQuery
    • Cordova
  • HTML
  • CSS
    • Sass
    • إطار عمل Bootstrap
  • SQL
  • لغة C#‎
    • ‎.NET
    • منصة Xamarin
  • لغة C++‎
  • لغة C
  • بايثون
    • Flask
    • Django
  • لغة روبي
    • إطار العمل Ruby on Rails
  • لغة Go
  • لغة جافا
  • لغة Kotlin
  • لغة Rust
  • برمجة أندرويد
  • لغة R
  • الذكاء الاصطناعي
  • صناعة الألعاب
  • سير العمل
    • Git
  • الأنظمة والأنظمة المدمجة

التصنيفات

  • تصميم تجربة المستخدم UX
  • تصميم واجهة المستخدم UI
  • الرسوميات
    • إنكسكيب
    • أدوبي إليستريتور
  • التصميم الجرافيكي
    • أدوبي فوتوشوب
    • أدوبي إن ديزاين
    • جيمب GIMP
    • كريتا Krita
  • التصميم ثلاثي الأبعاد
    • 3Ds Max
    • Blender
  • نصائح وإرشادات
  • مقالات تصميم عامة

التصنيفات

  • مقالات DevOps عامة
  • خوادم
    • الويب HTTP
    • البريد الإلكتروني
    • قواعد البيانات
    • DNS
    • Samba
  • الحوسبة السحابية
    • Docker
  • إدارة الإعدادات والنشر
    • Chef
    • Puppet
    • Ansible
  • لينكس
    • ريدهات (Red Hat)
  • خواديم ويندوز
  • FreeBSD
  • حماية
    • الجدران النارية
    • VPN
    • SSH
  • شبكات
    • سيسكو (Cisco)

التصنيفات

  • التسويق بالأداء
    • أدوات تحليل الزوار
  • تهيئة محركات البحث SEO
  • الشبكات الاجتماعية
  • التسويق بالبريد الالكتروني
  • التسويق الضمني
  • استسراع النمو
  • المبيعات
  • تجارب ونصائح
  • مبادئ علم التسويق

التصنيفات

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

التصنيفات

  • الإنتاجية وسير العمل
    • مايكروسوفت أوفيس
    • ليبر أوفيس
    • جوجل درايف
    • شيربوينت
    • Evernote
    • Trello
  • تطبيقات الويب
    • ووردبريس
    • ماجنتو
    • بريستاشوب
    • أوبن كارت
    • دروبال
  • الترجمة بمساعدة الحاسوب
    • omegaT
    • memoQ
    • Trados
    • Memsource
  • برامج تخطيط موارد المؤسسات ERP
    • تطبيقات أودو odoo
  • أنظمة تشغيل الحواسيب والهواتف
    • ويندوز
    • لينكس
  • مقالات عامة

التصنيفات

  • آخر التحديثات

أسئلة وأجوبة

  • الأقسام
    • أسئلة البرمجة
    • أسئلة ريادة الأعمال
    • أسئلة العمل الحر
    • أسئلة التسويق والمبيعات
    • أسئلة التصميم
    • أسئلة DevOps
    • أسئلة البرامج والتطبيقات

التصنيفات

  • كتب ريادة الأعمال
  • كتب العمل الحر
  • كتب تسويق ومبيعات
  • كتب برمجة
  • كتب تصميم
  • كتب DevOps

ابحث في

ابحث عن


تاريخ الإنشاء

  • بداية

    نهاية


آخر تحديث

  • بداية

    نهاية


رشح النتائج حسب

تاريخ الانضمام

  • بداية

    نهاية


المجموعة


النبذة الشخصية

تم العثور على 7 نتائج

  1. سنتعلّم اليوم كيفية تعديل الصور وتطبيق تأثير Threshold وقناع الطبقة بالإضافة إلى استخدام أنواع خاصة من الفرش لصناعة تصميم أنيق وإضافة النص المطلوب على التصميم. يمثّل استخدام هذه المزايا جميعًا أساسيات تعديل الصور على الفوتوشوب لصناعة البروشورات والفلايرات وحتى صور الغلاف لصفحات الفيس بوك والتويتر وغيرها. سنحتاج أولًا إلى الفكرة الأساسية التي سنبدأ من خلالها بالبحث عن المصادر للحصول على مواد التصميم، والفكرة الأساسية هنا هي تصميم صورة فتاة صغيرة تنظر نظرةً فيها تفاؤل وتطلّع بحيث سنضيف النص “التطلّع نحو مستقبل أفضل” بحيث يمكن استخدامها في مواضيع معاناة الأطفال اللذين يمرون بظروف صعبة أيًّا كانت. ولهذا سنحتاج إلى صورة الفتاة الصغيرة ذات النظرة المميزة (المصادر مذكورة في نهاية الدرس). كما سنحتاج لتطبيق تأثير ألوان التفاؤل كقناع طبقة، لذلك حصلتُ أيضًا على صورة مفعمة بالألوان الجذابة. بالإضافة إلى مجموعة مميزة من الفرش تمثّل لطخات طلاء أو حبر ويمكن الحصول عليها من الإنترنت مجانًّا. افتح الصورة باستخدام برنامج الفوتوشوب. قص جسم الفتاة من الخلفية، واختصارًا للوقت يمكنك الاطلاع على أساليب القص المختلفة التي يمكنك استخدامها من خلال درس الدليل الكامل لقص الأشياء في فوتوشوب وسنحصل على الشكل التالي بعد إتمام عملية القص. حدّد طبقة صورة الفتاة المقصوصة ثم اذهب إلى القائمة Image > Adjustments > Threshold وسنبدأ بتطبيق تأثير Threshold على الصورة. ضع القيمة 70 في خانة Threshold Level ثم انقر على OK. نحن لسنا بحاجة للمساحات البيضاء في هذا النوع من التصاميم وإنما فقط للمساحات السوداء وأفضل طريقة لتحديد هذه المساحات بدقة هي عبر خيار Color Range لذلك اذهب إلى القائمة Select > Color Range استخدم الأداة الماصة للألوان التي سيتم تفعيلها بشكل تلقائي مع هذا الخيار واختر مساحة سوداء ضمن صورة وجه الفتاة ثم ضع القيمة 128 ضمن خانة Fuzziness لتحديد أكبر قدر ممكن من اللون الأسود ضمن الصورة. اضغط على الاختصار Ctrl+J لنسخ المساحات السوداء المحددة إلى طبقة جديدة بشكل تلقائي دون الحاجة للقيام بخطوات النسخ واللصق وإنشاء الطبقات، ثم أخفِ الطبقة القديمة تاركًا الطبقة الجديدة السوداء مع الخلفية الشفافة. أنشئ طبقة جديدة بيضاء وضعها تحت طبقة وجه الفتاة لتكون خلفية التصميم الافتراضية. ألصق صورة التصميم المضلع المفعم بالألوان فوق جميع الطبقات. ثم طبّق تأثير التمويه عليه من خلال القائمة Filter > Blur > Gaussian Blur وضع القيمة 19.4 في خانة Radius. قم بتعديل حجم هذه الصورة الأخيرة عبر استخدام الاختصار Ctrl+T بحيث تغطي كامل مساحة التصميم. هذا ما ستبدو عليه صورة التصميم حتى هذه اللحظة. ولأخذ فكرة عما سيكون عليه وضع التصميم بعد تطبيق هذه الألوان على صورة الفتاة قم بالنقر بالزر الأيمن للفأرة على طبقة الألوان واختر الخيار Create Clipping Mask لتصبح هذه الطبقة طبقة قناع للطبقة التي تحتها مباشرة وهي في هذه الحالة طبقة الفتاة ذات المساحات السوداء فقط. استخدم الاختصار B لتحديد أداة الفرشاة واستخدام فرشاة بقع طلاء أو بقع حبر وابدأ باختيار لون قريب من جهة استخدامك للفرشاة وارسم بقعًا مختلفة متنوعة في كل مرة وعلى مختلف أطراف صورة الفتاة. وهذا ما سيبدو عليه شكل التصميم بعد الانتهاء من رسم البقع حول صورة الفتاة. استخدام أداة النص من خلال الاختصار T ثم اكتب العبارة التي اتقفنا عليها في بداية الدرس وهي “التطلّع نحو مستقبل أفضل” واختر خطًّا مناسبًا، أنا اخترت هنا خطًا يدويًا بحيث يتناسق مع فكرة الرسم اليدوي للوحة واسقاط بقع الألوان على اللوحة ومن ثم الكتابة بخط اليد. وأخيرًا حدّد طبقة الفتاة وطبقة الألوان المموّهة وطبقة بقع الطلاء وطبقة النص وانقر على زر Group في أسفل لوحة الطبقات لوضع جميع هذه الطبقات في مجموعة واحدة. ثم انقر بالزر الأيمن للفأرة على طبقة الألوان واختر الخيار Create Clipping Mask لتصبح هذه الطبقة طبقة قناع للمجموعة كاملة ويتم تطبيق تأثيرها على جميع الطبقات الموجودة ضمن هذه المجموعة. هذا هو الشكل النهائي للتصميم والذي يحقق الفكرة الأساسية التي تحدثنا عنها في بداية الدرس. يمكنكم القيام بالبحث عن مصادركم الخاصة والقيام بإنشاء تصاميم مشابهة تخدم أفكاركم وأهدافكم وإضافة المزيد من التأثيرات كوضع خلفية غير بيضاء جامدة و إضافة أنواع فرش مختلفة وطبقة قناع ألوان مميزة للحصول على تصاميم روعة. المصادر صورة الفتاة الصغيرة مجانية من موقع Flickr تحت الترخيص (CC BY 2.0). صورة الألوان المضلعة مجانية من موقع Wallpaper Safari. مجموعة فرش بقع الطلاء والحبر مجانية من موقع Brusheezy ولسهولة الوصول لهذه الأنواع من الفرش ابحث ضمن الموقع عن ink splatters وعن paint splatters. عملية قص صورة الفتاة الصغيرة تمت باستخدام طريقة القنوات Channel المذكورة ضمن درس الدليل الكامل لقص الأشياء في فوتوشوب.
  2. سنتعلّم اليوم تقنية جديدة من تقنيات برنامج جيمب GIMP الرائع وهو المنافس الأفضل (مفتوح المصدر) لبرنامج الفوتوشوب. هذه التقنية هي تقنية تأثير الدخان على صورة وجه شخص ما. حيث سنقوم بتجهيز الصورة الأساسية لوجه الشخص للبدء بالعمل ثم سنبدأ بإضافة مؤثرات الدخان باستخدام تقنيات قناع الطبقات وفراشي خاصة لصناعة هذا التأثير. سنحتاج أولًا إلى مواد التصميم وهي في هذه الحالة صورة وجه شخص بالإضافة إلى مجموعة فراشي الدخان. صورة الشخص يفضّل أن تكون بالأبيض والأسود، وإن لم تكنفيتوجب علينا تحويلها إلى الأبيض والأسود قبل البدء بالعمل عليها. أنا حمّلت هذه الصورة المجانية من موقع unsplash. ثم حمّلت مجموعة الفارشي الجديدة المجانية الخاصة بالدخان من موقع deviantart. ولتحميل هذه الفراشي ضمن برنامج جيمب، قبل أن تشغّل البرنامج، قم بفك ضغط الملف المضغوط الخاص بالفراشي الجديدة واستخرج منه ملف smokeBrushes_normal22.abr ثم ألصقه داخل مجلد brushes ضمن المسار التالي C:\Program Files\GIMP 2\share\gimp\2.0\brushes على اعتبار أنك نصّبت البرنامج ضمن المجلد الاقتراضي وهو C:\Program Files وباعتبار أنك تعمل على الاصدار الثاني من البرنامج. الآن ستجد عند تشغيل البرنامج مجموعة الفراشي الجديدة موجودة ضمن لوحة الفراشي. افتح برنامج جيمب الآن وأنشئ مستندًا جديدًا بحجم 640 في 400 (أو بالحجم الذي تريد). اسحب صورة الرجل العجوز إلى داخل المستند، وبما أن حجم صورة الرجل أكبر بكثير من حجم المستند الذي نعمل عليه فإن جزءًا صغيرًا من صورة الرجل ستظهر ضمن المستند. استخدم أداة الحجم وانقر على الصورة لتصغير حجمها إلى نحو 500 في 330. والآن استخدم أداة التحريك لتحريك الصورة بحيث يصبح وجه الرجل في منتصف المستند. استخدم أداة سطل الدهان لتلوين طبقة الخلفية باللون الأسود. أنشئ طبقة جديدة من خلال أيقونة إنشاء طبقة جديدة أسفل لوحة الطبقات ثم تأكّد من اختيار جعلها باللون الأبيض. انقر بالزر الأيمن للفأرة على الطبقة الجديدة البيضاء ثم اختر إضافة قناع إلى هذه الطبقة. اختر الخيار White (full opactiy) لملء قناع الطبقة باللون الأبيض. خفّف من مستوى التعتيم Opacity إلى نحو 80 لرؤية ما تحت هذه الطبقة بشكل طفيف وذلك لنتمكن من العمل على موضوع الفراشي. حدّد اللون الأسود للون المقدمة واختر أداة الفراشة ثم حدّد أحد أشكال الدخان التي حملناها مؤخرًا. ثم كبّر حجم الفراشة إلى أكثر من 200. انقر مرّة واحدة في وسط أعلى الوجه ليبدو وكأن الدخان يتصاعد منه. كرّر العملية عدّة مرات مع فراشي مختلفة من الدخان ثم اخرت فرشاة عادية ناعمة لتمكين ظهور العتاصر الأساسية من الوجه كالعين والأنف. هذا هو الشكل الذي حصلت عليه بعد القيام بالرسم باستخدام مجموعة من فراشي الدخان وبعض الضربات بالفرشاة العادية الناعمة على العناصر الأساسية. غيّر لون المقدمة إلى اللون الأبيض ثم خفّف مستوى التعتيم Opacity للفرشاة لنحو 50 ثم ارسم رسمًا أو اثنين فوق وسط الوجه ليبدو وكأن الدخان الأبيض يتصاعد من وسط الوجه. أعد مستوى التعتيم للطبقة إلى 100 حتى يظهر النتيجة التي سنحصل عليها. انقر بالزر الأيمن للفأرة على الطبقة الأخيرة واختر الخيار Apply Layer Mask لتطبيق القناع على الطبقة. حدّد طبقة صورة الرجل ثم انقر بالزر الأيمن للفأرة عليها واختر الخيار Merge Down ليتم دمج هذه الطبقة مع الطبقة التي تحتها. انقر على الطبقة العلوية ثم انقر بالزر الأيمن للفأرة ثم اختر Alpha to Selection لتحديد الجزء المرسوم للطبقة. احذف الطبقة عبر أيقونة الحذف الموجودة أسفل لوحة الطبقات. هذا ما سيبدو عليه شكل التصميم النهائي. بإمكاننا الآن وضع هذا الشكل فوق أي تصميم أو أرضية أو خلفية واستخدانها لأي غرض تصميمي. أنا استخدمت خلفية بيضاء مع بعض ألسنة الدخان من ذات نوعية الفراشي المستخدمة في هذا الدرس بلون رمادي وعبارة “خريف العمر” بلون تدرج رمادي أيضًا مع وضع طبقة النص تحت طبقة الدخان للحصول على هذا التصميم البسيط. تعلمنا في هذا الدرس كيفية إضافة فراشي جديدة إلى برنامج جيمب وكيفية استخدام هذه الفراشي مع قناع الطبقة للحصول على تأثير مميز كالدخان. المصادر: صورة الرجل العجوز من eberhard grossgasteiger مجموعة فراشي الدخان من DeviantArt لصاحبها XResch
  3. لقد أثارت إعجابي مؤخرًا أغلفة الكتب عن تلك الروايات الحركية العسكرية، مثل كتب Andy McNab ومثيلاتها. لذلك قررت القيام بتصميم مشهد الحرب المدمرة الدراماتيكية بأسلوب مشابه. اتبع الخطوات خطوة خطوة حيث سنستخدم مجموعة صور وخامات وفراشي فوتوشوب لإنتاج تصميم ضخم وقوي. التصميم الذي عملتُ عليه يضم جنديًّا يقف في شوارع حرب مانهاتن الطاحنة. العنوان "Fight for your Freedom" (حارب من أجل حريتك) يعطي تصوّرًا عن موضوع سيناريو الكتاب القصصي. بكل الأحوال منحتُ التصميم مظهر جرونجي (الجرونج هو أسلوب تصميم معروف) مع ألوان باردة والكثير من الخامات القاسية. للبدء بالعمل على مجموعة الصور علينا أولًا أن نجد المصدر المناسب لهذه الصور. لقد استخدمت المكتبة المجانية من DeviantArt من أجل الحصول على صور رائعة للجندي، وحصلت على معظم الغيوم والدخان من مجموعة freeimages.com المجانية ومجموعة ThinkStockPhotos الكاملة لباقي الصور اللازمة للتصميم. الصورة الرئيسية هي شارع مانهاتن. إن المشهد المثلج مثالي لإظهار التأثير البارد للتصميم حيث تبدو الأبنية ضبابية وهطول الثلوج يساعد على منح الشعور بحطام الأبنية الذي يصدر عنه الدخان. طبعًا لا نحتاج إلى إشارات المرور الضوئية وسط اللقطة، لذا استخدم أداة النسخ Clone tool لمسح السارية الحاملة لها. انسخ جزء من السماء المُثلِجَة وألصقه فوق الإشارات الضوئية. اضبط المستويات Levels لتُطابق درجة الألوان ثم امسح الحواف باستخدام فرشاة ناعمة لتمزج بين الجزء المُصَحّح والصورة الأصلية. سننتقل الآن إلى صورة موقع الهدم وسنبدأ برسم مسار حول كومة الأنقاض بأداة القلم Pen tool. لسنا بحاجة لأن تكون الحدود الخارجية للكومة دقيقة لأننا سنقوم بالدمج والمزج لاحقًا مع الصورة الخلفية. استخدم أداة الضبط Hue/Saturation لضبط درجة ألوان الأنقاض مع الخلفية. ومع تطبيق درجة كبيرة من عدم التشبع اللوني ستجعل الصورتين متطابقتين بالدرجة اللونية إلى أبعد درجة. احفظ وافتح صورة الجندي من مجموعة Nemesis-19 أحد أعضاء موقع DeviantArt. ارسم مسارًا بدقة حول الجندي بواسطة أداة القلم Pen tool ثم اضغط بالزر الأيمن لتحوّله إلى تحديد Make Selection. انسخ وألصق هذا التحديد في المستند الرئيسي الذي نعمل عليه. إن الإضاءة المطبّقة على الجندي والتي كانت داخل غرفة لا تتطابق مع مستويات الإضاءة الخارجية للشارع الذي نعمل عليه لذلك افتح نافذة توازن الألوان Color Balance بالضغط على CMD+B ثم اضبط مستوى Shadows و Midtones و Highlights. ولتصحيح الألوان قم بزيادة قيمة الدرجة اللونية للسماوي والأزرق. افتح نافذة المستويات Levels واضبط مستويات الإضاءة لزيادة سطوع الصورة ثم استخدم أداة Dodge tool لإضافة المزيد من السطوع على منطقة وجه الجندي. أضف طبقة قناع Mask للجندي وامسح منطقة الأحذية لمنحه انطباعًا بأنه واقف داخل كومة الأنقاض ثم لوّن بالأسود في طبقة جديدة لتمثيل الظلال تحته. غيّر خصائص المزج لطبقات الظلال إلى Soft Light و Multiply. ألصق صورة الدخان. اضبط المستويات Levels لتزيد اللون الأسود قتامة، ثم غيّر خصائص المزج إلى Screen. خصائص المزج هذه ستجعل اللون الأسود شفافًا. ألصق نسختين إضافيتين من صورة الدخان واجعل كل واحدة في موقع مختلف. سيساعد الدخان/الضباب على تمويه موقع الأقدام وتدمجها مع المحيط بشكل طبيعي أكثر. درجة ألوان الساقين باهتة جدًّا بالمقارنة مع الخلفية لذلك أضف طبقة ضبط المستويات Levels لتزيد قتامة الصورة. استخدم طبقة قناع Mask على طبقة المستويات لتحديد تأثير المستويات وجعلها تؤثر فقط على القدمين وأسفل الساقين. أضف طبقة قناع Mask لطبقة الأنقاض واستخدم فرشاة ناعمة لتمسح بدقة الحواف القاسية. هذا يساعد على دمجها مع الضباب وإخفائها في الخلفية. ألصق صورة الغيوم ثم زِد درجة الإشباع والقتامة لهذه الصورة. غيّر خصائص المزج إلى Screen ثم ضعها أسفل طبقة الأنقاض لتعطي الانطباع بأن الدخان/الضباب يخرج من سطح الركام. أضف عنوان من اختيارك إلى التصميم. وقد قمت بتعديل مقاس عرض النص هنا ليكون متساويًا لكامل النص. أضف طبقة قناع Mask لطبقة النص وابدأ باستخدام مختلف الفراشي عليها. أنا استخدمت نوعين من فرش الجرونج من موقع WeFunction وحزمة بقع الحبر من WeGraphics. ألصق خامة جرونجي كهذه الخامة من LostandTaken واضبط المستويات Levels لتضيف المزيد من التباين. وغيّر خصائص المزج لهذه الطبقة إلى Linear Burn عند 50%. املأ طبقة جديدة باللون الأزرق 43586e ثم غيّر خصائص مزجها إلى Overlay. هذا سيمنح التصميم تأثير بارد وأزرق غريب لإضافة النمط الدرامي إليه. أضف لطختين من اللون الأزرق الفاتح واضبطهما على Soft Light لإضافة بعض الاختلاف في اللون والنغمة. أضف بعض اللطخات السوداء في أنحاء متفرقة في التصميم لجعل بعض المناطق داكنة وتضيف اختلافًا آخر للألوان. واضبط هذه الطبقة على Soft Light عند 60%. لقد انتهينا من ضبط الألوان والآن اضغط CMD+A لتحديد الكل ثم اضغط CMD+Shift+C لتنسخها مندمجة. ألصق النسخة في أعلى لوحة الطبقات ثم اذهب للقائمة: Filter > Other > High Pass اضبط المزلاج حتى تصبح تفاصيل التصميم بالكاد يمكن رؤيتها من خلال الخلفية الرمادية. اضبط خصائص مزج هذه الطبقة على Linear Light واضبط opacity حتى تصبح ملائمة. من السهل ملاحظة أن high pass زادت حدّة التصميم عند المقارنة بين الاثنين. ومع ترك opacity مرتفعة بشكل مقبول فإن ذلك سيمنح التصميم مظهرًا قاسيًا. الصورة النهائية اكتملت الآن. المجموعة الأساسية للصور المختلفة تُشَكّل البنية الأساسية للتصميم، ولكنها أصبحت حيوية فعليًّا عندما بدأنا نضيف بعض الظلال اللونية والتأثيرات اللونية. الأزرق البارد والخامات القاسية هي حقيقة منحت التصميم شعور الحرب المدمرة الدراماتيكية. ترجمة -وبتصرّف- للمقال: How To Create a Dramatic Action Scene in Photoshop لصاحبه Chris Spooner.
  4. سنقوم في هذا الدرس بتصميم منظر غروب شمسي (غسق) قاتم في الأدغال باستخدام برنامج فوتوشوب. وهذه نتيجة درسنا اليوم: قبل البدء أدعوكم لتحميل الملفات المرفقة لهذا الدرس. افتح مشروعا جديدا على Photoshop بالإعدادات التالية: الأبعاد: 1900x1200pixels.الدقة: Resolution 720Dpi.نمط الألوان: Color Mode RVB8bit.باستعمال أداة الطلاء (G) نملأ الخلفية باللون البرتقالي f37c13#: نضيف طبقة لون متدرج من القائمة: Menu > Layer > New Fill Layer > Gradient نضيف بعض فرش السحاب –المرفقة في الحزمة المحملة سابقا- ونخفض قيمة شفافيتها إلى 37: من خلال أداة الأشكال المخصصة (U) نضيف شكل أشعة الشمس كما في الصورة: نفتح نافذة خصائص الدمج Blending Options: ثم إلى القائمة: Menu > Filter > blur > Gaussian blur في طبقة جديدة نضيف فرشاة دائرية: ثم من نافذة خصائص الدمج: باستعمال أداة القلم (Pen Tool (P نرسم الشكل: ثم إلى نافذة خصائص الدمج: في طبقة جديدة باستعمال الفرش التالية: نضيف بعض الأعشاب: ثم بعض الأشجار: ثم طيور وحيوانات أخرى. وهذه نتيجة درسنا اليوم: ترجمة -وبتصرّف- للدّرس: Comment créer un paysage de crépuscule avec photoshop.
  5. في هذا الدرس سأشرح لك خطوة بخطوة طريقة عمل تصميم ملصق لفضاء خارجي مظلم أطلقت عليه اسم "قمرية Lunar"، حيث سيحتوي على خامات textures وأشكال فيكتور هندسية vector لعمل تخطيط بارز يُظهر جمال القمر، بالإضافة إلى استخدامنا لتقنية ستضيف لتصميمنا نمط الخيال العلمي. سنستعين في درسنا بكلٍ من برنامج اليستريتور Illustrator وبرنامج فوتوشوب Photoshop حتى نستفيد من مزايا البرنامجين المختلفة وكذلك حتى نجمع بين نمطين مختلفين من التصميم في عمل فني واحد رائع. سنعمل على إنشاء تصميمنا عن طريق المزج بين خامة كثيفة منقطة وبين عناصر فيكتور واضحة ودقيقة لينتج لنا في النهاية ملصق يتشكل أساسا من تصميم لقمر مظلم. سنستخدم أيضا أدوات برنامج أدوبي اليستريتور المخصصة لرسم الأشكال لعمل سلسلة أشكال معقدة بطريقة سهلة، ثم سنقوم بنقلها إلى برنامج أدوبي فوتوشوب لتجميع الأعمال الفنية التي قمنا بعملها. بداية نقوم بفتح برنامج فوتوشوب Photoshop وعمل ملف جديد لتصميم الملصق، بعدها نقوم بتحميل الخامة التالية واستخدامها كخلفية: ننتقل الآن إلى برنامج أدوبي اليستريتور لعمل أول شكل من سلسلة الأشكال التي سنرسمها، نستخدم أداة شكل النجمة Star tool لرسم مثلث وذلك بوضع الرقم 3 أمام القيمة points، بعدها نضغط على المفتاحين alt+shif أثناء سحبنا للمثلث لعمل نسخة جديدة نضعها جانب المثلث الأصلي. الآن نضغط على CMD+D اختصار لـ Transform Again (لمستخدمي ويندوز CTRL+D) لعمل سلسلة من المثلثات، بعدنا ننسخ تلك السلسلة ونقوم بتدويرها بزاوية 180° ثم نضعها بشكل يتوافق مع السلسة السابقة، بإمكاننا استخدام الخطوط التوجيهية الذكية (CMD+U) لتسهيل عملية محاذاة الأشكال. نحدد جميع المثلثات ثم نسحب نسخة جديدة نضعها أسفل السلسلة الأصلية ثم نضغط على CMD+D لعمل كذا نسخة من المثلثات، وإنشاء صفحة كاملة تحتوي على أشكال المثلثات. بإمكاننا تسريع عملية ملء الصفحة بأشكال المثلثات عن طريق تحديد جزء كبير منها ومضاعفته لتوسيع مساحة الزخرفة. نضع زخرفة المثلثات في برنامج الفوتوشوب ونضغط على CMD+I لعكس الألوان وإكساب العمل الفني اللون الأبيض بعدها نضيف Layer Mask (تجده أسفل قائمة الطبقات)، ثم نقوم بمسح بعض أجزاء التصميم بطريقة عشوائية باستخدام فرشاة كبيرة ناعمة بيضاء. الخطوة التالية هي تحميل صورة الفضاء التالية المقدمة من وكالة ناسا ووضعها في الملف. بعدها نقوم بإزالة التشبع من الصورة بإتباع المسار التالي: Image > Adjustments > Desaturate ثم نغير نمط الطبقة إلى Screen. أخيرا نعدل على مستويات الطبقة باستخدام الخاصية Levels adjustments (تجدها أسفل قائمة الطبقات) وذلك لزيادة التباين. نخفض قيمة التعبئة إلى حوالي23% لإضافة خامة خفيفة على الخلفية. نعود مرة أخرى إلى برنامج ادوبي اليستريتور ونرسم دائرتين الأولى كبيرة والثانية صغيرة، نحددهما مع بعض ونتبع المسار التالي: Object > Blend > Make بعدها نعود ونغير خيارات المزج Blend Options. نضغط على القائمة المنسدلة ونختار Specified Steps ثم نغير الرقم لعمل سلسلة من الدوائر المركزية، نقوم بتوسيعها قليلا و ننسخها ثم ننقل النسخة إلى ملف الفوتوشوب. نضع سلسلة الدوائر على الثلث السفلي الأيمن من الملصق لعمل توهج ثم نغير نمط الطبقة إلى Soft Light. نضغط على CMD+J لمضاعفة سلسلة الدوائر مرتين ثم نقوم بتدوير النسختين بزاوية 90° و 180°ونتأكد من أن الدائرة الصغيرة للأشكال الثلاثة متطابقة. نختار خاصية التعديلات على مستويات الطبقات Levels adjustment layer ونزيد من تباين العمل الفني عن طريق تغميق الأجزاء السوداء والتدرجات اللونية النصفية. نقوم بتعبئة الطبقة الجديدة باللون الأسود ثم نغير نمطها إلى Multiply ونخفض قيمة الشفافية إلى حوالي 40%، سيضيف ذلك التراكب الأسود بعض التضليل على عناصر الخلفية. نقوم بلصق صورة عالية الدقة للقمر التالي على التصميم المأخوذة من موقع Wikipedia. بعدها نغير نمط الطبقة إلى Screen لجعل المساحة السوداء شفافة. نضيف تعديل جديد على مستويات الطبقة Levels adjustment layer ثم نضغط على المفتاح alt وبين الطبقات لقص القمر، بعدها نزيد من التباين في التصميم عن طريق تغميق الأجزاء المضللة وتفتيح الأجزاء المضاءة. نقوم بتجميع الدوائر الثلاثة المنفصلة ثم نضيف Layer Mask، بعدها نرسم مستطيل دائري حول القمر ونملأ ذلك الجزء باللون الأسود لمحو الدوائر من تلك المنطقة. نرجع إلى برنامج الاليستريتور ونرسم دائرة ثم نحذف النقطة الموجودة على اليسار باستخدام أداة التحديد المباشر Direct Selection tool ونتبع المسار التالي: Effect > 3D > Revolve نغير خيار السطح Surface إلى رسم هيكلي Wireframe لتحويل الدائرة إلى كرة ثلاثية الأبعاد، ثم نتبع المسار التالي: Object > Expand لتحويله إلى شكل متماسك ثم ننقله إلى برنامج الفوتوشوب. نقلب ونُكبر الشكل الهيكلي ليتناسب مع حجم القمر، ثم ننسخه وندور النسخة لتشكيل خطوط متشابكة، أخيرا نغير نمط الطبقة إلى Soft Ligh. مرة أخرى نستخدم برنامج اللاليستريتور لرسم خطوط متباعدة بشكل متساو بحيث نجل الخط الأول أطولهم أما الخط الأخير فنزيل قيمة لون stroke لجعله شفافا. نضغط على أيقونة "فرشاة جديدة New Brush" الموجودة على لوحة الفرش ثم نحدد الخيار Pattern Brush بعدها نضغط على زر موافق مع بقية الإعدادات الافتراضية. نرسم دائرة جديدة، لكن هذه المرة مع تحديد قيمة stroke فقط ثم نطبق الزخرفة الجديدة التي قمنا بعملها في الخطوة السابقة حتى نحصل على سلسلة خطوط متباعدة بانتظام حول محيطها. ننقل عناصر الفكتور إلى الفوتوشوب ونضعه حول القمر، ثم نغير لونه إلى الأبيض وكذلك نغير نمط الطبقة إلى Soft Light. ننشئ طبقة جديدة ثم نستخدم فرشاة لرش الطلاء إضافة قرص حول مساحة القمر، هدفنا هو إضافة تأثير الفرشاة على حافة القمر لكن يمكننا إضافة بعض من تأثير الرش وسط القمر أيضا. نضيف طبقة قناع Layer Mask على طبقة تأثير الفرشاة، ثم نستخدم تحديد القمر لإزالة المنطقة الوسطى، مع جعل تأثير الرش خفيفا على الحواف. تصميم القمر المظلم يظهر بشكل جيد، لكن بإمكاننا إضافة القليل من اللون الأزرق الخفيف لإظهار شكل الفضاء البارد، ثم نضيف بعض من البقع الزرقاء المشعة في طبقة جديدة ونغير نمطها إلى Overlay. نضيف بعض الأجزاء الملونة باستخدام اللون الأزرق الغامق ثم نغير نوع الطبقة إلى Overlay أيضا. ننهي عملنا الفني بإضافة نص، بالنسبة لي فقد أضفت كلمة "Lunar" واستخدمت الخط الأنيق Ostrich Sans بمقاس 100pt. نضيف النمط البسيط Outer Glow ونستخدم نفس اللون الأزرق المشع لإضفاء مظهر الخيال العلمي على النص. هذه هي النتيجة النهائية لتصميمنا حيث أضافت أشكال الفكتور قالب خيال علمي في حين نجد أن التباين الذي قمنا بتوظيفه خلال التصميم وكذلك استخدامنا للخامة ساعد على إبرازا لتصميم. اللون الأزرق الخفيف منح التصميم شعور بالفضاء الخارجي البارد. ترجمة -وبتصرف- للدرس How To Create a Dark Lunar Poster Design with PS & AI لصاحبه: Chris Spooner.
  6. تلقّيت مؤخّرًا رسالة على بريدي الإلكتروني يسألني فيها المرسل عن طريقة لرسم الحبال والعقد والتي يشيع استخدامها في التصاميم البحريّة في برنامج أدوبي الستريتور، فلمعت في رأسي فكرة استخدام فرشاة خاصّة Custom Brush في Illustrator، وبعد قليل من اللعب في البرنامج توصّلت إلى تقنيّة محكمة يمكن استخدامها لتحويل أي مسار إلى حبل متشابك ومعقّد. اتبع الخطوات التالية في هذا الدرس لتصنع حبلًا طويلًا يحتوي على بعض العقد وذلك باستخدام الفرش في Illustrator. سنتعلّم معًا كيفية إنشاء نقش فرشاة Pattern Brush خاصّ، وكيفية التغلّب على المشاكل التي تمنع الحبل من الالتفاف حول نفسه. سنخطو بعد ذلك خطوة أكبر وذلك من خلال توظيف التقنية نفسها في تصميم لوحة تيبوغرافيّة جميلة. لنبدأ بصناعة النقش الأساسي الذي سيكوّن الحبل. افتح برنامج Adobe Illustrator وارسم قَطْعًا ناقصًا ellipse على لوحة العمل. فعّل الأدلة الذكية Smart Guides بالضغط على (CTRL+U, CMD+U) ثم اضغط مفتاح ALT واسحب لمضاعفة الشكل ثم اجعله محاذيًا تمامًا للشكل الأصليّ. استخدم مؤشر الأدلة الذكيّة لجذب زاوية المستطيل إلى الجزء العلويّ الأيسر من القطع الناقص الأول، ثم اجعل المستطيل يمتدّ لينجذب إلى المسار السفليّ الأيمن من القطع الناقص الثاني. استخدم أداة المقص Scissors Tool لقصّ مسار القطعين الناقصين في النقطة التي يتقاطع فيها المستطيل معهما. حدّد واحذف النقاط السفلية واليسرى للشكل الأول، والنقاط العلوية واليمنى للشكل الثاني، للحصول على خط منحنٍ. تأكّد من تحديد شطري الخط المنحني، ثم اضغط مفتاح ALT واسحب نسخة من الشكل واجعلها محاذية للشكل الأصليّ. كرّر الخطوة السابقة عدّة مرات وذلك بالضغط على CMD+D أو CTRL+D لتحصل على قطعة صغيرة من الحبل. استخدام أداة المقصّ لقص المسار الزائد في نهاية الشكل حيث يتقاطع مع المسار اللاحق. ارسم دائرة واجعل حجمها مساويًا للحبل، واجعلها كذلك محاذية لنقطة النهاية المفتوحة. تخلصّ من الأجزاء المتداخلة مع الحبل عن طريق قصّ المسار في موضعين باستخدام أداة المقصّ. كررّ العملية في الجهة الأخرى من الحبل. يمكن استخدام نصف الدائرة هذا مرة أخرى عن طريق تدويره بزاوية 180°. ارسم تحديدًا حول جميع المسارات وزِد قيمة وزن الحدّ الخارجي Stroke. قم بتوسيع الشكل Expand من خلال الذهاب إلى: Object > Expand والضغط على OK لتحويل الحد الخارجيّ إلى شكل صلب. اختر التوحيد Unite من لوحة Pathfinder لمزج جميع الأجزاء المفردة في شكل واحد. اختر أداة التلوين الحيّ Live Paint واضغط على الحبل لتفعيل الأداة، ثم اختر اللون الأبيض للتعبئة وطبّقه على جميع المساحات المغلقة. وسّع الشكل مرة أخرى لتحويل العناصر ذات التلوين الحيّ إلى عناصر قابلة للتحرير. اضغط ALT واسحب الشكل بوساطة أداة التحديد Selection Tool لتصنع نسختين أخريين من الشكل. ارسم مستطيلًا بدون لون للتعبئة أو للحدّ الخارجي وحاذه بين قطعتين من نقش الحبل على الشكل الأول. استخدم الزاوية كمرجع لنقاط البداية والنهاية. ارسم مستطيلًا مشابهًا للمستطيل السابق على الشكل الثاني وأحط به نهاية الحبل واجعله يمتد على نفس النقاط المرجعيّة. ارسم مستطيلًا ثالثًا حول النهاية الأخرى للحبل على الشكل الثالث، وحاذه على نفس النقاط المرجعيّة على قطع الحبل بطريقة يصبح النقش فيها متطابقًا بالكامل. اختر كل قطعة من الحبل بالإضافة إلى المستطيل المحيط بتلك القطعة، ثم اختر خيار القصّ Crop من لوحة Pathfinder لقص الشكل بحجم المستطيل. اسحب القطع الثلاثة المتكونة إلى لوحة Swatches. افتح لوحة الفُرش Brushes واضغط على أيقونة (جديد New) وأنشئ فرشاة جديدة. اختر فرشاة النقش Pattern Brush. سنحتاج الآن إلى تغيير إعدادات فرشاة النقش باستخدام القطع الثلاثة التي صنعناها مسبقًا، وذلك من خلال وضعها في المربعات الصحيحة ضمن إعدادت الفرشاة. اختر القطعة الوسطى في القائمة المنسدلة الثانية، واختر القطع الطرفية للقائمتين المنسدلتين الأخريين. ارسم مسارًا باستخدام أداة القلم Pen Tool ثم طبّق الفرشاة الجديدة عليه لاختبارها. يمكن استخدام هذه الفرشاة بتطبيقها على أي مسار، ويمكن استخدام أداة قلم الرصاص Pencil Tool لرسم عقدة ثم تطبيق هذه الفرشاة عليها وتحويلها إلى حبل. ولكن انتظر هناك مشكلةلتمثيل العقدة بصورة صحيحة يجب على الحبل أن يشق طريقه من الداخل إلى الخارج أو بالعكس، ولكن المسار في Illustrator يتراكب حول نفسه فقط. من المؤسف أن لا يتيح Illustrator إمكانية تغيير تراتبية النقاط المفردة فوق بعضها البعض، الطريقة القديمة تقتضي أن يتم قصّ المسار إلى قطع منفصلة يمكن وضعها أعلى أو أسفل القطع الأخرى. لسوء الحظّ هذه الطريقة لن تنفعنا أبدًا، لأنّ القطع النهائية ستتولّد بشكل تلقائي عند قصّ المسار، وهذا سيقطع انسيابية الحبل. نعود إلى لوحة العملأنشئ فرشاة نقش جديدة، ولكن هذه المرة اختر القطعة الوسطى فقط. طبّق هذه الفرشاة على مسار العقدة. سيسمح لنا قصّ المسار باستخدام أداة المقصّ أن نضع المسار أعلى أو أسفل المسارات الأخرى مع المحافظة على انسيابية الحبل الكاملة. قُصّ المسار قبل وبعد كل مساحة يتراكب الحبل فيها، ثم استخدم الاختصارات CMD+} أو CTRL+} أو CMD+{ أو CTRL+{ لتغيير تراتبية القطع المقصوصة فوق بعضها البعض. قمنا بحلّ مشكلة التراكب، ولكن ظهرت مشكلة أخرى وهي عدم وجود أي قطعة نهائية للحبل، سنعمل على حلّ هذه المشكلة باستخدام فرشاة نقش أخرى. طبّق القطعة الوسطى كالمعتاد، ولكن هذه المرّة اختر القطعة التي ترتبط بمربع البداية. كرّر هذه الخطوة على فرشاة أخرى، ولكن استخدم القطعة الأخرى لمربع النهاية. يمكن الآن تطبيق الفرشاتين الجديدتين على كل من قطعتي البداية والنهاية لمسار الحبل، وبما أن لكل من هاتين الفرشاتين مربعًا واحدًا في أحد الطرفين، فإن النقش سيتطابق في جميع الأحوال. باستخدام مزيج من الأنواع الثلاثة من الفرشاة يمكن إنشاء أيّ نوع من المسارات مهما كان معقّدًا. لنخط خطوة أبعدإحدى الاستخدامات الذكية لفرشاة الحبل الجديدة هي إنشاء لوحة تيبوغرافية جميلة. استخدم أداة القلم الرصاص لرسم بعض الكلمات على لوح العمل. تذكر، يمكنك استخدام النقر المزدوج لتغيير إعدادات الأداة ولتحرير المسارات المحدّدة، لتتمكن من إعادة الرسم وتصحيح الأخطاء. استخدم أداة المقصّ لقصّ المسار وتعديل تراتبية المسارات فوق بعضها البعض لجعل الحبل يلتفّ فوق أو تحت القطع الأخرى. انتقل إلى برنامج Photoshop وألصق اللوحة التيبوغرافية على خلفيّة جميلة لإضافة بعض اللمسات النهائية إلى التصميم. أضف لونًا إلى الحبل بواسطة Color Overlay مع نمط مزج Multiply، ثم اختر نمط المزج Screen للطبقة لتصبح المناطق البيضاء مرئية فقط. أضف قناع طبقة Layer Mask إلى طبقة الكتابة واستخدم فرش فوتوشوب لمسح بعض الأجزاء من النص ولتضفي على الحبل مظهرًا يوحي بالقِدَم. مع أنّ فكرة الدرس تتمحور حول الحبال والعقد، إلا أنّه يمكن استخدام هذه التقنية لتصميم الأسلاك والأفاعي وحتى زينة الاحتفالات. ترجمة -وبتصرّف- للمقال How To Create Ropes & Knots with Illustrator Brushes لصاحبه Chris Spooner.
  7. سيكون هذا هو الدرس الأول من أصل درسين سنقوم من خلالهما بتصميم وتكويد واجهة موقع لغابة افتراضية اسمها "Pinewood Forest". سنستخدم في تصميم هذه الواجهة العديد من textures وخليط من اللونين الأزرق والرمادي. ستكون النتيجة النهائية كما في الصورة التالية: سيكون الهدف من هذا الموقع هو تعريف الزوار بهذه الغابة وما تقدمه وإعلامهم بالأحداث القادمة، وستحتوي خلفية الموقع على صورة كبيرة ثابتة لتسمح بتمرير (scroll) محتوى الموقع فوقها، كما سيتم تقسيم محتوى الموقع إلى عدة أجزاء رئيسية مع استخدام بعض الصور الفوتوغرافية لجذب انتباه الزائر. سنقوم في هذا الدرس بتصميم الواجهة الرئيسية للموقع باستخدام برنامج الفوتوشوب، أمّا في الدرس الثاني فسنقوم بتكويد التصميم باستخدام لغتي HTML وCSS. سنبدأ أولًا بإنشاء مستند جديد، وبما أنّ التصميم سيحتوي على صورة خلفية كبيرة فإننا سنحتاج إلى إنشاء مستند يستطيع استيعاب الشاشات ذات الدّقة والأبعاد الكبيرة (24 أو 27 انش). باستخدام أداة marquee قم برسم منطقة في منتصف الصفحة بعرض 960px وقم بوضع guides على طرفي ما قمت برسمه. ستكون هذه المنطقة هي المنطقة التي سوف تحتوي على المحتوى الرئيسي للموقع. قم بتحميل صورة ذات أبعاد كبيرة يمكنها تغطية معظم الصفحة (يمكنك تحميل الصورة التي استعملتها في هذا الدرس من هنا). قم الآن بإدراج هذه الصورة في المستند وقم بتعديل أبعادها لتتناسب مع الشاشات الكبيرة (لنقل 1920px) واجعل هناك هامش بسيط على كلا الجانبين، ثم ضع guide أسفل الصورة ليصبح كل شيء كما في الصورة التالية: قم الآن بإضافة Layer Mask للصورة واستعمل بعضًا من الفرش المائية (Watercolor brushes) لإبهات الأطراف. قم بتخفيف شفافية (opacity) الفُرش لإنشاء مظهر أجمل لتصبح الصورة وكأنها متداخلة مع الخلفية: قم باستعمال خطّي League Gothic وClarendon لإنشاء الشّعار الخاص بالموقع وقم بوضعه في منتصف الصفحة. قم بتعديل حجم الخطوط حتى يكون التركيز أكبر على كلمة "Pinewood" وقم بمحاذاة الكلمتين عن طريق زيادة المسافة بين الحروف (the tracking) في كلمة "forest". سيكون الشعار مشابهًا للصورة: قم بإضافة تأثيري Drop Shadow وGradient Overlay لكلمة "Pinewood". سوف يضفي كلا التأثيرين نوعًا من العمق على الشعار وسيجعلانه بارزًا أكثر في الصفحة. حاول أن تجعل التباين (contrast) قليل بين تأثير الـgradient وشفافية الظل (shadow) حتى يظهر بشكل أفضل: قم بإضافة/كتابة عناصر القائمة الرئيسية وقم بتوزيعاها على التساوي على كلا جانبي الشّعار. يمكنك استعمال خط Georgia كخط بديل عن Clarendon الذي استعملناه في الشّعار. يمكن تنفيذ التباعد بين حروف الكلمات (tracking) باستعمال الخاصية letter-spacing الموجودة في لغة CSS وهو ما سنفعله لاحقًا في الدرس القادم. قم برسم مستطيل كبير بين الـguides ذات العرض 960px التي وضعناها في خطوة سابقة وقم بملء هذا المستطيل بلون رمادي فاتح كاللون المستعمل في تأثير gradient الخاص بالشّعار: قم بإضافة Noise خفيف عن طريق الذهاب إلى: Filter > Noise > Add Noise ولتكن القيمة 2.5% لإعطاء نوع من الجمال الحسي على منطقة المحتوى في الموقع. اضغط على زر ctrl في لوحة المفاتيح وأبق يدك على هذا الزر وبعدها اضغط بزر الفأرة الأيسر على الصورة المصغرة (thumbnail) للطّبقة (layer) التي أنشأناها في الخطوة السابقة. ستلاحظ أنه تم اختيار المنطقة الخاصة بتلك الطبقة. قم الآن بالضغط بزر الفأرة الأيمن على ما تمّ اختياره واختر Transform Selection ثم قم بتقليص الطول والعرض بنسبة 40px واملأ تلك المنطقة باللون الأبيض، بعدها قم بإضافة تأثير Drop Shadow على تلك الطبقة: قم بتحميل فرش paint roller واستعملها في جعل الحواف الرمادية خشنة نوعًا ما وذلك عن طريق الرسم على قناع الطبقة (layer mask). فعّل التحديد (selection) الخاص بالمنطقة البيضاء واملأها باللون الأسود فوق قناع الطبقة (layer mask) لجعلها شفافة ثم بعد ذلك قم بإنقاص شفافية الحواف الرمادية إلى 60% حتى تظهر الخلفية التي وراءها: قم بتحميل صورة ما لوضعها كخلفية للمنطقة البارزة (main feature area) في الصفحة، ثم باستخدام أداة marquee selection قم برسم مستطيل كما ها موضح في الصورة أعلاه، بعد ذلك اضغط بزر الفأرة الأيمن على تلك المنطقة واختر Select Inverse ثم اضغط على زر delete من لوحة المفاتيح: يمكنك ملاحظة أن ألوان الصورة لا تتناسب كثيرًا مع الموقع، لذلك سنقوم ببعض التعديلات باستخدام أداة Curves. قم بتعديل قنوات اللونين الأخضر والأحمر على شكل يشبه حرف S واللون الأزرق على شكل حرف S ولكن معكوس كما هو موضح في الصورة: قم بتقليل تشبّع (saturation) الصورة لتخفيف حدّة الألوان. ستظهر ألوان هذه الصورة بعد التعديلات بشكل يتلائم مع ألوان التصميم: استعمل واحدة من فرش paint roller التي قمت بتحميلها سابقًا واستعملها لرسم خلفية لوضع بعض النصوص فوقها كما تظهر الصورة: قم بتعديل حجم وتباعد الحروف الخاصة بنص العنوان لإضفاء بعض الجمال، بعد ذلك اجعل حجم الخط للفقرة 14px: عليك الآن باستعمال نفس التأثيرات المستعملة في الشّعار (Gradient Overlay و Drop Shadow) وتطبيقها على النص الذي كتبته للتو: سنحتاج الآن إلى إضافة زر call to action لإخبار الزّوار إلى أين يمكنهم ان يتوجهوا بعد تصفحهم للصفحة الرئيسية. لفعل ذلك قم برسم مستطيل بحجم مناسب واملأه بلون أزرق متوافق مع اللون العام للموقع، ثم قم بإضافة فلتر noise خفيف لتخشين الزر قليلًا. بعد ذلك استعمل أداة المسح (Eraser tool) واختر pencil بعرض 1px وقم بمسح جزء من كل طرف من الأطراف الأربعة للزر. أنظر الصورة التالية: قم بإضافة تأثير Inner Glow للزر واستعمل لون أزرق أدكن بقليل من لون الزر نفسه. لتكن الإعدادات عبارة عن Normal blending mode وشفافية (opacity) بنسبة 100% وقم بتعديل الأحجام حتى تصبح ملائمة. قم أيضًا بإعطاء الزر إطار(stroke) بحجم 1px باستعمال لون أرزق أفتح بقليل من لون الزر: ويتبقى في الآخر إعطاء نص مُعبّر لوضعه على الزر، وتأكّد أيضًا أن جميع عناصر المنطقة البارزة (feature area) مرتّبة بشكل مناسب وأنيق: قم الآن بتعبئة منطقة المحتوى بالنصوص التي تريدها، واجعل حجم خط العنوان أكبر بقليل واجعله يتمدد على عرض الصفحة بالكامل. افصل النص المتبقي إلى عمودين؛ واحد عريض للمحتوى الرئيسي والآخر بعرض أصغر للمحتوى الجانبي (sidebar). يجب علينا أيضًا أن نميّز الروابط بلون مختلف عن باقي النص، لذلك قم بتلوين بعض الكلمات بلون أزرق واجلعها تحتوي على خط أسفلها (underline). في جزء المحتوى الجانبي (sidebar) سيكون هناك ثلاث مناطق تؤدي إلى مناطق أخرى في الموقع، بحيث تحتوي كل واحدة من هناك المناطق على صورة، عنوان وفقرة قصيرة. قم بإضافة خلفية مزخرفة وذلك باستعمال paint roller brushes وقم بعد ذلك بقص صورة خارطة ووضعها داخلها: استعمل paint roller brushes لإنشاء خلفية أخرى بلون أزرق أدكن بقليل من اللون الذي استعملته في الخطوة السابقة وستكون هذه الخلفية هي المكان الذي سيحتوي على العنوان الخاص بكل منطقة. لا تنسى قص الأجزاء المتداخلة لتتوافق مع طرف الصورة. قم بإضافة عنوان قصير فوق الخلفية التي أنشأناها في الخطوة السابقة وقم بإعطاءه نفس التأثيرات المستعملة في النص الموجود في الـfeature section: قم بوضع كل العناصر التي أنشأناها إلى الآن في مجلد واحد وبعد ذلك قم بنسخ ذلك المجلد مرتين وقم بالتعديل على عناصر كل مجلد بالشكل المناسب. أنظر الصورة: سوف نضيف الآن قسم "Upcoming events" أسفل النص الموجود في العمود الرئيسي. قم باستعمال نفس تنسيقات الخطوط الموجودة في الترويسة وباقي المحتوى الرئيسي، وبعدها قم بإنشاء جزء خاص بالتاريخ واستعمل لون رمادي مشابه للإطار(border): كل حدث سيحتوي على التاريخ، عنوان، بعض المعلومات ووصف بسيط: يمكننا الآن التخطيط لكيفية تحويل هذا التصميم إلى ملف HTML وهذا ما سنفعله في الدرس القادم بإذن الله. وبهذا نكون قد وصلنا إلى نهاية المقال، وأصبح لدينا تصميم جاهز يمكننا تحويله إلى صفحة ثابتة باستعمال لغتي HTML وCSS. ترجمة -وبتصرّف- للمقال Design a Textured Outdoors Website in Photoshop لصاحبه Iggy.
×
×
  • أضف...