Criação de botões para interfaces móveis no Photoshop CS6

Índice
Esses tipos de botões são muito populares, especialmente quando trabalhamos fazendo peças para interfaces móveis, como o IphoneNa verdade, foi esse dispositivo que incorporou esses tipos de botões que parecem uma pequena aba de plástico brilhante na qual um pequeno reflexo de luz atinge.
Para construir este tipo de botão, vamos usar técnicas básicas como formas retangulares com bordas arredondadas, o uso de gradientes e o uso de paletas de cores para obter os efeitos desejados.
Primeiramente devemos iniciar o processo gerando a forma base do nosso botão, para isso seguiremos os seguintes passos.
1- Vamos começar criando um vetor em forma de retângulo com bordas arredondadas e no menu de camadas, vamos aplicar um efeito de gradiente de sobreposição:

2- O gradiente deve ser de uma cor escura na parte superior e uma variação da mesma cor mas mais claro na parte inferior, a proporção pode ser de 80% escuro e um 20% de clareza.
3- Agora devemos duplicar Camada, para isso podemos pressionar a combinação de teclas CTRL + JFazemos isso para poder modificar o gradiente na camada duplicada, portanto, uma vez duplicado, vamos clicar duas vezes no efeito do gradiente.
4- Vamos editar o gradiente, definindo sua opacidade para um 50% e vamos mudar as cores para branco no fundo e a parte mais clara ficará transparente:
5- Agora o próximo passo que devemos fazer é deletar as âncoras, para isso vamos selecionar o ferramenta de ponto, a ideia é mover as referências da camada duplicada, de modo que cubra apenas cerca de um terço da tela.
6- Agora vamos criar uma curvatura na borda inferior da camada duplicada, para isso vamos usar a ferramenta seleção de direção e no centro da linha geramos o movimento necessário.
7- Quando estamos terminando vamos modificar a camada e vamos mudar a opacidade para aproximadamente 65% e o parâmetro de preenchimento o Encher deixarmos em 0, isso fará com que tudo tome forma.
8- Finalmente podemos adicionar uma imagem ou um texto, ao fazê-lo devemos colocar uma pequena sombra para que realce o elemento e possamos associá-lo a um botão:

Como podemos ver, geramos um botão muito semelhante aos usados ​​em interfaces móveis, eles nos dão uma aparência marcante e fresca que podemos incorporar em nossos esboços e propostas de interfaces móveis, eles são usados ​​mais do que qualquer coisa para representar aplicativos e elementos como esse, não para ações básicas do usuário, no entanto, todos podem usar sua criatividade para obter uma posição.
Com isso finalizamos este tutorial, pois vimos que aplicamos várias técnicas básicas para obter o resultado final, deve-se destacar que quanto mais praticarmos, mais rápido seremos e poderemos gerar esses elementos com maior segurança.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo

Você vai ajudar o desenvolvimento do site, compartilhando a página com seus amigos

wave wave wave wave wave