/Photoshop Guide

Photoshop Guide

يعد برنامج الفوتوشوب هو الراعي الأساسي لكل الــ Designers لذلك من المهم مراعاة التنظيم أثناء العمل اليكم في هذا المقال نصائح للثلاث مراحل اساسية في التصميم لتسهل عليك عملية استراجاع المعلومات وتنظيم عملك.

مرحلة ماقبل الديزاين :

  • وتبدأ بتجميع كل المعلومات وتنزيل الخط المستخدم والصور الخ.. في Folder بأسم المشروع الذي تعمل عليه ثم تقسيمه الى Folders  به كل الصور ،الخطوط….. المستخدم في المشروع.

Folders (Fonts,Images,JQ,Brushes…etc)

  • من الأمور المهمة والتي تساعدك على إنجاز مهامك بسرعه هو حفظ اختصارات مفاتيح الأوامر في الــ P.S بدلاَ من التحرك لأختيار الأمر  اليكم صورة لبعض هذه الاختصارات.

Phlearn-Photoshop-Keyboard-Shortcuts2


مرحلة الديزاين:

تنقسم مرحلة الديزاين الى5 اقسام مهمه تبعا للاهم المستخدم في الفوتوشوب.

Psd Files

  • من الطبيعي جدا عمل عدة Demos لمشروع واحد حتى يتم اختيار الافضل بينهم المشكله هنا انه إن لم يتم تسمية الــDemos بصورة صحيحة سيتم خلط الاعمال مع بعض لذالك يراعي تسميه كل Demo عن طريق اضافة رقم لاسم الصفحة او الــProject الذي تعمل عليه ويفضل تجميعهم في Folder  يسمى Demos مثلا.

names

  • عمل Copy كل فترة بعد الانتهاء من بعض التعديلات لانه قد يرجع العميل في رأيه ويطلب آخر تعديل وهذا يعد من الأمور المزعجة جدا 😀 ..لذلك تجنب ان تعيد أي تعديل واحفظ كل التعديلات في Folder واحد يسمى Edits مثلا.

Layers

  • غير أسماء الــ Layers على حسب استخدامها لكي تسهل عليك معرفه استخدام وموقع كل Layer .

layers

  • من أحد المميزات في الفوتوشوب هي امكانية تقسم الــ Layers في Groups أو Folders وإعادة تسميتها مما يسهل تقسيم وترتيب العمل وتسهيل الوصول اليه ايضاً.colors
  • من الرائع جدا وجود هذا المنظر في الديزاين وتعيين ألوان لكل نوع من الملفات المستخدمه .

Images

  • حاول الأبتعاد عن عمل Rasterize أو Flatten لأي Vector Shape وإذا كان لابد فأحفظ نسخه من الشكل قبل عمل الــ Flatten .

 

  • من المهم جدا والذي يؤثر على شكل الــPixels هو عمل Snap to Pixels لانه عند عمل Zoom in بشكل كبير تظهر بعض التشوهات في الشكل وعدم امتلاء اخر Pixel باللون خاصه في الاشكال ال Rounded.

snap

  • الاهتمام بجودة الصور وال Icons المستخدمه والابتعاد عن Google Search في البحث عن الايكونات لانها تكون ذات جوده منخفضه إليكم بعض المواقع للأيكونات الــ Vector .

Flaticon  , Iconfinder

Text

font

  • Don’t stretch إذا اردت تغيير حجم الخط فابتعد تماماً عن تكبير الخط بالــ Transform وإنما ضف في قيمته .
  • استخدم كل الــ Pixels في الخط ولا تترك قيمته بهذا الشكل 16.98pt.
  • اختيار الخط من المعايير المهمه جدا في جودة العمل لذالك عليك بالــ Webfonts  (يوجد Plugin خاص بال Webfont ).
  • حاول ان تستخدم الــ Text Boxes على نفس حجم الــ Text لكي تحدد مكان الــ Text لانه عندما يوجد عدة Text Boxes ولا تكون على نفس حجم الخط  قد تضغط على احدهم فيتحدد Text Box آخر .

 

Effects

  • انتبه إلى موضع كل Pixel في التصميم لا تترك هذا اللون الشفاف لان ذلك يعني ان هذا الضلع بين 2Pixels  وهذا قد يؤثر على احجام باقي الديزاين وشكله لذالك راعي ان تكون كل الضلوع على  Pixel محدده  وليس بينهم ,كل Pixel في الديزاين مهمه جدا .

guide3guide3

  • عند عمل Vector Shapes  وتريد تغيير لونه لا تستخدم الــ Color Overlay Effect أنت لا تحتاجه , فقط غيره عن طريق الضغط على الــ Color Thumbnails ,واستخدم الــ Color Overlay في حالة وجود صور.
  • مراعاة الــ Smoothing في ال Gradient  لكي يأتي بالغرض المطلوب .
  • الــ Stroke Inside Effect   يأخذ من حجم وطول الشكل لذالك من الأفضل استخدام ال Outside .

 


 

مرحلة ما بعد الديزاين:

  • مسح الــImages,Fonts,Layers  .. الغير مستخدمه في المشروع لتقليل مساحة الملف وتجنب التضارب بينها وبين باقي المستخدم.
  • احفظ الصور عن طريق اختيار Save for Web & Devices بدلاً من اختيار Save As تجنباً لمشاكل الالوان وحجم الملف.

دمتم بخير

[divider scroll_text=””]