درس انشاء أيقونة لصفحات التواصل الاجتماعي بأسهل الطرق …


الخطوة الأولى :

أنشئ ملف جديد و لتكن مقاساته   : ( 570 * 570  بكسل ) و لتكن لون الأرضية : 333236#

نتجه الى قائمة الفلاتر و نضيف فلتر الضجيج : FilterNoiseAdd Noise.

سنضيف بقعة بيضاء في منتصف الخلفية و ذلك باستخدام الفرشاة : Brush Tool(B)

نغير المود الفرشاة إلى : Soft Light   و نضع الشفافية على  50% ونقوم بالتلوين بمنتصف الملف

الخطوة الثانية :

نقوم برسم مربع بأطراف دائرية   Rounded Rectangle Shape  بمعدل زاوية التفاف 5 بكسل و نقوم بالتعديل عليه باستخدام أداة   Direct Selection Tool    U  حتى يصبح الشكل التالي قدر الامكان , و ليكن لون الشكل : 3b5997 #

نضيف للعنصر إطار خارجي stroke  و ليكن بالمواصفات التالية :

ثم نضيف ملئ تدريجي للعنصر كالتالي :

و النتيجة يجب ان تكون تقريبا كالتالي :

الخطوة الثالثة :

اضافة النقش :

نقوم بإنشاء ملف جديد بالمقاسات و المواصفات التالية وتأكد بأن تكون الخلفية شفافة :

نقوم بتقريب الصورة حتى أقصى مجال تقريب للصورة و ذلك باستخدام + + ctrl و بعد ان نصل للحد الأقصى نقوم باستخدام أداة القلم و نرسم كما في الشكل التالي

ثم نقوم بحفظها كنقش و ذلك عن طريق EditDefine Pattern  ثم نقوم باستدعاء النقش لتطبيقها على الملف كالتالي :

الخطوة الرابع:

اضافة اضاءة على التصميم:

نقوم بإنشاء طبقة فوق الشكل الأساسي و نقوم باحتوائه ضمن الطبقة السفلى عن طريق layer >create clipping mask  او عن طريق الضغط على الخط الفاصل بين الطبيقتين كما في الصورة :

نقوم بإنشاء ملئ تدريجي من الأبيض للون الشفاف و يكون المود خاصته Soft Light  و بمقدار شفافية قدره : 50 % و نلون كما في الشكل التالي تقريبا :

ثم نقوم بانشاء طبقة جديدة أيضا و نقوم بانشاء القسم الداكن من الظل بنفس الطريقة و لكن باستخدام اللون الاسود عوضا عن الأبيض :

الخطوة الخامسة :

إضافة الخط التقطع على العنصر :

نقوم برسم نفس الشكل الأساسي الذي قمنا برسمه سابقا ولكن أصغر قليلا من الشكل الأساسي كما في الشكل التالي :

باستخدام الفوتوشوب cs6 سيكون انشاء الخط المتقطع سهل جدا خصوصا مع ميزات الاطار الجديدة التي قامت شركة adobe  باضافتها وذلك من نافذة خصائص الستروك كما في الصور التالية :

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

dash : 5               Gap : 6                color :#a4b1cf

نحن بحاجة حذف الجزء العلوي من الخط المتقطع … نقوم أول بتحويل نوع الطبقة باستخدام أمر Rasterize و نستخدم أداة الممحاة لحذف الجزء العلوي و نضيف له مؤثر إضافة ظل ليضفي بعضا من الواقعية  كما في الشكل :

الخطوة السادسة :

إضافة الأيقونة الى الشريطة

بإمكانك تحميل اغلب ايقونات شبكات التواصل الاجتماعي و ذلك من خلال الضغط على الوصلة التالية :

تحميل أيقونات شبكات التواصل الجتماعي

اختر الأيقونة التي ترغب باستخدامها  و ضعها في مكانها المناسب في مثالنا سنختار شعار الفايس بوك ، ثم اضف اليها المؤثرات التالية :

الخطوة الأخيرة :

إضافة الظلال إلى الشريطة

نقوم بمضاعفة طبقة الشكل الأساسي و نقوم بتحويله الى طبقة عادية Restrize و نملؤه باللون الأسود و نضيف له قلتر الإماهة blur  كما في الصورة التالية

ثم نقوم بمسح بعض الأجزاء من الظل ليعطيها واقعية أكثر للصورة :

و نضيف القسم العلوي من الظل بطبقة مستقلة مستخدما فيها الملئ التدريجي من اللون الأسود للشفاف كما في الشكل التالي :

أتمنى أن أكون وفقت في شرح هذا الدرس

تحميل الملف النهائي

6 thoughts on “درس انشاء أيقونة لصفحات التواصل الاجتماعي بأسهل الطرق …

    • ЯǿǾмẨbabyinspirit وطبعا بتقدر تنشر الدروس لانو هدف المدونة الاول هو نشر الفائدة وتبادل الخبرات
      واهلا فيك صديق جديد من اصدقاء المدونة🙂

أضف تعليقاً

إملأ الحقول أدناه بالمعلومات المناسبة أو إضغط على إحدى الأيقونات لتسجيل الدخول:

WordPress.com Logo

أنت تعلق بإستخدام حساب WordPress.com. تسجيل خروج   / تغيير )

صورة تويتر

أنت تعلق بإستخدام حساب Twitter. تسجيل خروج   / تغيير )

Facebook photo

أنت تعلق بإستخدام حساب Facebook. تسجيل خروج   / تغيير )

Google+ photo

أنت تعلق بإستخدام حساب Google+. تسجيل خروج   / تغيير )

Connecting to %s