Cardápio

14 anos de Photoshop no ar!

no , , , ,

Tutorial: Botão estilo Glossy

Descrição: Como criar um botão de RSS com estilo Glossy.

  • [message]
    • ##check##AVISO: Botão estilo Glossy

      • Caso você esteja usando o Photoshop em Português coloque o mouse sobre o nome do recurso que está sendo utilizado e veja a tradução em Português. Os recursos que possuem tradução estão marcados em vermelho no texto.
        Se você tiver dúvidas sobre o uso de alguma ferramenta visite o PS Help! para saber como utilizar a ferramenta desejada.
        Alguns tutoriais não possuem a opção de download das imagens, caso queira utilizar uma imagem em alta resolução para acompanhar o tutorial visite o PS Downloads e escolha um dos sites indicados para download de imagens em alta resolução.
        Em caso de dúvidas e sugestões utilize a área de comentários logo abaixo. Obrigado 🙂

01. Pressione Ctrl+N para criar um novo arquivo, defina um tamanho qualquer com 72 dpi´s e modo de cor em RGB, pressione Ok, pressione a letra U do teclado para selecionar a Rounded Rectangle Tool, marque a opção Shape Layers na barra de opções da ferramenta e desenhe o formato de seu botão como na foto abaixo, caso queira aumentar ou diminuir o arredondamento nas bordas antes de criar a forma do botão defina o valor da modificação no campo Radius na barra de opções da ferramenta.

02. Agora vá em Layer> Layer Style> Gradient Overlay e defina o valor do gradiente usado como 434343 no primeiro e segundo indicador e 000000 no terceiro indicador.

03. Agora vá em Layer> Layer Style> Stroke e defina os valores usados abaixo, neste tutorial a cor usada foi 363636.

04. Vá em Layer> Layer Style> Inner Glow e defina os valores abaixo.

05. Seu botão deve ficar parecido com o da imagem abaixo.

06. Pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione a letra X do teclado para alternar as cores de Foreground e Background, pressione a letra U do teclado para selecionar a Rounded Rectangle Tool novamente e crie outro retângulo, desta vez um pouco menor que o anterior e na parte superior do reângulo criado anteriormente como na foto abaixo, caso seu novo Shape já apareça com layer styles aplicados clique com o botão direito do mouse sobre a layer escolha a opção Clear Layer Styles.

07. Clique com o botão direito do mouse sobre a nova layer na paleta de layers e escolha a opção Rasterize Layer, pressione a letra Q do teclado para ativar o Quick Mask Mode, pressione a letra G do teclado para selecionar a Gradient Tool, escolha um gradiente que vá do preto para o branco, clique na parte de cima da imagem e arraste até a parte de baixo, sua imagem deverá ficar como a da foto abaixo, pressione Ctrl+D para retirar a seleção.

08. Pressione a letra Q novamente para sair do Quick Mask Mode, você terá uma seleção ativa, pressione Delete e sua imagem deverá ficar como a da foto abaixo.

09. Agora pressione a letra T do teclado para selecionar a Horizontal Type Tool e escreva algo no seu botão, no botão usado no tutorial foi escrito a palavra Entries RSS, vá em Layer> Layer Style> Drop Shadow e defina os valores abaixo.

10. Seu botão deve ficar como o da foto abaixo.

11. Abaixo seguem outras variações do mesmo botão criado.

site de origem: http://iris-design.info/photoshop/web-20-style-buttons/

Escrito por André Sugai

Publicitário, Photoshopista, criador do Tutoriais Photoshop, venceu o prêmio iBest na categoria tecnologia em 2008 e dois prêmios de criatividade da Adobe. Ex-colaborador do Tech Tudo (http://Globo.com), iMasters (UOL) e Revista Photoshop Creative.

Deixe uma resposta

Sair da versão mobile