Pesquisar este blog

Total de visualizações de página

sábado, 2 de abril de 2011

GIF no Photoshop CS3 (tutorial)


GIF no Photoshop CS3 (tutorial)

Se você ficou interessado em como eu fiz o GIF da tirinha “Google”, este post tem a resposta e espero que sirva pra alguma coisa. ^^

O que você irá precisar?

Papel;

Do tipo que desejar.

Lápis ou lapiseira; 



Photoshop CS3 ;



E uma idéia na cabeça.





Produzindo seu GIF:

Primeiro desenhe uma sequência desenhos para formar o movimento de seu GIF.


Abra o Photoshop CS3, abra um novo arquivo (File/New), escaneie seus desenhos (Import/e selecione seu scanner), cada imagem escaneada deve ser separada em uma camada (layer) diferente.
Agora vá em Window/ Animation. Aparecerá no espaço de trabalho a janela "Animation", onde você irá editar cada frame da animação. Veja:





É muito importante saber como utilizar camadas (layers) no Photoshop para criar as imagens que irão compor a animação. Repito cada imagem escaneada deve ser separada em uma camada (layer) diferente.


Na janela Animation (Frames), clique em duplique o frame (Duplicates selected frames) e em seguida ajuste o tempo que a imagem será exibida e para o GIF ficar rodando sem parar clique em Forever. Importante, antes de duplicar o layer na janela Layers, deixe visível somente a próxima imagem da animação (olhinho ao lado do layer).






Duplique o frame e repita esse processo quantas vezes forem necessárias para concluir a animação.

Salvando seu GIF:

Agora vamos salvar o GIF, para ocupar menos espaço possível, temos que aperfeiçoar a imagem gif animada. No Photoshop CS3, aperfeiçoamos da seguinte maneira:

Vá em File /Save For Web & Devices.



­­Na janela Save For Web & Devices podemos ver a imagem otimizada final e ajustar transparência e redução de cores, neste caso não mexi em nada apenas cliquei em Save.



Bom, aposto que agora você tentou abrir seu GIF no visualizador do Windows e não funcionou, seu desenho ficou lá paradão não é?
Pois bem, para ve-lo em ação clique com o botão direito do mouse sobre o aquivo GIF e vá em Abrir com/ Internet Explorer. Pronto se tudo der certo seu GIF estará animado.



Postando seu GIF no Blogger:

Algumas pessoas diziam que uma das limitações mais chatas no Blogger era a impossibilidade de postar GIFs animados de forma nativa. Tudo bem que este formato de arquivos de imagens já está meio ultrapassado, mas em alguns casos ainda pode ter sua utilidade.
Eu utilizo Picasa Web Albuns para armazenar minhas imagens (serviço do Google onde são armazenadas as imagens postadas no Blogger), ele oferece suporte a imagens animadas em formato GIF e outros formatos. Os requisitos para se usar o Web Picasa são extremamente simples, basta ter uma conta Google, por exemplo: Orkut, G-mail ou no caso o Blogger.
Então se você tiver umas dessas contas entre no Picasa, clique em Adicionar fotos/Escolher fotos para fazer upload/ Escolha seu GIF/OK, pronto seu GIF está hospedado.
Para postar seu GIF é simples entre no seu Blogger, clique em Nova postagem/ Alinhar ao centro, depois em Editar HTML (Figuras 1 e 2).

Figura 1

Figura 2

Note que apareceu um código.
Agora entre no Picasa e clique em incorporar imagem (Figura 3) copie o código (Ctrl+C) e cole no Blogger depois de center;">  (Figura 4). 

Figura 3


Figura 4

Toda imagem hospedada no Picasa possui um URL, agora é só copiar o URL do seu GIF no Picasa, clique com o botão direito do mouse em cima da imagem e clique em Copiar URL da imagem ( Figura 5) em seguida cole o URL em cima do seguinte código conforme mostra a Figura 6.



Figura 5

Figura 6


Pimba seu GIF está pronto e postado!=)




Espero que tenha ajudado, criticas e sugestões são bem-vindas!
Um forte abraço a todos!

Nenhum comentário:

Postar um comentário