Neste tutorial Photoshop mostra como ela é "relativamente" fácil de criar atraentes ícones para estilo web 2.0 com reflexões e assim por diante, simplesmente definindo os efeitos sobre a camada. Depois de entender o processo, também é possível - dando livre curso à sua criatividade - para criar muitas variações.
PASSO 1 - ICON FORM
Nós criamos uma camada e desenhar um retângulo 
(Ou quadrado), com cantos ligeiramente arredondados.
Aplicar esta camada os seguintes efeitos:
Como eu usei uma cor de sombra interna # ffd800
O gradiente vai do # 067500 para # 0cff00
Nós quase conseguimos nosso ícone! A intensidade da cor que você gosta! O importante era uma gradação do escuro para o claro.
PASSO 2 - REFLEXÃO
Adicionar uma nova camada no topo desta cha que acabamos de fazer. Selecione a forma do ícone (Ctrl + clique na camada) e - mantendo-se na nova camada vazia - selecione no menu Select-> Modify-contrato>: digite 2 pixels:
Definir a cor para branco 
e selecione a ferramenta Gradient 
, Passando de branco para transparente. Em seguida, desenhe um gradiente de cima para baixo, a fim de obter:
Agora, um toque final, selecione a ferramenta de seleção circular 
, Selecione uma elipse e colocá-lo como mostrado abaixo e pressione a tecla Delete - se você quiser você pode definir a transparência para 90/80:
PASSO 3 - Texto e símbolos
Usando uma das muitas fontes bibliotecas livres você pode adicionar um símbolo gráfico, um ícone em suma. Se esse esquema é, no meu caso, acrescentando que o efeito:
Otteremo um belo efeito para retornar:
A única coisa que falta ... o texto de sua escolha!
X Bem feito o tutorial, web 2.0 é que as normas que os webmasters dificilmente pode esquecer ...
Eu tentei no gráfico de rede para ser incluído em uma fonte semelhantes aos botões que você usou, mas eu não encontrei, você poderia me dizer o que é chamado ou onde encontrá-lo? Obrigado
@ Mark: Mark Thanks! Você pode encontrar algumas fontes bitmap para este endereço: http://www.orgdot.com/aliasfonts/
Photoshop Tutorial: ícones estilo Web 2.0 em 3 passos | Undolog.com ...
Tutorial para criar ícones com Photoshop estilo de 2,0 ....
hei .. mas você se esqueceu de nos dizer como sob a sombra desaparecendo!
.. você sabe .. você tem feito já .. 99 é de 100
pequeno botão mítica .. mas que seria necessário uma boceta sombra eh eh! ^. ^
@ Dapdudida:
Me perdoe eu fiz um screencast de pequeno porte, mesmo que nenhum som veio! Vá aqui para as técnicas de reflexão 
você está certo
Existem duas técnicas: com a máscara na camada (primeiro exemplo) eo uso geral de máscaras! Eu prefiro o primeiro
Ótimo tutorial! Eu estava procurando por um longo tempo, muito obrigado! Seu blog entre os meus favoritos, apenas
@ Artemisia: thanks!
Olá, parabéns pelo tuotorial Eu tenho sido muito útil, mas os pequenos ícones onde você encontrou?
Eu tentei olhar no site que você postou nos comentários anteriores parágrafos, mas eu não encontrei nada.
@ Farmhouse Lazio: os ícones são realmente uma carta de fonte. Você pode encontrar muitos tipos de letra livre que contêm caracteres em vez dos ícones normais de vários tipos. Pesquisa no Google por "fontes dingbats"
Que os caras após esta etapa .. Eu sei que é besteira, mas eu estou em tilt "Adicionar uma nova camada acima da que você acabou de criar. Selecione a forma (Ctrl + clique na camada) e permanecendo na nova camada vazia "alguém por favor pode explicar como você era uma criança de 2 anos?
@ Marco: você tem que fazer na prática, é recriar a mesma forma do botão sobre a camada de vácuo, mas um pouco menor. Para selecionar o conteúdo de uma camada que você pode usar CTRL + clique do mouse. Desta forma, você vai ver a seleção em torno da forma do botão. Em seguida, selecione a camada em branco para que a seleção feita anteriormente atuará sobre esta camada.
O problema é que quando eu chegar ao set "Gradient Overlay" então tudo está coberto com a camada da cor do gradiente e me permite ver a forma quadrada que eu tinha dado para o primeiro botão. Em segundo lugar, retornando no início, eu crio o nível, mas o design quadrado para intervir nas sombras dentro e fora eu tenho que necessariamente duplicar a camada. E 'certo?
Obrigado pelo seu excelente guia! Desde que vi as minhas criações só pode melhorar!
@ Mathias: obrigado! Para qualquer informação não hesite em me e-mail
Você pode explicar como você lidou com um vídeo tutorial com visíveis estilo janela pop-up?
Em resumo, refiro-me ao efeito sobre o vídeo onde visisibile sugerir um tutorial sobre como criar ícones estilo web 2.0
@ Giuseppe Serra:
Eu usei a biblioteca Javascript ShodowBox que lhe permite abrir janelas pop-up com conteúdo diferente: imagens, filmes flash ou QuickTime, páginas HTML e muito mais.
simples e prático ... como eu gosto:)
Olá quando eu tento aplicar o macshera a camada desaparece eo segundo quadrado na máscara de camada é branco e não preto como no filme por quê?
@ Stephen: Você deve segurar a tecla ALT quando você aplicar a máscara
Excelente guia, muito obrigado!
Sinto falta apenas uma coisa ... A passagem em que você inserir a elipse: Eu não posso dar esse efeito para o ícone.
Eu não consigo entender esta etapa:
Obrigado antecipadamente
Digit @ WM: Este é um simples passo. A camada de gradiente é cortada, de preferência com uma forma circular. O que você precisa fazer é seguir as figuras ilustradas para fazer o efeito semelhante à proposta, mas você também pode aplicar valores diferentes para efeitos diferentes. Em "reflexão" camada, o que cortar, use uma seleção circular para delimitar a área a ser excluído e pressionar a tecla "DELETE" para cortar o fundo.
Além disso, a opacidade desta camada pode ser reduzida a 90% ou 80% com base nas cores utilizadas.
Espero que tenha respondido sua pergunta.