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

[Chakira]

السلام عليكم

اليكم شرح طريقة لتصميم واجهة interface موقع شبه احترافية و اتمنى عند النقل ان يتم ذكر اسم موقعى www.albasha.info (http://www.albasha.info)
المهم فلنبدأ:
اولاً نفتح برنامج الفوتوشوب و نختار المقاسات التالية او اى مقاسات تريدها كما بالصورة:
http://www.albasha.info/up/uploads/6b98c1da89.gif (http://www.albasha.info/up/)
ثم نرسم باداة rounded rectankle tool مستطيل دائرى الاطراف فى الاعلى كما بالصورة:
http://www.albasha.info/up/uploads/d54942d7b1.gif (http://www.albasha.info/up/)
ثم نضغط ضغطتين سريعتين متتاليتين على المقطة المشار اليها بالسهم فى الصورة مع تحرى الدقة فى ذلك:
http://www.albasha.info/up/uploads/f6af71b7ee.gif (http://www.albasha.info/up/)
ثم تظهر لنا الشاشة التالية:
http://www.albasha.info/up/uploads/6476ac7703.gif (http://www.albasha.info/up/)
ثم نختار منها ما يلى بالصورة:
http://www.albasha.info/up/uploads/d247de3aef.gif (http://www.albasha.info/up/)
ثم نضغط على gradient overaly كما بالصورة:
http://www.albasha.info/up/uploads/4a15ed7f7c.gif (http://www.albasha.info/up/)
ثم نختار كما بالصورة:
http://www.albasha.info/up/uploads/b37bd6c93e.gif (http://www.albasha.info/up/)
ثم نضغط على زر ok كما بالصورة:
http://www.albasha.info/up/uploads/8f2a1764b6.gif (http://www.albasha.info/up/)
ثم نضغط على قائمة filter و منها قائمة distort و منها نختار wave كما بالصورة:
http://www.albasha.info/up/uploads/a44b89dfb8.gif (http://www.albasha.info/up/)
فتظهر لنا الشاشة التالية و نطبق عليها كما بالصورة:
http://www.albasha.info/up/uploads/d24934b760.gif (http://www.albasha.info/up/)
ثم نضغط ok كما بالصورة:
http://www.albasha.info/up/uploads/25fcdad5b0.gif (http://www.albasha.info/up/)
ثم نحرك ما صممناه باداة التحريك لتكون كما بالصورة:
http://www.albasha.info/up/uploads/d9683f43f6.gif (http://www.albasha.info/up/)



ثم نفعل كل ما فعلناه سابقاً مع مستطيل دائرى الاطراف فى الاسفل فتكون النتيجة كما يلى:
http://www.albasha.info/up/uploads/c877bd9612.gif (http://www.albasha.info/up/)
ثم نرسم مستطيل دائرى الاطراف فى الوسط على اليسار و نفس الشىء على اليمين و نفس الشىء فى الوسط تماماً فتكون النتيجة كما بالصورة:
http://www.albasha.info/up/uploads/2f397b1eb9.gif (http://www.albasha.info/up/)
ثم نرسم على مسطتيلات الدائرية الموجودة فى الوسط ثلاث مستطيلات اخرى باستثناء الموجود فى الوسط تماماً مع استخدام اداة wrap من قائمة edit بحيث تكون كما فى الصورة:
http://www.albasha.info/up/uploads/784bb5899b.gif (http://www.albasha.info/up/)
ثم نرسم قلوباً بتنفيذ ما يلى اولاً اضغط على اداة المستطيل الدائرى الاطراف و نختار منه الاداة التالية:
http://www.albasha.info/up/uploads/47a9436ae1.gif (http://www.albasha.info/up/)
فنضغط على الاشكال و نختار شكل القلب كما بالصورة:
http://www.albasha.info/up/uploads/235a4a5898.gif (http://www.albasha.info/up/)
ثم نرسم قلوباً كما فى الصورة:
http://www.albasha.info/up/uploads/c5f82510ee.gif (http://www.albasha.info/up/)
و قم انت برسم اى شىء اخر تريده من ابتكارك
كما اتمنى عدم النقد فانا لم اضعه لمعرفة ارائكم فى الفوتوشوب بل لتعليم من لا يجيد الفوتوشوب و ترقبواً دروس اقوى بكثير
و اى استفسار انا حاضر
و بهذا ينتهى الدرس مفصل و اتمنى التوفيق للجميع كما اريد ان ارى التطبيقات
و قبل كل ذلك توكل على الله كى يوفقك فيما تفعل

www.albasha.info (http://www.albasha.info)



https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©