شرح أيقونة وسام أو شعار بطريقة إحترافية abc4web Award Icon

[abohmam]

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

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

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

:PS:

شرح أيقونة وسام أو شعار بطريقة إحترافية abc4web Award Icon

http://www.abc4web.net/uploaded/1_11332270115.jpg (http://www.abc4web.net/vb)

:photoshop:

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

حياكم الله جميعا إخوانى

نعود من جديد لشرح بعض الدروس الهامة والإحترافية فى برنامج الفوتوشوب

واليوم سنشرح تصميم أيقونة وسام أو جائزة بشكل إحترافي

1- نبدا عمل جديد بمقاس 512×512 دقة الوضوح 72 ونظام الألوان RGB Color

صورة رقم 1
http://www.abc4web.net/upload/images2/snili2fmmc5xyhe.png (http://www.abc4web.net/upload/)

2- سوف لانتظرق إلى الخلفية لأننا فى النهاية سنحفظ العمل شفاف لذلك فلندعها باللون الأبيض المهم نضيف طبقة جديدة ونستخدم أداة التحديد (Rectangular Marquee Tool) ونرسم مستطيل كما فى الشكل التالي .

صورة رقم 2
http://www.abc4web.net/upload/images2/gn9mcnaplxt1f3i.png (http://www.abc4web.net/upload/)

3- نقوم بملئ التحديد بهذا اللون 7e5f29 ثم نقوم بإختيار أداة الحرق Burn Tool http://www.abc4web.net/upload/images2/zl37qbkcgvu5ypd.gif (http://www.abc4web.net/upload/) لنرسم ظلال على الأطراف ( وهذه الأداة تعمل كالفرشاة )

صورة رقم 3
http://www.abc4web.net/upload/images2/aem365h6qfqedit.jpg (http://www.abc4web.net/upload/)

4- الآن نضيف طبقة جديدة ونقوم بإستخدام أداة التحديد Rectangular Marquee Tool ونرسم مستطيل أقل فى العرض من السابق كما نشاهد فى الصورة التالية

صورة رقم 4
http://www.abc4web.net/upload/images2/lg2ool0hircc60z.jpg (http://www.abc4web.net/upload/)

5- نقوم بملئ هذه الطبقة باللون الأساسي للتصميم 7e5f29 وسوف نحصل على الشكل التالي

صورة رقم 5
http://www.abc4web.net/upload/images2/mglwn3xytdnwxvr.jpg (http://www.abc4web.net/upload/)

6- نذهب إلى تأثيرات الطبقة Blending Options ونقوم بإختيار Inner Shadow ونضيف هذه القيم

صورة رقم 6
http://www.abc4web.net/upload/images2/6x3jkjndcuc5nyr.png (http://www.abc4web.net/upload/)

صورة رقم 7
http://www.abc4web.net/upload/images2/x8gn5as489fbp0j.png (http://www.abc4web.net/upload/)

وبذلك نكون قد إنتهينا من واجهة القاعدة وسنعود لها لاحقا لإضافة سطح القاعدة

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

صورة رقم 8
http://www.abc4web.net/upload/images2/jbhisc9xkfjlwpx.png (http://www.abc4web.net/upload/)

:fasel8:

المرحلة الثانية : تصميم جسم الوسام أو الشعار

7- نضيف طبقة جديدة ونذهب إلى الأشكال المخصصة Custom Shape Tool ونضيف شكل الدرع

صورة رقم 9-a
http://www.abc4web.net/upload/images2/vwwmunjcgwwagvq.png (http://www.abc4web.net/upload/)

نحاول ضبط الشكل عند بداية ونهاية القاعدة ونقوم بتحديده ( بالضغط على زر Ctrl من لوحة المفاتيح مع الضغط بالماوس ) ونملئه بهذا اللون c0a668 كما نلاحظ فى هذا الشكل

صورة رقم 9-b
http://www.abc4web.net/upload/images2/cbzvplofitmc25c.jpg (http://www.abc4web.net/upload/)

8- نذهب إلى خصائص الطبقة Blending Options ونقوم بتعديل هذه القيم

