منتديات سوفت وير عرب
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.



 
الرئيسيةالأعلانات المنتأحدث الصورالتسجيلدخول

 

 شرح تصميم واجهة موقع بالصور .

اذهب الى الأسفل 
كاتب الموضوعرسالة
المدير العام
المدير العام
المدير العام
المدير العام


عدد الرسائل : 146
العمر : 30
الموقع : softwarearab.co.cc
نقاط : 6061
تاريخ التسجيل : 31/03/2008

شرح تصميم واجهة موقع بالصور . Empty
مُساهمةموضوع: شرح تصميم واجهة موقع بالصور .   شرح تصميم واجهة موقع بالصور . I_icon_minitimeالأربعاء مارس 11, 2009 7:07 am


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

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

اليوم إن شاءالله راح أطرح لكم موضوع مختلف جداً عن مانراه في كثير من المنتديات

وما طرحته هنا سابقاً

ودرسنا اليوم بسيط جداً وسهل للغايه

وطبعاً أنا وأعوذ بالله من كلمة أنا عملت تصميم على سريع

يعني لو بتفنن فيه وعلى أقل من مهلي راح يطلع التصميم أفضل من كذا

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

وهذا ما راح تطبقونه أنتم إن شاءالله في تصاميمكم

بسم الله نبدأ الدرس





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

نفتح أول شئ عمل جديد بأي مقاس ويفضل 800×600



طبعاً في الدرس هذا راح نستخدم بعض الادوات الظاهره لك في الصوره الآتيه


شرح تصميم واجهة موقع بالصور . 1uyr865uy865tkyi


نختار أولاً الألوان إللي راح نحتاجها في الواجهه

ومن ثم نفتح لير جديد ونختار أداة التدرج وننزل على العمل من فوق لتحت

ليكون اللون الأعلى أفتح من اللون الأسفل


شرح تصميم واجهة موقع بالصور . 3uyr865uy865tkyi


أيضاً أنظر للشكل التالي وقم بخطواته


شرح تصميم واجهة موقع بالصور . 2uyr865uy865tkyi


الآن إذهب للأدوات وأختار من القائمه Custom Shape

الآن أعملوا البنر والأيقونات من خلال هذه الاشكال الموجوده لديكم

بعد عمل الأيقونات اذهبوا للير الايقونه لعمل تأثير عليها كالبروز أو التظليل الجانبي أو أي شكل ترغبونه ، أنظر الصوره


شرح تصميم واجهة موقع بالصور . 6uyr865uy865tkyi


الآن سيظهر لكم نافذه كبيره كما في الصوره الآتيه ويمكنكم من خلالها أن تضعون أي تأثير أو تغيير في الشكل
وممكن ايضاً أن تعملوا لها تأثيرات من خلال الفرش والفلاتر


شرح تصميم واجهة موقع بالصور . 7uyr865uy865tkyi


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

مثلاً قمتم بعمل ايقونه وكتبتوا عليها موقع تحميل الصور أو بحث

ممكن إنكم تضعون عليها رابط لموقع تحميل أو تضعون عليها رابط لمحرك البحث قوقل مثلاً والطريقه سهله جداً

أولاً نقوم بأخذ الأداة الثالثه من المجموعه الأولى من قائمة الأدوات وتجدون مثيلتها في أول صوره فوق

وتمرروها على كامل الأيقونه التي رسمتموها

راح يطلع عندكم مربعات وأشكال غريبه ، أعملوا كما في الصوره التاليه بالضغط على زر الماوس الأيمن
وأختارو Edit Slice Options


شرح تصميم واجهة موقع بالصور . 4uyr865uy865tkyi


الآن راح تظهر معاكم نافذه أخرى أعملوا نفس الخطوات الموجوده في الصوره الآتيه


شرح تصميم واجهة موقع بالصور . 5uyr865uy865tkyi


ملاحظه :

في حالة إنكم ترغبون في الضغط على الأيقونه ويصبح لكم صفحه خاصه فيكم
لا بد من رفع هذا العمل على الـ FTP
بعد ما تحفظونه عن طريق Save For Wef وعلى صيغة GIF
عندها يمكنكم أن تضغطوا على أي ايقونه وستفتح معاكم رابط الصفحه التي وضعتموها على الايقونه

لكن مثل ماقلنا إن هذا الشئ يبي له رفع على الف تي بي من مواقع رسميه أو مجانيه

لكن إذا بغيتوا إنها تفتح كصوره فقط ممكن تحفظونها على صيغة JPEG

ويمكنكم أن تتفننوا في العمل أكثر بعمل بنرات صغيره للإعلان وتضعوا عليها
اي صوره صغيره لأي موقع وهمي مثلاً وتجعلوها متحركه عن طريق برنامج الامج
ردي

أتمنى أن الدرس سهل

وهذا تصميمي الذي قمت بعمله .. أتمنى أن ينال إعجابكم


شرح تصميم واجهة موقع بالصور . 4543zk1kzk75

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

أخوكم

المدير العام









من مواضيع نـزف الـمـشـاعـر في المنتدى:

شرح تصميم واجهة موقع بالصور . Favleft شرح تصميم واجهة موقع بالصور ...























شرح تصميم واجهة موقع بالصور . Quote






























var tmp;
tmp = document.getElementById('NewsBoxflag');
if(tmp)
{
if(tmp.value == 0)
{
tmp.value = 1;
document.write('');
document.write('
');
document.getElementById('NewsBoxarab').innerHTML = document.getElementById('arabybox').innerHTML;

jsFile="http://www.arabysyndication.com/script/adRequest.js?adSpaceAuth=AcbvYshYCcErM4pu%2CdiRrV%24UBsuPy%24hSwyJpczWNQ3g4&category="+OAS_sitepage;
document.write('

');
}
else {
if(tmp.value == 1)
{
document.write('
');
OAS_AD('Middle');
document.write('
');
tmp.value = 2;
}

if(tmp.value == 2)
{
tmp.value = 3;
}

}
}





























if(tmp.value == 3)
{
jsFile="http://www.arabysyndication.com/script/adRequest.js?adSpaceAuth=AdAaTFPdiNmgMItDDrbiT5DK9EbQfUcjgGUu7x970wcu&category="+OAS_sitepage;
document.write('

');
}
















شرح تصميم واجهة موقع بالصور . Reply































خيارات الموضوع

شرح تصميم واجهة موقع بالصور . Printer عرض نسخة للطّباعة

شرح تصميم واجهة موقع بالصور . Sendtofriend ارسل هذه الصفحة لصديق











ابحث بهذا الموضوع









بحث متقدم
















<table class="tborder" border="0" cellpadding="6" cellspacing="1" width="180">
<tr> <td class="thead"> شرح تصميم واجهة موقع بالصور . Collapse_thead
قوانين المشاركة
</td>
</tr>

<tr> <td class="alt1" nowrap="nowrap">

لا يمكنك إضافة موضوع جديد

لا يمكنك الرد على المواضيع

لا يمكنك إضافة مرفقات

لا يمكنك تعديل مشاركاتك



كود vB متاح

الابتسامات متاح

كود [IMG] متاح

كود HTML مغلق
Trackbacks are متاح
Pingbacks are متاح
Refbacks are متاح


</td>
</tr>

</table>

<table border="0" cellpadding="0" cellspacing="0">
<tr> <td>

</td>
</tr>
</table>





















شرح تصميم واجهة موقع بالصور . Collapse_tcat
مواضيع مشابهة
الموضوع الكاتب القسم مشاركة آخر مشاركة
اكبر مكتبة برامج ادخل وحمل وابعتلى الرد kakyyabata منتدى البرامج والبرامج المشروحة 47 01 -01 -2009 01:10 PM
جميع المواقع الرياضيه تلاقونها هنا...!! آهـات منتدى الكمبيوتر والإنترنت 4 13 -07 -2006 10:37 PM
الموسوعـــــــــه لمـــــــــواقع الســـــــيارات kakyyabata منتدى الصور وغرائب الصور 4 18 -06 -2006 12:31 AM


الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://softwarearab.co.cc
 
شرح تصميم واجهة موقع بالصور .
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات سوفت وير عرب :: قســــ PhotoShop ـــــــــم :: قسم الفوتوشب :: أكادمية الفوتوشب-
انتقل الى: