تصميم زر احترافي

[أبو الوليد]

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




http://www.abc4web.net/upload/images2/qcl694bbww.gif (http://www.abc4web.net/upload/)




1. بسم الله نفتح عمل جديد 500×500 بكسل بأي خلفية ، ثم نضيف طبقة جديدة ونختار أداة Ellipse Tool بقياس متساو 300×300 بكسل ونرسم شكل الزر


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


2. على طبقة الزر نفتح خصائص Blending Options ونطبق التأثيرات الآتيه


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


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


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


3. الناتج بعد التأثير


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


4. نضيف طبقة أخرى، نسميها " الزر الثاني " ونرسم دائرة وسط الزر بأداة Ellipse Tool ، يمكن الإستعانة بخطوط الدليل للحصول على نتائج أفضل


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


5. نطبق التأثيرات التالية على هذه الطبقة من قائمة Blending Options


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


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


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


6. الناتج بعد التأثير


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


7. نضيف طبقة ثالثة وبأداة Ellipse Tool نرسم دائرة وسط الزر الثاني


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


8. نفتح مرة أخرى قائمة Blending Options ونطبق التأثيرات التالية على هذه الطبقة


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


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


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


9. الناتج بعد التأثير


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


10. نضيف طبقة رابعة نسميها " اللمعه " ثم بأداة Ellipse Tool نرسم دائرة صغيرة ثم نحذف حدودها خارج الطبقة الثالثة ثم نطبق فلاتر Blur > Gaussian Blur بقيمة 10 بكسل ونخفف الشفافية إلى 30 %


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


11. النتيجة


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




http://www.abc4web.net/upload/images2/qcl694bbww.gif (http://www.abc4web.net/upload/)

[abohmam]

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

أيقونة رائع والشرح جميل ماشاء الله :abc_022:

لي عودة بعد التطبيق ان شاء الله

[أبو أيهم]

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

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

ما شاء الله جميل جدا


واعتقد انها تصلح لان تكون زرا اكثر منها ايقونة


الى الامام ابا الوليد


انتظر المزيد من الابداعات منك خصوصا - سوف اتتبع المواضيع ان شاء الله

وفقك الله لما يحب ويرضى

[أبو الوليد]

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

أيقونة رائع والشرح جميل ماشاء الله :abc_022:

لي عودة بعد التطبيق ان شاء الله


حياك الله أخي أبا همام :abc_152: في انتظار تطبيقك

[أبو الوليد]

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

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

ما شاء الله جميل جدا


واعتقد انها تصلح لان تكون زرا اكثر منها ايقونة


الى الامام ابا الوليد


انتظر المزيد من الابداعات منك خصوصا - سوف اتتبع المواضيع ان شاء الله

وفقك الله لما يحب ويرضى

جزاك الباري خيرا أخي أبا أيهم :abc_152: سيتم التعديل إن شاء الله :abc_152:

[البغرامي]

درس رائع جدا اخي ابا الوليـد ما شاء الله والنتيجة احترافية ، تسلم الايادي

[جوهره بحجابي]

جزاكـ الله خير ~ ويعطيكـ ربي آلف عافية ~..
وهذا تطبيقي http://static.ak.fbcdn.net/images/blank.gifhttp://king-jobs.com/upload//uploads/images/domain-6441815803.gif ...!
http://king-jobs.com/upload//uploads/images/domain-0101d70727.jpg

:abc_152:

[المغربي الجديد]

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

[أبو الوليد]

درس رائع جدا اخي ابا الوليـد ما شاء الله والنتيجة احترافية ، تسلم الايادي


مرحبا بك أخي البغرامي :abc_152: سلمت يمينك

[أبو الوليد]

جزاكـ الله خير ~ ويعطيكـ ربي آلف عافية ~..
وهذا تطبيقي http://static.ak.fbcdn.net/images/blank.gifhttp://king-jobs.com/upload//uploads/images/domain-6441815803.gif ...!
http://king-jobs.com/upload//uploads/images/domain-0101d70727.jpg

:abc_152:





تطبيق جيد وومتاز أختي جوهره :abc_152: نسأل الله أن يزيدك من عطائه وأن يثيبك خيري الدنيا والآخره

[أبو الوليد]

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


بارك المولى فيك أخي جمال :abc_152: كلماتك تشحذ الهمم وتلهم العقول للإبداع :abc_145:
بوركت وبارك الرحمن فيك إلى يوم الدين :abc_152:
نسأل الله ألا يحرمنا من تواجدك المستمر ، وفقك الله وإيانا لكل خير :abc_152:

[الحارث بن فيصل]

:abc_138::abc_138: شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . :abc_138::abc_138: