المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : شرح طريقة عمل واجهة interface مميزة و رفعها على موقعك حصريــــــــا



salima
11-01-2013, بتوقيت غرينيتش 04:52 AM
http://img.aljasr.com/icon.aspx?m=blank
السلام عليكم و رجمة الله تعالى و بركاته
اليوم باذطن الله و رعايته أقدم لكم
شرح طريقة تركيب install تصميم واجهة interface موقع + تقطيعها + وضع روابط + رفعها الى الموقع
المستلزمات :
الفوتوشوب داعم للغة العربية
+
الفرونتبيج
+
برنامج لرفع الملفات الى المواقع
+
الصبر ....
بسم الله الرحمن الرحيم نبدأ : نفتح الفوتوشوب بالتأكيد و عمل و جديد : http://www.0sss0.com/up/uploader_files311/WxX77450.png
بعدها نحدد القياس المبين لنا : http://www.0sss0.com/up/uploader_files311/Jcz77496.png ننقر مرتيين على الخلفية :
http://www.0sss0.com/up/uploader_files311/Yyu77524.png
ثم ...:
http://www.0sss0.com/up/uploader_files311/ZV677579.png
بعدها نختار ما يلي :
http://www.0sss0.com/up/uploader_files311/x7M77638.png
يليها ...: http://www.0sss0.com/up/uploader_files311/rQL77673.png نختار التالي :
http://www.0sss0.com/up/uploader_files311/J0J77705.png
ننقر أوكي :
http://www.0sss0.com/up/uploader_files311/GhL77736.png
و نختار اللون مثلا البرتقالي : http://www.0sss0.com/up/uploader_files311/Xfd77769.png و ليكون التصميم متوازنا نختار : http://www.0sss0.com/up/uploader_files311/y0K77809.png



و سيظهر لنا التصميم على هذا الشكل لا تخف خخخخ : http://www.0sss0.com/up/uploader_files311/IoQ77853.png
نختار اداة المربع :
http://www.0sss0.com/up/uploader_files311/oku77891.png
نرسم الهيدر header : http://www.0sss0.com/up/uploader_files311/bGP77931.png بعدها :
http://www.0sss0.com/up/uploader_files311/SFm77965.png
ثم ....: http://www.0sss0.com/up/uploader_files311/uU378002.png الآن نأخذ أداة التدرج لعمل تدرج للهيدر :
http://www.0sss0.com/up/uploader_files311/leK78064.png
و نعمل هذا الشكل : http://www.0sss0.com/up/uploader_files311/hgF78105.png و نرسم مثل ما رسمنا الهيدر header الآن الفووتر يعني الجزء السفلي : http://www.0sss0.com/up/uploader_files311/I0A78148.png نعمل تأثيرا للفووتر عن طريق ....: http://www.0sss0.com/up/uploader_files311/u9278203.png
أوكي :
http://www.0sss0.com/up/uploader_files311/14m78239.png
نحدد القياس المبين بالصورة : http://www.0sss0.com/up/uploader_files311/SGb78276.png
و نحصل على : http://www.0sss0.com/up/uploader_files311/f5d78309.png الآن نختار الأداة التالية لعمل القائمة الرئيسية للواجهة interface : http://www.0sss0.com/up/uploader_files311/ll078361.png
و نرسم التالي : http://www.0sss0.com/up/uploader_files311/ewz78399.png الآن و بنفس الأداة نرسم الزر :
http://www.0sss0.com/up/uploader_files311/FO078448.png
نختار استايل style للزر :
http://www.0sss0.com/up/uploader_files311/ww878486.png
بعدها ...: http://www.0sss0.com/up/uploader_files311/Xdp78523.png و نكرر اللير أربع مرات :
http://www.0sss0.com/up/uploader_files311/q0878560.png
الآن نرسم الشكل التالي : http://www.0sss0.com/up/uploader_files311/79H78602.png و لاعطاء تأثير جميل نختار : http://www.0sss0.com/up/uploader_files311/zKR78662.png
أوكي :
http://www.0sss0.com/up/uploader_files311/hOl78699.png
نحدد القياسات الموجودة بالصورة : http://www.0sss0.com/up/uploader_files311/epA78727.png
و بعدها نحصل ....: http://www.0sss0.com/up/uploader_files311/UEx78774.png
الآن بقي علينا فقط الكتابة و هذا شيء سهل : http://www.0sss0.com/up/uploader_files311/3Ls78810.png
الآن نمر الى مرحلة التقطيع و علينا اختيار الأداة التالية :
http://www.0sss0.com/up/uploader_files311/U8y78851.png
و نقوم بتطيع الواجهة interface على هذا النحو : http://www.0sss0.com/up/uploader_files311/Z3W78955.png
و بعدها مباشرة نختار :
http://www.0sss0.com/up/uploader_files311/5Ug78986.png
ثم ....:
http://www.0sss0.com/up/uploader_files311/QY379022.png
ثم ....: http://www.0sss0.com/up/uploader_files311/xPW79080.png الآن انتهينا ما عليك سوى غلق الفوتوشوب و تبع معي : نفتح ملف الهتمل الذي حفظناه مع الصور بواسطة برنامج الفرونتبيج : http://www.0sss0.com/up/uploader_files311/Qxi79118.png ستظهر لنا الواجهة interface جانبا و ليس بالوسط لهذا نضغط بالزر الأيمن على صورة من الواجهة interface :
http://www.0sss0.com/up/uploader_files311/7Ff79157.png
ثم نختار ما بالصورة : http://www.0sss0.com/up/uploader_files311/HIy79258.png
الآن نحدد الروابط بالضغط على احد أزرار الواجهة interface بالزر الأيمن : http://www.0sss0.com/up/uploader_files311/FqB79293.png
نكتب الرابط : http://www.0sss0.com/up/uploader_files311/9yg79343.png ستظهر لنا ما في الصورة ان الواجهة interface قد تشوهت : http://www.0sss0.com/up/uploader_files311/vEM79391.png
لذلك نضغط مرتين متتاليتين على صورة من الواجهة interface : و نعطي القيمة 0 مكان 2 : http://www.0sss0.com/up/uploader_files311/5Bd79440.png
الآن نحدد لونا لخلفية الموقع بالضغط بالزر الأيمن على مكان من الواجهة interface : http://www.0sss0.com/up/uploader_files311/K9w79477.png
نختار لونا يتناسق مع الواجهة interface مثلا البرتقالي : http://www.0sss0.com/up/uploader_files311/VFx79535.png
و سيظهر لنا التصميم على هذا الشكل : http://www.0sss0.com/up/uploader_files311/Qmq79575.png
نحفظ العمل :
http://www.0sss0.com/up/uploader_files311/9JL79608.png
نمر الى برنامج رفع الملفات :
http://www.0sss0.com/up/uploader_files311/EQD79640.png
نرفع ملف الصور + ملف الهتمل : http://www.0sss0.com/up/uploader_files311/tzr79677.png بعد اكتمال الرفع نغير اسم ملف startimes.html الى index.html : http://www.0sss0.com/up/uploader_files311/wUd79749.png
بعدها نحدد الاسم : http://www.0sss0.com/up/uploader_files311/CXO79775.png و ألف مبروووووووووووووووك
------------
منقوول من هنا :http://www.startimes2.com/f.aspx?t=5761162





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

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى