الان صمم موقعك بالفوتوشوب ورفاقه ..

درس مترجم من موقع فوتوشوب كافي الانجليزي .. وهو درس شيق احببت ان اترجمه واطرحهه عليكم :)

===============================
اغلب الناس عندهم خلفيات ششاشاتهم 800*600 فعليك ان تفعل هكذا ..
http://www.photoshopcafe.com/tutoria...per-two001.gif

===============================
اممم الحين نقسم التصميم حسب .. رغبتك .. guides
هذه الخطوط الزرقاء تقدر تحطها .. عن طريق
guides < view
http://www.photoshopcafe.com/tutoria...per-two002.gif

===============================
الآن انشأ layers جديد ..
http://www.photoshopcafe.com/tutoria...per-two003.gif

================================
الان .. انشأ اي تدرج تحبه انت او مثل ما هو محطوط ..
http://www.photoshopcafe.com/tutoria...per-two004.gif

===============================
الان .. امسك ال Shift ونزل لي تحت بالماوس علشان يصير التدرج معاك مثل هذا ..
http://www.photoshopcafe.com/tutoria...per-two005.jpg

================================
الحين .. حط اي صورة او صورة القرش الموجودة وتقدر تنزلها من هنا ....
http://www.photoshopcafe.com/tutoria...per-two006.jpg

================================
طبعا الحين راح نحط ماسك على الصورة والماسك هو ثاني ختيار من اليسار من الي تحت الي يمه حرف الـ F ..
http://www.photoshopcafe.com/tutoria...per-two007.gif

===================================
الحين .. راح نسوي فرشه حجمها 100 وتكون حوافها ناعمة .. مثل هذي ..
http://www.photoshopcafe.com/tutoria...per-two008.gif

===================================
الحين شيء سهل انك تزيل الحواف للصورة بهذه الاداة .. طبعا اتكون مأشر على الماسك الي سويناه .. واختار اللون الاسود .. وامسج واذا اخطأت اختار الابيض ورد ..
http://www.photoshopcafe.com/tutoria...per-two009.jpg

===================================
راح يصير معانا هذا الشكل ..
http://www.photoshopcafe.com/tutoria...per-two010.jpg

===================================
الحين قلل القيمه الى 46% اذا تبي .. اكثر اقل حسب نظرتك ..
http://www.photoshopcafe.com/tutoria...per-two011.gif

===================================
الشكل النهائي ..
http://www.photoshopcafe.com/tutoria...per-two012.jpg

===================================
هذا هو الدرس الاول الذي يعالج الخلفيه .. 1

الان الدرس الثاني وهو لشرح الاضافات بدأنا بالجد ..

==========
اول شيء تحتاج الى اسم الموقع او شعارك او اي شيء تبيه يكون امامك .. طبعا عقب ما تكتب ضعه بالمكان لمخصص له كما سوف ترى .. عن طريق ضغط Ctrl + t وتحريكه وتضبيطه .. بفضل اختيرا خط نظيف ..
http://www.photoshopcafe.com/tutoria...per-two013.jpg

=========
الآن .. ضع شعارك الذي يمكنك عمله بكل سهولة ..
سو مربع عادي .. وقطع اطرافه .. بالطريقه الي تريحك .. وبعدين حط داخله حرف او شعار بعدين حرك المربع ليكون بالشكل هذا يعني 45درجه بس مو اكثر .. لوضعه بالشكل المطلوب وسوف تكتشفه بعدين .. شايف الجايد الي حطيناهم قبل .. حطه عليهل بالشكل هذا ..
http://www.photoshopcafe.com/tutoria...per-two014.gif

=========
الحين انشأ لير جديد سمه lines ...
http://www.photoshopcafe.com/tutoria...per-two015.gif

========
الحين اختار اداة التحديد العامودية ..
http://www.photoshopcafe.com/tutoria...per-two016.gif

==========
حدد على يمين ويسار الكلمة الي حطيناها .. بالشكل هذا ..
http://www.photoshopcafe.com/tutoria...per-two017.gif

