ЯК зробити об'ємні кнопки :: створення об'ємних елементів фотошоп

В оформленні сайтів досить часто використовуються об'ємні елементи навігації. Такі кнопки можна зробити в графічному редакторі Photoshop, симітіровав обсяг за допомогою тіней і градієнтної заливки.

Вам знадобиться

- програма Photoshop.

Інструкція

Створіть у графічному редакторі новий документ за допомогою опції New з меню File. Розмір нового документа виберіть такий, щоб у нього помістилася кнопка, а фон зробіть прозорим.

Активізуйте інструмент Rounded Rectangle Tool. Якщо вам потрібна не дуже сильно скругленная кнопка, в панелі налаштувань інструменту вкажіть значення для параметра Radius, рівне одному міліметру. Намалюйте округлений прямокутник за допомогою обраного інструменту. Отримана фігура буде основою для кнопки.

Клацніть правою кнопкою мишки по шару і виберіть опцію Rasterize Layer. Завантажте виділення опцією Load Selection з меню Select.

За допомогою інструменту Gradient Tool залийте кнопку двоколірним градієнтом, вибравши підходяще поєднання кольорів з пресетів в палітрі градієнтів. Стиль градієнта повинен бути лінійним, виберіть його, клікнувши по кнопці Linear Gradient під головним меню. Верхня частина кнопки після заливки повинна виявитися світліше нижньої.

Застосуйте до шару стиль. Для цього скористайтеся опцією Blending Options з контекстного меню. Виберіть вкладку Drop Shadow і введіть для параметра Angle значення сто двадцять градусів. Параметр Size виставте на три пікселя.

У вкладці Inner Shadow поставте таке ж значення для параметра Angle, а для Size поставте величину в п'ять пікселів. Застосуйте стиль, натиснувши на клавішу Enter.

Зробіть тінь від кнопки. Для цього клікніть по кнопці Create a new layer і залийте виділену область нового шару чорним кольором. Виберіть для цього інструмент Paint Bucket Tool. Скасуйте виділення клавішами Ctrl + D.

Застосуйте до чорного прямокутника фільтр Gaussian Blur з групи Blur меню Filter. Параметр Radius поставте на чотири пікселя. Перетягніть мишкою шар з тінню під шар з кнопкою і підійміть тінь на три-чотири пікселя вгору. Для цього активізуйте інструмент Move Tool і посуньте тінь кнопками управління курсором. Знизьте значення параметра Opacity для цього шару до шістдесяти відсотків.

Зробіть активним шар з кнопкою і завантажте з нього виділення. Скоротіть виділення на два пікселя опцією Contract з групи Modify меню Selection.

Створіть новий шар і залийте на ньому отримане виділення лінійним градієнтом від білого до прозорого так, щоб біла частина опинилася в нижній частині кнопки. Скасуйте виділення. За допомогою опції Free Transform з меню Edit зменшите область, закриту градієнтом, по вертикалі. Застосуйте трансформацію клавішею Enter.

Змініть режим накладання шару з градієнтом на Overlay. Це можна зробити, вибравши режим із списку в лівій частині палітри стилів. Зменшіть параметр Opacity шару до шістдесяти відсотків.

За допомогою інструменту Horizontal Type Tool напишіть текст, який повинен бути на кнопці.

Зберіть всі верстви в папку опцією Group Layers з меню Layer, виділивши їх при затиснутою клавіші Ctrl. Збережіть кнопку в файл psd опцією Save з меню File.