V tomto tutoriálu budeme vytvářet webové Button. To je velmi jednoduché a velmi účinné cvičení, takže vše, co potřebujete, je Adobe Photoshop pro vytvoření tohoto efektu. Doufám, že se vám bude líbit tento tutoriál.

Jak vytvořit webovou tlačítka ve Photoshopu

Krok # 1

Otevřete Photoshop a vytvořit nový dokument, moje je 550px × 125px s bílým pozadím.

Krok # 2

Vyplňte barvu pozadí vrstvy, moje barva je # 3A3A3A.

Krok # 3

Zvolte nástroj Zaoblený obdélník a vytvořit tlačítko, dole Poloměr je 7px, šířka: 156px, výška: 38px..

Krok # 4

Nyní budeme aplikovat nějaký efekt

Gradient Overlay

Styling Button double-klikněte na náhled Button vrstvu v panelu Vrstvy k otevření dialogového okna Styly vrstvy, budeme se vertikální gradient efekt pro Button. Pak klikněte na barevné přechodu na pravé straně přechodu možnost otevřít Barva Gradient Editor.

Double-klikněte na left-color-stop a zadejte hodnotu barvy # 9E4C45, potom double-klikněte na pravé-color-stop a zadejte hodnotu barvy # EA8484.

Drop Shadow

Další použít stín stylu vrstvy. Udržujte úhel 120o, než změna hodnoty Opacity, vzdálenost a velikost. Já si nastavit Opacity na 23%, na vzdálenost 1px a Velikost na 9px.

Krok # 5

Vyberte Horizontální Type Tool a typu Text na přední straně.

Budeme aplikovat nějaký efekt pro text.

Barva Overlay

Double-klikněte na vrstvu textu na miniaturu v panelu Vrstvy na otevření dialogového okna Styly vrstev. Nejprve jsme se použije barevnou overlay, i vybrat barvu # 0D0D0E

Drop Shadow

Nakonec jsme se použije stín, první změna Míchání možnost Normální. Změnit Barva stínu z výchozí # FFFFFF. Udržujte úhel 120o, než změna hodnoty Opacity, vzdálenost a velikost. Já si nastavit Opacity na 32% a na vzdálenost 1px a Velikost na 1px.

Konečné Preview

Dejte nám vědět, jak se, že tato výuka může být mnohem lepší? Jestliže jste si našli jiné photoshop tutorial, které chcete sdílet s námi, neváhejte a dejte nám vědět o kapání komentář.

Pokud chcete získat více inspirace od nás, prosím, přihlašte se náš RSS s RSS nebo e-mailem.

Soubor pod: Volňásek, Photoshop, Tutorials admin