Mohammad
Member
در این آموزش با نحوه ساخت یک منوی سایت آشنا خواهید شد. کاری که شاید خیلی هم ساده باشد ولی تاثیر خیلی زیادی رو زیبایی صفحات وب می گذارد. مشخصات آموزش رو در زیر براتون می نویسم و خود آموزش رو هم می تونید در ادامه مطلب دنبال کنید.
سطح : متوسط
زمان : حدود 15 تا 30 دقیقه
فایل PSD: دارد
فایل ویدئویی : ندارد
- آموزش
1. وارد فتوشاپ شوید
2. یک لایه جدید با اندازه های زیر باز کنید (Ctrl+N) - طول : 450 پیکسل - عرض :150 پیکسل
3. پس زمینه را به رنگ
4. با استفاده از Ctrl+Shift+N یک لایه جدید بسازید
5. با ابزار Marquee Selection یک کادر مستطیلی انتخاب کنید و با ابزار Paint Bucket آن را به رنگی که در تصویر مشاهده می نمایید در بیاورید.
6. با استفاده از Ctrl+D لایه را از حالت انتخاب در بیاورید
7. اکنون روی لایه (در پنل لایه ها) راست کلیک کرده و گزینه Blending Options را انتخاب کنیدو تنظیمات زیر را پیاده سازی کنید
7. اکنون روی لایه (در پنل لایه ها) راست کلیک کرده و گزینه Blending Options را انتخاب کنیدو تنظیمات زیر را پیاده سازی کنید
بعد از اینکه همه این تغییرات را انجام دادید ، باید تصویری مثل تصویر زیر داشته باشید
اکنون باید چند تا خط عمودی برای جدا کردن گزینه های ایجاد کنیم
8. یک لایه جدید ایجاد کنید با Ctrl+Shift+N و از روی صفحه کلید خود D را فشار دهید
اکنون ابزار Pencil را انتخاب کنید و اندازه قلم را روی 1 پیکسل قرار دهید و اکنون یک خط سفید و یک خط سیاه روی لایه رسم کنید. درست مثل عکس زیر :
8. یک لایه جدید ایجاد کنید با Ctrl+Shift+N و از روی صفحه کلید خود D را فشار دهید
اکنون ابزار Pencil را انتخاب کنید و اندازه قلم را روی 1 پیکسل قرار دهید و اکنون یک خط سفید و یک خط سیاه روی لایه رسم کنید. درست مثل عکس زیر :
9. بعد از اینکه این کار را با موفقیت انجام دادید ، حالت لایه را روی Overlay قرار دهید و Opacity آن را به 70% کاهش دهید و سپس لایه را با زدن Ctrl+J کپی کرده و به تعداد روی عکس پخش کنید
اکنون باید یک افکت هم برای وقتی لینک انتخاب شده (یعنی الان مثلا تو انجمن هستیم اون لینک انجمن باید با بقیه فرق کنه) ایجاد کنیم
10. یک لایه جدید ایجاد کرده و مانند تصویر زیر یک قسمت از تصویر را انتخاب کنید ( Marquee Selection )
ابزار Gradient Tool را انتخاب کرده و رنگ های 3C95CC و 52AEE6 را انتخاب کنید ( مانند مرحله 7 )
سپس ابزار رو به صورت عمودی روی لایه بکشید تا تصویر به صورت زیر در بیاید
10. یک لایه جدید ایجاد کرده و مانند تصویر زیر یک قسمت از تصویر را انتخاب کنید ( Marquee Selection )
ابزار Gradient Tool را انتخاب کرده و رنگ های 3C95CC و 52AEE6 را انتخاب کنید ( مانند مرحله 7 )
سپس ابزار رو به صورت عمودی روی لایه بکشید تا تصویر به صورت زیر در بیاید
مطمئن شوید که لایه در جای مناسبی قرار دارد، باید کار نهایی مثل تصویر زیر باشد
سپس در پنل لایه ها روی لایه راست کلیک کرده و Blending Options را انتخاب کنید و تغییرات زیر را انجام دهید
اکنون تصویر شما باید اینگونه باشد
همونطور که می بینید افکت ما کمی بزرگ است و باید دو پیسکل کوچک تر شود. برای این کار
10. ابزار Pencil رو انتخاب کرده و اندازه قلم رو روی 1px قرار دهید. سپس مانند تصویر شروع به رنگ کردن کنید.
10. ابزار Pencil رو انتخاب کرده و اندازه قلم رو روی 1px قرار دهید. سپس مانند تصویر شروع به رنگ کردن کنید.
حالا همه چیز باید دقیقا مثل عکس باشه ،
بیایید کمی روشنایی به لایمون اضافه کنیم ، به نظرتون بهتر میشه ؟ برای این کار
11. یک لایه جدید ایجاد کنید و با ابزار Marquee Selection نصف لایه رو مانند تصویر انتخاب کرده.
ابزار Gradient را انتخاب کرده و تنظیمات آن را به شکل زیر در بیاورید و ماوس را به صورت عمودی روی لایه بکشید تا یک چیزی مثل عکس زیر حاصل شود.
11. یک لایه جدید ایجاد کنید و با ابزار Marquee Selection نصف لایه رو مانند تصویر انتخاب کرده.
ابزار Gradient را انتخاب کرده و تنظیمات آن را به شکل زیر در بیاورید و ماوس را به صورت عمودی روی لایه بکشید تا یک چیزی مثل عکس زیر حاصل شود.
12. بعد از انجام این کار شما می تونید لایه رو با کلید های Ctrl+D از حالت انتخاب خارج کرده و Opacity آن را به 20% کاهش دهید. بهتر شد، نه ؟ اگه نه که می تونید دکمه del رو بزنید!!
حالا برای اینکه باز هم بهتر بشه ابزار Dodge رو انتخاب کنید و اندازه قلم رو به 60 پیکسل و Hardness آن را به 0% تغییر دهید و Range را روی Highlights و Exposure رو روی 15% قرار دهید
خوب منتظر چی هستید ؟ لایه قبلی (لایه آبی) رو از پنل لایه ها انتخاب کنید و شروع به حرکت دادن ماوس مثل تصویر زیر کنید
باز هم بهتر شد ؟ نه ؟ اگه نه می تونید Ctrl+Z رو فشار بدید
من فکر می کنم دیگه برای پس زمینه کافیه... حالا باید متون خودمون رو بهش اضافه کنیم
13. ابزار Text را انتخاب کنید سپس فونت دلخواه خودتون رو انتخاب کنید ( من فونت B Yekan رو بهتون پیشنهاد می کنم )
رنگ متن رو به سیاه (000000) و اندازه فونت رو به 13Pt ( یا هرچی که خودتون صلاح می دونید ) تغییر بدید.
حالت فونت رو هم روی smooth و اگه خواستید مثل شکل فاصله حروف رو بین 25 تا 50 بذارید
13. ابزار Text را انتخاب کنید سپس فونت دلخواه خودتون رو انتخاب کنید ( من فونت B Yekan رو بهتون پیشنهاد می کنم )
رنگ متن رو به سیاه (000000) و اندازه فونت رو به 13Pt ( یا هرچی که خودتون صلاح می دونید ) تغییر بدید.
حالت فونت رو هم روی smooth و اگه خواستید مثل شکل فاصله حروف رو بین 25 تا 50 بذارید
حالا اولین لینک خودتون رو تایپ کنید.
14. من دارم میرم یک سایه روشن به این نوشته اضافه کنم ، اگه می خواهید شما هم بیاید! حتما می دونید باید چی کار کنید دیگه ... ( مرحله 7 )
14. من دارم میرم یک سایه روشن به این نوشته اضافه کنم ، اگه می خواهید شما هم بیاید! حتما می دونید باید چی کار کنید دیگه ... ( مرحله 7 )
حالا باید متن شما اینطوری شده باشه :
سایر لینک ها رو تایپ کنید و همین کار رو با اونها نیر انجام بدید
15. اما یک لینک مونده ! اگه گفتی کدومه ؟ آفرین لینکی که انتخاب شده ، منظورم " انجمن " هست . خوب حالا باید چی کار کرد ؟ آفرین ...
بعد از اینکه اون کارو کردید باید یک سایه روشن بهش اضافه کنیم مثل عکس زیر :
بعد از اینکه اون کارو کردید باید یک سایه روشن بهش اضافه کنیم مثل عکس زیر :
آخرین ویرایش:
