login_logo2-4

طراحی کلیدهای ON و Off وب سایت در فتوشاپ

تمام وب سایتهای داینامیک دارای کلیدهای متنوع برای کاربردهای مختلف می باشد . به عنوان مثال کلید تغییر رنگ پس زمینه یا کلید بزرگ و کوچک کردن متن سایت .

در این بخش می خواهم 2 کلید On و Off که می توانید کاربرد آن را هنگام کد نویسی در قالب وب سایت تغییر دهید را با فتوشاپ طراحی کنم . برای شروع ابتدا یک صفحه به ابعاد 600 × 600 پیکسل ایجاد کرده و رنگ پس زمینه را با استفاده از ابزار Gradient تغییر بدهید .  درصد رنگیهای بکار برده شده در تصاویر زیر می باشد .
1. فتوشاپ را اجرا کرده و یک صفحه به ابعاد 600×600 ایجاد کنید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--1

2. ابزار Gradient را انتخاب کرده و رنگ پس زمینه را با توجه به تصاویر زیر تغییر بدهید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--2

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--3

3. ابزار Rounded Rectangle Tool را انتخاب کرده و با Radius 50 px یک کادر با درصد رنگی #aec24e بکشید

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--4

4. بر روی لایه کادر کشیده شده دابل کلیک کرده و تنظیمات گزینه های پیش فرضی که مشخص شده است را تغییر بدهید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--5

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--6

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--7

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--8

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--9

5. با ابزار Ellipse Tool یک دایره بکشید . بعد از کشیدن دایره مورد نظر بر روی لایه آن دابل کلیک کرده و تنظیمات پیش فرض گزینه های مشخص شده را با توجه به تصاویر زیر تغییر بدهید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--10

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--11

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--12

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--13

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--14

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--15

6. برای ایجاد سایه زیر دایره کشیده شده در مرحله قبل ابزار Brush را انتخاب کرده ، رنگ Forground را برابر با مشکی قرار داده و یک حاله سیاه رنگ با اندازه قلم 60 ایجاد کنید

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--16

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--17

7. وسط دایره بزرگ تر یک دایره کوچک با درصد رنگی e2e2e2 بکشید . بعد از کشیدن دایره روی لایه آن دابل کلیک کرده و تنظیمات گزینه پیش فرض آن را تغییر بدهید

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--18

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--19

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--20

 

8. ابزار تایپ را انتخاب کرده و یک متن را با درصد رنگی 4c4c4c تایپ کنید . مد لایه را برابر با Vivid Lighet قرار بدهید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--21

9. تمام مراحل بالا را با درصد رنگی df6c76 برای پس زمینه و درصد رنگی ce0009 را برای متن همراه با مد لایه Pin Lighet قرار بدهید .

طراحی-کلیدهای-ON-و-Off-وب-سایت-در-فتوشاپ--22

منبع:آسارایان

اشتراک گذاری در whatsapp
اشتراک گذاری در telegram
اشتراک گذاری در pinterest
اشتراک گذاری در linkedin

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد.

مطالب مرتبط

فرم ورود کاربر

ابتدا باید وارد حساب کاربری خود شوید