أولا الظل Drop Shadow ونضيف هذه الإعدادات

صورة رقم 10
http://www.abc4web.net/upload/images2/zz72t5ento2qdim.png (http://www.abc4web.net/upload/)

ثانيا Bevel & Emboss ونضيف هذه الإعدادات

صورة رقم 11
http://www.abc4web.net/upload/images2/td4qkybb1sp9zfw.png (http://www.abc4web.net/upload/)

نقوم بإختيار Contour Elements ونضيف هذه الإعدادات

صورة رقم 12
http://www.abc4web.net/upload/images2/ksmpxbstxbmnjzq.png (http://www.abc4web.net/upload/)

نذهب إلى خيارات Texture ونضيف هذه الإعدادات

صورة رقم 13
http://www.abc4web.net/upload/images2/1gdnnrivqvujlym.png (http://www.abc4web.net/upload/)

أخيرا نذهب إلى خيارات Pattern Overlay ونضيف هذه الإعدادات

صورة رقم 14
http://www.abc4web.net/upload/images2/3ungm0eeqskv2nl.png (http://www.abc4web.net/upload/)

الآن سوف نحصل على هذا الشكل

صورة رقم 15
http://www.abc4web.net/upload/images2/qkibptpaqcme1t8.jpg (http://www.abc4web.net/upload/)

نقوم بتكرار هذه الطبقة Ctrl + J ونسحبها خلف الطبقة الأولى ونعكسها عموديا وذلك بالضغط من لوحة المفاتيح خلال Ctrl + T ثم نقف على الطبقة وبيمين الماوس نختار Flip Vertical

صورة رقم 16
http://www.abc4web.net/upload/images2/9tprjgtk2lyfb4z.jpg (http://www.abc4web.net/upload/)

أخيرا نقوم بتحديد الجزء العلوى من هذه الطبقة بإستخدام أداة التحديد Rectangular Marquee Tool ومن لوحة المفاتيح نضغط على DEL كما فى الشكل التالي

صورة رقم 17
http://www.abc4web.net/upload/images2/n1jjqypylwdtdrq.jpg (http://www.abc4web.net/upload/)

نضيف طبقة جديدة (راجع الصورة رقم 19-a) نستخدم أداة رسم الأشكال Custom shape Tool ونرسم نفس الدرع السابق ونملئه بنفس اللون ايضا c0a668 ولكن بمقاس اصغر كما بالصورة التالية

صورة رقم 18
http://www.abc4web.net/upload/images2/dtwojibkw1qmxjj.jpg (http://www.abc4web.net/upload/)

من خيارات الطبقة Blending Mode نختار حالة الطبقة Dissolve وكذلك درجة الوضوح opacity القيمة 70%

صورة رقم 19
http://www.abc4web.net/upload/images2/vtquzujgeejzt8t.png (http://www.abc4web.net/upload/)

وسنحصل على هذه النتيجة

صورة رقم 20
http://www.abc4web.net/upload/images2/a8nf46ogrigvjpf.jpg (http://www.abc4web.net/upload/)

وبذلك نكون قد إنتهينا من تصميم شكل جسم الوسام

:fasel8:

نعود للقاعدة ونستكمل ماتبقى منها، نضيف طبقة جديدة ونستخدم قلم التحديد Pen Tool ونضع نقاط على مؤخرة تصميم الدرع مع الزوايا العُلى للقاعدة

صورة رقم 21
http://www.abc4web.net/upload/images2/pzfhlgwpgrcy7ky.jpg (http://www.abc4web.net/upload/)

نقوم بملئ التحديد باللون 4f3413 لنحصل على الشكل التالي

صورة رقم 22
http://www.abc4web.net/upload/images2/hl18jiw7ccempju.jpg (http://www.abc4web.net/upload/)

:fasel8:

الآن نقوم بإضافة زخرفة داخلية للتصميم وهذه الخطوات متروكة لذوق كل واحد وتصميمه أى يمكن التعديل فيها بإضافة شعار أو ايقونة أو كتابة كما تريد من التصميم