==========
الحين امسح الخطوط الي راحت صوب الشعار بالشكل هذا ..
http://www.photoshopcafe.com/tutoria...per-two018.gif

==========
لتكون بهذا الشكل ..
http://www.photoshopcafe.com/tutoria...per-two019.gif

=========
الحين بالاستعانه بالجايدز الي حطيناهم اول خطوات .. حدد المساحه المستطيله الي صارت بالوسط .. ولونها باللون الي تبيه ..
http://www.photoshopcafe.com/tutoria...per-two020.gif

=========
الحين .. اكتب فيها بأشكال متباعده الي تبي تسوي له وصلات .. طبعا مو تكتب تحته فقط اكتب فوقه وفيه :) نفس الشكل التالي ..
http://www.photoshopcafe.com/tutoria...per-two021.gif

==========
الحين اخفي الجايدز . عن طريق ضغط Crtl + '
للعلم هذا (( ' )) موجود مكان حرف الطاء بالعربي :)
ليتكون لنا هذا الشكل ..
http://www.photoshopcafe.com/tutoria...per-two023.jpg

==========

انتهى الدرس الثاني .. وهو لمعالجة الاشياء .. 2

مشكوووووووووووووووووووور والله يعطيك الف الف الف عافية يا رئيس المنظمة :)

احم احم .. الدرس الثالث سهل وما يبي له شيء اصلا .. لانك راح تضيف اشكال لتميز الوصلات :)

=====
هذه القائمة اختار منها اي واحد ..
http://www.photoshopcafe.com/tutoria...per-two024.gif

====
شكل التايل الي تبيه انت بنفسك .. ترى سهله ..
http://www.photoshopcafe.com/tutoria...per-two025.gif

=====
طبعا هذاالشكل راح يطلع لنا لما نحط الماوس على الكلمه ..
http://www.photoshopcafe.com/tutoria...per-two026.jpg

=====
الحين ننسخ هذا الستايل عن طريق الضغط بالماوس يمين .. وفعل هذه الفعله :)
http://www.photoshopcafe.com/tutoria...per-two028.gif

=====
الحين روح على الثانيين .. وسو هالحركه .. بالماوس يمين بعدين اختار .
http://www.photoshopcafe.com/tutoria...per-two029.gif

====
هذا الشكل الي المفروض يتكون لديك ..
http://www.photoshopcafe.com/tutoria...per-two030.gif

=======
بس اقولك شغلة طف الحركة مالت الستايل لاننا الحين راح نروح الايميج ردي ونسوي حركة الماوس الممرر ..
http://www.photoshopcafe.com/tutoria...per-two031.gif

=======

مشكووورين على المتابعه واوعدكم اني اكملها معاكم :)

الدرس هذا انا اسميه تشريح .. نفس الاحياء والطب ..

========
الحين راح نتحول للإيميج ردي من الفوتوشوب اي نعم من الفوتوشوب وهي سهلة ..
http://www.photoshopcafe.com/tutoria...imageready.gif

========
الحين راح يرد ال guides بروحه .. او احنا نرده بكل سهوله .
ونروح الى optimization
http://www.photoshopcafe.com/tutoria...per-two033.gif

========
الحين شوف القائمة هذي فوق واختار نفس الخيارات ...
http://www.photoshopcafe.com/tutoria...per-two034.gif

=========
الحين نختار اداة التقطيع ..
ادري بتقولون ليش ما قطعنا بالفوتوشوب اقولكم اننا نحتاج للوقت .. وافهموا :)
http://www.photoshopcafe.com/tutoria...per-two035.gif

========
الحين نقطع الاماكن مثل الاسم و اماكن الازرار .. وهالسوالف .. طبعا بالزاوية راح نشوف ارقام هذي ارقام القطع .. وكلما الصورة قطعت كان افضل لنزولها على النت ..
http://www.photoshopcafe.com/tutoria...per-two036.jpg

طبعا بتقول ليش حسين قاعد يقولنا قطعوا وسووا هالسالفه ..
1- نقدر نسوي حركة بالمكان الي قطعناه ..
2- سرعة التنزيل والكثير ...

=========
الحين اقعد قصص مكان الازرار ..
http://www.photoshopcafe.com/tutoria...per-two037.gif

