Como Criar Web Button No Photoshop + Download Grátis PSD File
Neste tutorial vamos criar Web Button. Isto é muito simples e bastante eficaz tutorial, por isso tudo que você precisa é o Adobe Photoshop para criar esse efeito. Eu espero que você aprecie este tutorial.
Como Criar Web Button no Photoshop
Etapa # 1
Abra o photoshop e criar um novo documento, o meu é 550px × 125px com fundo branco.
Etapa # 2
Preencha a cor na camada de fundo, o meu é cor # 3A3A3A. 
Etapa # 3
Selecione a Rounded Rectangle Tool e crie o botão, o meu raio é 7px, width: 156px e height: 38px..
Etapa # 4
Agora vamos aplicar alguns efeitos
Gradient Overlay
Styling the Button, clique duas vezes na miniatura da camada de botão no painel Camadas para abrir a caixa de diálogo Estilos de Camada, vamos aplicar um efeito de gradiente vertical para o botão. Em seguida, clique no gradiente de cores à direita da opção Gradient para abrir o Color Gradient Editor.
Dê um duplo clique no left-color-stop e digite o valor de cor # 9E4C45, em seguida, dê um duplo clique sobre o botão direito do cor-stop e digite o valor de cor EA8484 #.
Sombra
Em seguida aplicar a camada estilo Drop Shadow. Manter o ângulo de 120o, de alterar os valores de opacidade, distância e tamanho. Eu escolhi para definir a opacidade em 23%, Distance 1px em tamanho e em 9px.
Etapa # 5
Selecione a Horizontal Type Tool e escreva o texto na frente.
Vamos aplicar algum efeito para o texto.
Color Overlay
Dê um duplo clique na miniatura da camada de texto no painel Camadas para abrir a caixa de diálogo Estilos Layer. Primeiro vamos aplicar sobreposição de cores, eu escolhi a cor # 0D0D0E
Sombra
Finalmente vamos aplicar o Drop Shadow, primeiro altere a opção Blending para Normal. Alterar a cor da sombra do padrão para # FFFFFF. Manter o ângulo de 120o, de alterar os valores de opacidade, distância e tamanho. Eu escolhi para definir a opacidade em 32% ea Distância em 1px e tamanho de 1px.
Final Preview
Deixe-nos saber que este tutorial pode ser mais melhor? Se encontrar algum outro tutorial photoshop que você deseja compartilhar conosco, sinta-se livre para nos informar por cair em um comentário.
Se você gostaria de receber mais inspiração de nós, por favor, considerem assinar a nossa feed de RSS ou por e-mail.
Promover Conosco
Artigos Relacionados:
Se você gostou de ler este artigo, confira outros artigos relacionados abaixo:
FavShare diz em: janeiro 18, 2010 at 11:32 Said:
Este artigo foi compartilhado em favSHARE.net. Vá e vote it!