علاء الربيعي![علاء الربيعي](https://2img.net/u/2613/26/44/57/avatars/2-70.jpg) مؤسس الموقع ![مؤسس الموقع مؤسس الموقع](https://i.servimg.com/u/f81/15/24/57/71/yo_aai10.gif) معلومات اضافية
تاريخ التسجيل : 27/01/2010 عدد المساهمات : 2711 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : العراق نقاط النشاط : 2147750547 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب السبت يوليو 24, 2010 9:39 pm | |
| السلام عليكم ورحمه الله وبركاته
اقدم لكم درس تصميم فوتشوب احترافي
شرح مفصل عن تصميم موقع احترافي بالفوتوشوب من الألف الى الياء وبالتفصيل الممل
والشرح بالصور .......... ولا يقتصر التصميم على هذا الشرح فلا مانع من الزياده
عليه حتى تجعل من موقعك تحفة فنيه
قبل البدء نقوم بعرض الشكل النهائي التقريبي للموقع نبـــــــداء الدرس على بركة الله ,,,,,,,,,,,,,,,,,,!!!!!
افتح الفوتوشوب وعمل صفحه جديده من new او جديد
وختر القياسات 777 * 555 او على حسب رغبتك لاحظ الصور :::![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 110](https://i.servimg.com/u/f39/14/79/74/09/110.gif) نأتي بالصوره التى نريد ان نضعها خلفيه بالضغط على
open او فتح ونختار
الصوره من جهازنا ثم نسحبها الى منطقة العمل وهنا اخترت خلفية الورود لاحظ الصور![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 310](https://i.servimg.com/u/f39/14/79/74/09/310.gif) نضغط على CTRL + T ونسحب اطراف التحديد للصوره حتى نغطي الصفحة بها ره بعد ان نغطي الصفحة البيضاء بالصوره نضغط انتر
لأزالت التحديد ثم نذهب الى filter >>> blur >>> radial blur ونطبق
الخيارات كما بالصوره :![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 611](https://i.servimg.com/u/f39/14/79/74/09/611.gif) ستلاحظ ان الصوره اصبحت كالأشعاع ثم نبداء بوضع بنر
او مربع عنوان الموقع وسيكون الشرح بالصور تابع : ثم نطبق فلتر على المربع الذي رسمناه والفلتر هو ره تظهر رسالة تفيد أن الشكل سيحدث به تغيرات المهم انت اضغط ok ضع خيارات الفلتر ره بعد اعطاء البنر انحناء نعطيه تأثير الضل من اسفل قائمة
اللير نختار نضع الخيارات الأن نريد وضع خلفية للبنر او مربع عنوان الموقع ..
نضغط فتح ثم نختار صوره ونسحبها الى منطقة العمل كما شرحنا قبل
ونغطي بالصوره ثلاث ارباع البنر بالضغط على CTRL+T وسحبها الى
الوضع المطلوب لاحظ الصوره الأن اضغط انتر لأزالت التحديد ...الأن نريد دمج الصوره
مع البنر بحيث تكون الصوره داخل اطار البنر فقط .. وركز في هذه الخطوه
سيكون شرحها بالصور افضل : الان اجعل التحديد على خلفية البنر واقصد بالتحديد اللون الازرق
الواضح على الصوره التي تتحكم بها وهي الصوره الأولى ويجب ان تكون
فوق البنر وليس تحته الأن اضغط الأختصار CTRL+G وهذه
الخطوه لدمج الخلفيه مع البنر وجعلها داخل حدود البنر فقط ..
حركها لتعرف معنى كلامي .. بعد عمل الازم ستلاحظ وجود سهم صغير يدل على
دمج الصوره مع البنر لاحظ الصوره : الأن نريد تغيير لون خلفية البنر لتتناسب مع لون البنر
وذلك بالضغط على CTRL+U وقم بعمل نفس الأعدادات بالصوره : الأن نريد وضع صوره داخل شكل جميل وتكون بالزاويه
على اليمين للموقع .. نختار شكل من الاشكال الجاهزه عندنا او فرشاه
وليكن شكل ويمكن الحصول عليه بالضغط بالزر الأيمن على المربع
وختيار اخر شكل من بين المجموعه.. تابع الصور :![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 1810](https://i.servimg.com/u/f39/14/79/74/09/1810.gif) بعد الحصول على الشكل المطلوب وليكن قلب مثلا ..
نأتي بالصوره التي نريد دمجها معه ونضع الصوره فوق الشكل وندمجها بالضغط
على CTRL+G كما علمنا سابقا .. الأن نريد تحريك الشكل
مع الصوره الى المكان المناسب ويم
تحريكهما معاً بربطهما معاً وذلك يتم كما بالصوره : ونحرك الشكل الذى عملناه وهو قلب داخله صورة بنت الى الجهه اليمني من البنر ونعطيه بعض التاثيرات مثل الضل او على حسب الرغبه كما تعلمنا تاثير الضل سابقاً
سيصبح شكل الموقع حتى الأن تقريباً كما بالصوره : نرسم مربع بالنص من ادات المربع بشريط الأدوات
ونعطيها تأثير الضل كما عرفناه لاحظ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 2210](https://i.servimg.com/u/f39/14/79/74/09/2210.gif) ونكتب فوقه كلمة chat او
دخول الزوار او اي كلمة ترغب بها ونعمل لها تأثيرات كما في الصوره ماعليك
الاوضع علامة صح امام الخيارات التي امامك![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب 2410](https://i.servimg.com/u/f39/14/79/74/09/2410.gif) نضع فراشه او قلوب او ايقونات او حتى صوره ونمسح اطرافها لمربع
الشات حتى تعطيه منظر جذاب وطبعا كلمه chat نغير لونها
الأسود الى اي لون متناسق مع الموقع لاحظ بعد التعديلات .. مع اضافة بعض
اللمسات من الفرش الجاهزه لبرنامج الفوتوشوب الان نكتب عنوان الموقع ونعطيه نفس تأثيرات كلمة شات التي
عملناها سابقاً ونزيد عليها بتمويج العنوان ليكون بارزاً عند دخول الموقع وهذا عند الضغط على زر الكتابه انضر فوق بالزاويه اليمنى للفوتوشوب
تلاحظ وجود زر حرف T وتحته انحناء لاحظ الشرح بالصور وعند الضغط عليها يتم عرض مربع ومنه تختار اي شكل
يعجبك مع امكانية سحب اشرطة التمرير وتغيير الشكل
ليتناسب مع الوضع الذي تريد لاحظ الصورة بعد التعديلات على اسم الموقع ووضعه بالبنر بالحجم المناسب للموقع ......
لم يبقى لنا الا الأزرار وهذه تتم بعمل زر واحد ونسخه لأكثر من نسخه على حسب
عدد الأزرار بموقعك نبداء بعمل مستطيل ثم نقوم بمسح احد الاطراف بالممحاه
مسحاً خفيفاً حتى يكون متدرجاً بالمسح اي يكون احد الاطراف واضح والطرف
الاخر خفيف ونضع عند الطرف الواضح اي شكل
لعطي الزر شكلا جميلا مثلا نختار القلب المحدد فقط كما بالصور : كما يمكنك اعطائه شكلا افضل بأضافة تأثيرات عليه
اما هذا القلب فهو عباره عن فرشاه جاهزه وهناك اشكال وفرش كثيره تفيدك
بتصميمك فحرص على اقتناء اكبر عدد ممكن منها
وتحياتي لكم منقول للفائدة ملاحظة :: للذين يعانون من عدم ظهور الصور حملها من هنا[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] ![](https://i.servimg.com/u/f81/15/24/57/71/165.png)
عدل سابقا من قبل علاء ألعراقي ألجريح في الأربعاء يناير 31, 2018 3:38 pm عدل 1 مرات |
|
صقر ديالى![صقر ديالى](https://2img.net/u/2613/26/44/57/avatars/74-53.jpg) مشرف تقني ![مشرف تقني مشرف تقني](https://i.servimg.com/u/f81/15/24/57/71/aaa10.gif) معلومات اضافية
تاريخ التسجيل : 17/07/2010 عدد المساهمات : 315 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : العراق نقاط النشاط : 318963 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب السبت يوليو 24, 2010 9:56 pm | |
| |
|
سهر الليالي![سهر الليالي](https://2img.net/u/2613/26/44/57/avatars/4-26.jpg) الاقسام الاكاديمية ![الاقسام الاكاديمية الاقسام الاكاديمية](https://i.servimg.com/u/f81/15/24/57/71/aao12.gif) معلومات اضافية
تاريخ التسجيل : 24/02/2010 عدد المساهمات : 580 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![انثى انثى](https://i.servimg.com/u/f81/15/24/57/71/i_icon10.png) البلد : العراق نقاط النشاط : 268558 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | |
????![Anonymous](https://2img.net/u/2613/26/44/57/avatars/gallery/photo111.jpg) زائر معلومات اضافية
![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الأحد يوليو 25, 2010 8:12 pm | |
| |
|
سحر انثى![سحر انثى](https://2img.net/u/2613/26/44/57/avatars/175-49.gif) عضو برونزي ![عضو برونزي عضو برونزي](https://i.servimg.com/u/f62/15/24/57/71/u-uoa10.gif) معلومات اضافية
تاريخ التسجيل : 02/10/2010 عدد المساهمات : 227 جنسيتي : ![سعودي سعودي](https://i.servimg.com/u/f15/14/55/59/34/soudia10.gif) الجنس : ![انثى انثى](https://i.servimg.com/u/f81/15/24/57/71/i_icon10.png) البلد : السعودية نقاط النشاط : 255032 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الجمعة مايو 20, 2011 11:31 pm | |
| رووعة |
|
abd![abd](https://i.servimg.com/u/f81/15/24/57/71/photo110.jpg) عضو جديد ![عضو جديد عضو جديد](https://i.servimg.com/u/f62/15/24/57/71/u-a10.gif) معلومات اضافية
تاريخ التسجيل : 21/07/2011 عدد المساهمات : 8 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : iraq نقاط النشاط : 240112 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الأحد أغسطس 28, 2011 1:45 pm | |
| |
|
علاء حسين الربيعي![علاء حسين الربيعي](https://2img.net/u/2613/26/44/57/avatars/1-22.jpg) مؤسس الموقع ![مؤسس الموقع مؤسس الموقع](https://i.servimg.com/u/f81/15/24/57/71/yo_aai10.gif) معلومات اضافية
تاريخ التسجيل : 26/01/2010 عدد المساهمات : 9052 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : العراق نقاط النشاط : 341565 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الأحد أبريل 26, 2020 7:30 pm | |
| |
|
ابراهيم البغدادي![ابراهيم البغدادي](https://2img.net/i/fa/i/avatars/gallery/Cinema_h/Cinema_h_12.jpg) كاتب vib ![كاتب vib كاتب vib](https://i.servimg.com/u/f81/15/24/57/71/aoo_ao13.gif) معلومات اضافية
تاريخ التسجيل : 10/09/2010 عدد المساهمات : 586 جنسيتي : ![عراقي عراقي](https://i.servimg.com/u/f15/14/55/59/34/ooouus10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : العراق نقاط النشاط : 257818 ![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الأربعاء سبتمبر 23, 2020 2:02 pm | |
| |
|
Oussama.gfx![Oussama.gfx](https://2img.net/u/2613/26/44/57/avatars/1605-43.png) ملوك المعهد ![ملوك المعهد ملوك المعهد](https://i.servimg.com/u/f81/15/24/57/71/aoo_aa13.gif) معلومات اضافية
تاريخ التسجيل : 22/07/2020 عدد المساهمات : 744 جنسيتي : ![مغربي مغربي](https://i.servimg.com/u/f15/14/55/59/34/magrpp10.gif) الجنس : ![ذكر ذكر](https://i.servimg.com/u/f81/15/24/57/71/i_icon11.png) البلد : المغرب نقاط النشاط : 76429 الاوسمة : ![](https://i.servimg.com/u/f81/15/24/57/71/219.gif)
![شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب Empty](https://2img.net/i/fa/empty.gif) | موضوع: رد: شرح بالصور كيفية تصميم موقع إحترافي بالفوتوشوب الإثنين سبتمبر 28, 2020 2:21 am | |
| ![:heavy_check_mark: ✔](https://cdn.jsdelivr.net/emojione/assets/png/2714.png?v=2.2.7) ◐رووووووعــة ![:heavy_check_mark: ✔](https://cdn.jsdelivr.net/emojione/assets/png/2714.png?v=2.2.7) . ![:hotsprings: ♨](https://cdn.jsdelivr.net/emojione/assets/png/2668.png?v=2.2.7) مشككككوووووـور ![:hotsprings: ♨](https://cdn.jsdelivr.net/emojione/assets/png/2668.png?v=2.2.7) ![](https://i.servimg.com/u/f81/15/24/57/71/165.png) لا تنسى ذكر الله |
|