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

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

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

مطالب مرتبط

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

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