✖Dєѕтяοуэя
Designer
Registrado Em : 26/08/2011
Mensagens : 6
Agradeçido : 0
![[Tutorial]Criando Icones para IPhone Empty](https://2img.net/i/fa/empty.gif) |  Assunto: [Tutorial]Criando Icones para IPhone ![[Tutorial]Criando Icones para IPhone Icon_minitime](https://2img.net/i/fa/icon_minitime.gif) Sex Ago 26, 2011 1:49 am | |
|
| [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
01. Primeiro faremos o background, para isso pressione Ctrl+N para criar um novo documento de 500×120 pixels, logo após crie uma nova layer pressionando Ctrl+Shift+N e dê o nome de “Interface”, com a nova layer selecionada vá em Edit> Fill e defina Color: #a3acb7.
02. Clique duas vezes na layer “Interface” para abrir a caixa de Layer Style, depois defina Inner Shadow, com Opacity: 50%, Angle: 90, Size: 7.
03. Crie uma nova layer pressionando Ctrl+Shift+N e dê o nome de “Tile”, logo após pressione a letra M do teclado para selecionar a Elliptical Marquee Tool, segure o Shift e crie um círculo de 3×3 pixels e defina a cor para preta.
04. Abra a caixa Layer Style da layer “Tile”, e escolha a opção Drop Shadow, defina os seguintes valores:
![[Tutorial]Criando Icones para IPhone Imagem1](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem1.jpg)
05. Selecione o círculo que acabou de ser feito e duplique pressionando Ctrl+J, mova 5 pixels para a direita e mais 5 pixels para baixo. (Segure Alt+Ctrl e use as setas).
06. Selecione uma área de 10×10 pixels e crie um Pattern indo em Edit> Define Pattern dê o nome de “Tile”.
![[Tutorial]Criando Icones para IPhone Imagem2](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem2.jpg)
07. Delete a layer “Tile” e selecione a layer “Interface”. Logo após selecione tudo Ctrl+A, vá em Edit> Fill e escolha o modo Pattern> Custom Pattern: "Tile".
![[Tutorial]Criando Icones para IPhone Imagem3](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem3.jpg)
Seu background deve estar assim.
![[Tutorial]Criando Icones para IPhone Imagem4](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem4.jpg)
E suas layers devem estar assim:
![[Tutorial]Criando Icones para IPhone Imagem5](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem5.jpg)
08. Agora vamos criar o ícone de nosso Widget, primeiro crie uma nova layer pressionando Ctrl+Shift+N, dê o nome de “Widget BG”, selecione a Rounded Rectangular Tool (letra U do teclado) e crie um quadrado de 70x70 pixels, clique com o botão direito sobre ele e escolha Fill Path, use a cor #BF0000, depois abra a caixa de Layer Style, escolha a opção Drop Shadow e defina como a foto abaixo.
![[Tutorial]Criando Icones para IPhone Imagem6](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem6.jpg)
09. Pressione a letra T do teclado para selecionar a Horizontal Type Tool, escreva no botão criado a palavra “Tutorials” e use estes valores:
![[Tutorial]Criando Icones para IPhone Imagem7](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem7.jpg)
10. Novamente com a Horizontal Type Tool, escreva "2.0" e use estes valores:
![[Tutorial]Criando Icones para IPhone Imagem8](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem8.jpg)
11. Você terá um resultado próximo a este:
![[Tutorial]Criando Icones para IPhone Imagem9](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem9.jpg)
12. Agora selecione a layer “Widget BG” clicando na layer com a tecla Ctrl pressionada, depois vá em Select> Modify> Contract e defina 3 pixels.
13. Agora selecione a Gradient Tool (letra G do teclado), defina seu gradiente conforme os valores abaixo.
![[Tutorial]Criando Icones para IPhone Imagem10](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem10.jpg)
14. Defina em seu gradiente, Top left: 50% de opacidade, Top right: 0% de opacidade, Bottom left: #FFFFFF, Bottom right: #FFFFFF.
![[Tutorial]Criando Icones para IPhone Imagem11](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem11.jpg)
15. Com a Gradient Tool, clique segure e arraste de cima para baixo dentro da seleção.
![[Tutorial]Criando Icones para IPhone Imagem12](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem12.jpg)
16. Retire a seleção pressionando Ctrl+D, selecione a Elliptical Marquee Tool (Letra M do teclado) e crie um círculo como este:
![[Tutorial]Criando Icones para IPhone Imagem13](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem13.jpg)
17. Clique com o botão direto sobre a seleção e selecione a opção Select> Inverse e depois pressione o Delete em seu teclado. O ícone do seu Widget já deve estar parecido com este:
![[Tutorial]Criando Icones para IPhone Imagem14](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem14.jpg)
E suas layer devem estar assim:
![[Tutorial]Criando Icones para IPhone Imagem15](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem15.jpg)
18. No texto "2.0" adicione um Layer Style, selecione a opção Drop Shadow indo em Layer> Layer Style> Drop Shadow, aplique também ao texto "Tutorials", logo após selecione a layer “Widget BG” clicando na layer com a tecla Ctrl pressionada, depois aplique um gradiente que vai da cor #BF0000 para a cor #FF0000, seu ícone ficará assim:
![[Tutorial]Criando Icones para IPhone Imagem16](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem16.jpg)
19. Sinta-se a vontade para criar quantos ícones achar necessário!.
![[Tutorial]Criando Icones para IPhone Imagem17](https://2img.net/h/www.andresugai.org/Tutoriais/02.2007/T11/imagem17.jpg) Créditos : Tutoriais Photoshop
|
|
|