=========
احم احم .. هذا الشكل الي يطلع لك ..
http://www.photoshopcafe.com/tutoria...per-two038.jpg

========

انتهى درس التشريح .. 3

الان الرول اوفر .. حركة الماوس ..

======

اختار اداة التحديد والقص الثانية ..
http://www.photoshopcafe.com/tutoria...per-two039.gif

======
الحين اختار اي منهم .ز واضغط مرتين بسرعه ..
راح تطلع لنا هذه القائمة .. اختار منها الرول اوفر وبطل لير جديد فيها ..
http://www.photoshopcafe.com/tutoria...per-two041.gif

======
الحين عقب ما تسوي هالحركه روح على الليرات وشغل الستايل الي طفيناه ..
http://www.photoshopcafe.com/tutoria...per-two043.gif

=====
الحين السالفه سهلة .. شوف شنو راح يصير عندنا ..
http://www.photoshopcafe.com/tutoria...per-two044.gif

======
الحين روح على الخيار الاخير وطبق هذا .. ولا تنسى انك تربط بوصلات صحيحة .. مكن ال URL لازم تحط شيء موجود :) ومصممي الصفحات يعرفون هالشلغه ...
http://www.photoshopcafe.com/tutoria...per-two045.gif

======
وطبق على الباجي نفس الشيء بالنسبة للأزرار .. لكن مو تنسى ..
الوصلة تكون غير .. الا اذا انت تبي نفسها ..
http://www.photoshopcafe.com/tutoria...per-two046.gif

======

انتهى هذا الدرس .. 4

الضغط للموقع ...

الحين هذه الخطوة من الخطوات المهمه ..

=========
اختار اي شريحه وطبق عليها لاننها راح نطبق على الكل ..
http://www.photoshopcafe.com/tutoria...per-two054.gif

=========
شوف هذه الخصائص بالقامة القديمه ذاا تذكرونها :)
شوفوا كل مكان وياخذ طريقه يعني المكان الي ما يحتاج وايد الوان خله 4 الوان فقط والي يحتاج الى الكثير 128 الى فوق ارجو منكم فهم هذه النقطه جيدا :)
http://www.photoshopcafe.com/tutoria...per-two055.gif

=========
الحين روة قائمة File
بعدين priview in
واختار المتصف لديك وشوف العمل الي قمت به :)

=========
تأكد من جودة العمل ..
روح احفظه ..
File>Save optimized as

http://www.photoshopcafe.com/tutoria...per-two061.gif

=========
ركز على نمط الحفظ وهو الامج والاتش تي ام ال ...
http://www.photoshopcafe.com/tutoria...per-two062.gif

هذه الاشياء الي راح تشوفها .. بالمكان الي حفظته فيها ..
ولا تنى حفظ العمل بالصيغه الاساسية PSD :) اوكي



=========
http://www.photoshopcafe.com/tutoria...per-two063.gif


انتهى درس اليوم و العصر او غدا درس النشر بالدريم ويفر 4 :) اوكي

اممم ..
الحين قاعد ادور عن الدريم ويفر لما القاه بكمل الدرس لانه ما اقدر اشرح بدونه :)

مشكوووووووووووووووور على الدرس
قائدنا ... انت كذا http://montada.com/games4arab/images/icons/icon14.gif


ممكن سؤال .. ؟؟

لازم برنامج دريم ويفر عشان نكمل باجي الشغل ؟
او ينفع فرونت بيج ؟

و تسلم مرة ثانية

اممم ..
اعتقد ينفع الفرونت بيج .. لكن يفضل الدريم ويفر .. :)

مشكور وما قصرت....
موضوع جميل ومتعوب عليه...

وقد تم تثيت الموضوع .. للفائده:)

مشكور

هذا تطبيق على السريع:) ;)

مشكووووووووور حسين ويعطيك العافية

اممم

اف اس ام .. مشكور على التثبيت ..
وانا راح اكمل الدرس حول كيفيه النشر ...
وكيفية الببلش :)

ويا ريت نشوف تطبيقات مختلفه :)