em ,

Criando um botão para websites no Photoshop.

Preview Descrição: Neste tutorial veremos como criar um pequeno botão que pode ser usado em websites e blogs, para isso usaremos shapes, layer styles e algumas ferramentas.

tutoriaisphotoshop.net

(adsbygoogle = window.adsbygoogle || []).push({});

01. Pressione Ctrl+N para criar um novo documento, defina os valores abaixo e pressione Ok.

tutoriaisphotoshop.net

02. Vá em File> Place e adicione uma textura qualquer de background, redimensione e posicione a textura de acordo com seu documento, pressione Enter para finalizar a transformação, clique no ícone de Create New Group no rodapé da paleta de layers para criar um folder, dê o nome de button.

tutoriaisphotoshop.net

03. Pressione a letra U do teclado para selecionar a Rounded Rectangle Tool, certifique-se de que a opção Shape Layers esteja ativada, defina o Radius em 3 pixels e desenhe um retângulo na cor branca como o da foto abaixo.

tutoriaisphotoshop.net

04. Pressione Ctrl+J para duplicar a layer, vá em Layer> Layer Style> Inner Shadow, Layer> Layer Style> Gradient Overlay e defina os valores abaixo.

tutoriaisphotoshop.net

tutoriaisphotoshop.net

tutoriaisphotoshop.net

05. Clique na outra layer que contém o Shape original, pressione a letra V do teclado para selecionar a Move Tool, mova o shape 4 ou 5 pixels para baixo, vá em Layer>Layer Style> Drop Shadow, Layer> Layer Style> Inner Shadow, Layer> Layer Style> Color Overlay e defina os valores abaixo.

tutoriaisphotoshop.net

tutoriaisphotoshop.net

tutoriaisphotoshop.net

tutoriaisphotoshop.net

06. Agora 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, sua cor de Foreground deve ser a branca, pressione a letra T do teclado para selecionar a Horizontal Type Tool, escreva uma palavra qualquer, no caso deste tutorial foi usada a fonte Fontin, vá em Layer> Layer Style> Drop Shadow e defina os valores abaixo.

tutoriaisphotoshop.net

tutoriaisphotoshop.net

07. No final seu botão ficará como o da foto abaixo.

tutoriaisphotoshop.net

Site de origem: http://www.webdesign.org/photoshop/web-layout/simple-call-to-action-in-photoshop.19812.html

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 um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.

One Comment

  1. André,pode traduzir esses tutoriais aqui:
    worth1000.com/tutorials/162627/ruining-big-ben
    fxt.worth1000.com/tutorials/162092/how-i-created-bubble-berry

    É que eu tentei fazer,mas como está em inglês,algumas coisas não deu pra entender

Timelapse na Islândia.

Inspiração, Cartazes de Rock: Paper Route.