Photoshop

Притурка на бутон

Притурка на бутон
(0 от 0 гласували)

....

Следващата техника е за всеки дизайнер, искащ да използва трикове. Аз използвам тази техника много често при правене на какъвто и да е вид интерфейс, доста удобен трик. Тези стъпки ще ви позволяват да накарате бутони да изглеждат като, че те са притурка в повърх-ността на обект, като интерфейс, кожа на WinAmp и т.н. и могат да прибавят голяма степен на дълбочина към другояче плоско и отегчително изображение.

1. Най-напред, ще имате нужда от интерфейс или панел, към който да при-бавяте вашите бутони. Може да използвате каквото и да е изображение за интерфейс, което ви е под ръка, или може да направите ново подобно на примерът.

От горното изображение може да видите, че притурката е това, което прибавя реализъм и кара бутонът да изглежда като, че той е означен да бъде там. Повечето бутони на мобилни телефони, STEREOS и всички видове електронни джаджи са вмъкнати в повърхността, това е ефектът, който тази статия ще ви помогне да направите.

 Ето и пример какво е притурка:

2. Започнете със създаване на нов слой, като върху него сложете вашият интерфейс. Поста-вете на преден план следния цвят: #С1С2С4 Сега изберете инструмента за елипса (забележка: това е инструмент за форма, а не за селекция).


 

Там където искате вашият бутон да се появи, задръжте SHIFT и влачете формата докато стигнете размерът, който желаете.

За да придадете на бутонът ефект на хром, прибавете следващите стилове към слоят. На първо място прибавете вътрешна сянка (Inner Shadow) c тези настройки:

Сега прибавете вътрешно блестене (Inner Glow):

После прибавете слой за наклон (Gradient Overlay):

И последно, но не и по значение, прибавете линии (Stroke):

Когато завършите това, може да поискате да запаметите вашият стил за по-късна употреба (за да направите това, щракнете бутона "New Style" и изберете име. После горе вляво избе-рете раздела "Styles" и щракнете на иконата стрелка вдясно. изберете Save Styles от списъ-кът ). Щракнете "ОК" когато приключите и ще се появи бутон подобен на показания по-долу.

4. Така, сега имате вашият бутон, поставен върху интерфейса ви, но той не изглежда като да е от там. Нуждаем се от притурка.

В палитрата "Layers" щракнете "vector mask" на бутонът, който създадохте, както е показано в изображението по-долу :

Това прави пътят активен. Сега преминете към вашата палитра на пътища (Paths palette):

Влачете "слоят на пътят" на вашият бутон към това изображение Н за да го копирате. Това ще създаде "нов път", извикан от път l.Cera изберете инструмента "Path    irect Selec­tion" (намира се вляво от бутона с изобразена буква Т на него), натиснете десния бутон къ-дето и да е и изберете "Free Transform Path". Задръжте "SHIFT" и "ALT" заедно, за да влачите ъгъла и да направите пътят леко по-голям отколкото е бутонът, както е показано по-долу. Когато приключите натиснете "ENTER".

5. В този случай използвахме пътища, защото те са много по-лесни за оразмеряване без как-вато и да е загуба на качеството. Следващата стъпка е да се създаде нов слой, под слоят на вашият бутон. Инструмента "Path    irect Selection" все още е активен, кликнете с десния бу-тон където и да е в документа и изберете "Create vector mask" . Cera натиснете "X" после "", за да ресетнете цветовете. Натиснете и "CTRL" + "BACKSPACE" за да запълните "пътят" с бяло. Сега отидете в Layer -> Layer Style -> Gradient Overlay и въведете тези настройки: (или въведете това, което ви изглежда добре)

Сега вашето изображение трябва да изглежда на нещо подобно, като примерът по-долу. За-белязвате ли начина, по който бутонът сега изглежда сякаш, че той е част от панелът, вмес-то само да е седнал на повърхността? Добра работа :)

6. He спирайте до тук. Продължавайте да пробвате този ефект върху бутони под каквато и да е форма, размер, или текстура. Дори можете да накарате екрани или дисплеи на LCD да изглеждат като вмъкнати в интерфейсът. С малко усилие, може да създавате почти фото-реалистични неща. Ако правите много интер-фейси ще откриете, че тази техника се използва доста често; не просто за бутони, но и за каквото и да било.



Притурка на бутон

Коментари