PHOTOSHOP – Como criar um ícone no estilo Windows 8

Neste tutorial para Photoshop, aprenda como criar um ícone baseado na interface do Windows 8. Para tanto, adotaremos as cores vibrantes e o visual minimalista do novo sistema da Microsoft.

Ícone feito com o Photoshop no estilo Windows 8 (Foto: Reprodução/Ramon Martins)
Ícone feito com o Photoshop no estilo Windows 8 (Foto: Reprodução/Ramon Martins)

Passo 1. Vá em “Arquivo” > “Novo” (“File” > “New”) para criar uma nova imagem no Photoshop. Use o tamanho 248 x 120 px (tamanho padrão do ícones no estilo Windows);

Passo 2. Defina a primeira cor de sua paleta de cores. O ideal é que ela seja bem vibrante, para imitar o estilo do Windows 8. Neste caso, vamos usar um tom de magenta, como mostra a figura abaixo;

Passo 2. Após selecionar a sua cor, inverta a posição das cores de sua paleta de cores apertando a tecla X;

Passo 3. Usando o atalho Ctrl+Backspace, preencha o fundo da imagem com a cor escolhida;

Passo 4. No painel de camadas (localizado no menu à sua direita), dê um duplo clique na camada “Plano de Fundo” (“Background”), depois dê um nome qualquer à camada e clique em Ok;

Passo 5. Vá ao menu “Camada” > “Estilo de Camada” > “Traçado” (“Layer” > “Layer Style” > “Stroke”);

Passo 6. Na caixa “Estilo de Camada”, defina o tamanho (“size”) como 2 px e a posição (“position”) como “Interno” (“Inside”). Para a cor, opte por manter o mesmo tom do magenta. Basta clicar na caixa de cor, posicionar o cursor próximo ao fundo magenta e dar um clique. Em seguida, deslize a bolinha de seleção cor para a esquerda;

Passo 7. Selecione a ferramenta Texto Horizontal (“Horizontal Type Tool”) com o atalho T. Crie o texto que deseja no seu ícone. Para manter os padrões do Windows, a fonte escolhida foi a “Segoe UI Light”, tamanho 50 px.

Pronto! Basta salvar a imagem no formato de sua preferência! Dica: Quanto mais claro for o fundo da tela onde você irá inserir o seu ícone, mais visível e bonito ele ficará e, quanto mais escuro, menos destacado.

Fonte: http://www.techtudo.com.br/dicas-e-tutoriais/noticia/2012/10/como-criar-um-icone-no-estilo-windows-8-usando-o-photoshop.html

Deixe um comentário