نقوم بإضافة طبقة جديدة ونرسم دائرة بإستخدام اداة التحديد الدائرية Elliptical Marquee Tool

صورة رقم 23
http://www.abc4web.net/upload/images2/f50rumqypjvu9rz.jpg (http://www.abc4web.net/upload/)

نقوم بملئ هذه الدائرة بنفس اللون 4f3413 ثم نذهب إلى Blending Options ثم نضيف Inner Shadow بهذه الإعدادات

صورة رقم 24
http://www.abc4web.net/upload/images2/3rzhdmup7fsdpag.png (http://www.abc4web.net/upload/)

نقوم بإضافة طبقة جديدة ونرسم دائرة أصغر قليلا ونملأها بنفس درجة اللون 4f3413

صورة رقم 25
http://www.abc4web.net/upload/images2/ta8e1d5oza0rxob.png (http://www.abc4web.net/upload/)

نستخدم أداة التظليل ( الحرق ) Burn Tool ونظلل حواف الدائرة كما فى هذا الشكل

صورة رقم 26
http://www.abc4web.net/upload/images2/uzjfco2ajv5dv6q.png (http://www.abc4web.net/upload/)

نقوم بإضافة ظل داخلي لهذه الدائرة نذهب إلى Blending Options ثم نضيف Inner Shadow بهذه الإعدادات

مكرر صورة رقم 24
http://www.abc4web.net/upload/images2/3rzhdmup7fsdpag.png (http://www.abc4web.net/upload/)

وسوف نحصل على هذا الشكل

صورة رقم 27
http://www.abc4web.net/upload/images2/wgyjjpazfyrkjvf.jpg (http://www.abc4web.net/upload/)

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

أخيرا نستخدم أداة الكتابة ونكتب مانريد سواء فى القاعدة أو داخل الوسام كى ينتهى لهذا الشكل

صورة العمل النهائي

http://www.abc4web.net/upload/images2/m597rndjgsq6nxu.jpg (http://www.abc4web.net/upload/)


مرفق الباترن المستخدم فى الشرح بالمرفقات

:morfqat:


أتمنى لكم جميعا الفائدة من هذه المشاركة

ولاتنسونا من صالح دعائكم

:fasel6:
أبوهمام
.

[azizsoft]

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

ما هذا الابداع يا أبا همام :abc_050:
بارك الله فيكم وجزاكم كل الخير
تصميم رائع جدا سأطبق الدرس باذن الله


بالتوفيق

[abohmam]

حياك الله أخى عزيز

أشكر لك مرورك وتواصلك الدائم

فى انتظار التطبيق ياطيب ان شاء الله

[أبو الوليد]

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

تطبيقي المتواضع


http://www.abc4web.net/upload/images2/4vy1db5hvdmrpjf.png (http://www.abc4web.net/upload/)

[أبو صخر]

http://www.karom.net/up/uploads/13141371723.gif

[أبو يوسف]

:teslam:

جزاك الله خيرا أخي ابو همام

[الراعي]

مبدع كما عودتنا دائما ياطيب ...سأحاول التطبيق ان شاء الله :abc_152:

[abohmam]

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

تطبيقي المتواضع


http://www.abc4web.net/upload/images2/4vy1db5hvdmrpjf.png (http://www.abc4web.net/upload/)

بارك الله فيك أخى ابا الوليد

تصميم رائع ياطيب

[abohmam]

حياك الله أخى ابا صخر - أبا يوسف والأخ الراعي

بارك الله فيكم جميعا إخوانى على تواصلكم ورمروكم العطر

فى انتظار التطبيقات ان شاء الله

[الراعي]

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

محاولة بسيطة للتطبيق ... ارجو ان اكون قد وفقت الى حد ما ...:abc_152:

http://www.iraqup.com/up/20120325/6rhVA-4a7B_668021062.jpg

[abohmam]

تطبيق رائع أخى الراعي

بارك الله فيك متابعة مثابرة موفقة دائما :abc_022:

وزادك الله حرصا

[العراق]

الف شكررررررررررررررررررررررر رررررر

[ماستر فيوز]

:abc_023::abc_052::abc_050: