Vamos continuar a fazer o gif que iniciamos na primeira parte desse artigo. Nessa segunda parte vamos manipular as imagens criadas no Corel no Photoshop, ou melhor, no Image Ready, que vem junto com o Photoshop. Se ainda não possui os programas, faça o download das versões trial nos links que deixei na primeira parte.
Abra o Image Ready e clique em File – Import – Folder as Frame e selecione a pasta onde salvou as figuras feitas no Corel Draw. Selecione a pasta inteira, não as figuras individuais e clique em ok. Você verá, como na imagem abaixo, que todas as imagens são importadas para o Image Ready.
Agora vamos configurar o tempo de cada frame (imagem) no momento em que o gif for visualizado. Na parte inferior esquerda do Image Ready você pode ver a caixa Animation, onde aparece todas as imagens e embaixo um O sec (significa 0 segundos), clique no símbolo de play e veja como ficaria nessa configuração.
Configurando o tempo de execução
Para o nosso exemplo clique na seta ao lado de 0 sec e coloque 2 segundos nas imagens 150×1501, 150x1502x 150×1503. Se quiser adiantar e selecionar as três imagens de uma vez basta pressionar a tecla Ctrl e clicar com o mouse nelas, depois solte a tecla Ctrl e clique com o mouse em uma das setas e o valor inserido será válido para as três imagens. Para as imagens 150×1504 e 150×1505 coloque 1 segundo. Acione o play para ver como ficou. Agora vamos salvar nossa gif. Clique em Saved Optimized As… escolha uma pasta onde salvar o gif e dê o nome que quiser, no meu caso ficou banner. Pronto, pode fechar o Image Ready, se quiser pode salvar o projeto para alterar mais tarde, como salvaria qualquer outro arquivo de seu computador.
Publicando seu gif
Bom, agora que o gif está pronto, é necessário publicá-lo no blog, assim como fiz com esse na lateral direita do blog. Você precisará colocar seu gif na web (hospedagem própria ou em algum site gratuito como o Photobucket, se você utiliza o Firefox eu recomendo esse plugin para facilitar a tarefa) e de um código html para que ele possa ser “chamado” por seu blog e aparecer para os leitores.Faça o upload de seu banner para sua hospedagem (gratuita ou própria) e vamos ao código html.
<a href=”http://feeds.feedburner.com/bloggustavo” target=”_blank”><img src=”http://comoinstalar.com.br/banner/banner.gif”/></a>
Repare que o código abaixo não tem essa quebra de linha inserida aqui. Na primeira parte do código, logo depois do <a hef você deve inserir o endereço que deseja que abra quando clicarem no gif e na segunda parte, após o src você colocará o endereço em que está salvo sua gif. Esse código faz aparecer o gif que fizemos nesse tutorial.
Agora vamos colocar o código html no seu blog. Se você utiliza o Blogger, abra o painel de controle, clique em Layout, Elementos da página e em adicionar um gadget, escolha html/javascript, cole o código e clique em salvar. Visualize o blog e veja como ficou. Se você utiliza o WordPress acesse o painel de controle, clique em Design, widgets, escolha text e em edit no widget criado, cole o código e clique em change. Entre no blog e veja como ficou.
Conclusão
meu objetivo nesses dois artigos foi demonstrar que fazer um gif simples é “simples”. Agora um pouco mais de dedicação e buscas no Google e você pode fazer gifs maravilhosos e divulgar seu blog e ou promoções sem a necessidade da ajuda de outras pessoas. Como prometi, segue alguns programas gratuitos que podem substituir os programas pagos vistos aqui.
Photoshop
Corel Draw
- Sodipodi
Lembrando que coloquei na primeiro artigo o link para o download das versões trial, funcionais por 15 e 30 dias dos programas Corel Draw e Photoshop, inclusive estou utilizando a versão trial do Photoshop, já que possuo apenas o Corel Draw original.
@Luis Marcos Leite – Grande Luis, sempre dando dicas ótimas,
um abraço.
Gente,
Também tem o Gimp (similar ao Photoshop), que é 0800, e no link abaixo tem um pequeno tutorial em vídeo:
http://ruimoura.net/blog/2006/12/12/como-fazer-um-gif-animado-com-o-gimp-gimp-tutorial/
Acessem e vejam o que acham.
Luis Marcos Leite Escreveu um post sobre… Microsoft anuncia vulnerabilidade no controle activeX de vídeo
@Jan Carle – Olhei o programa e achei, numa primeira impressão, muito bom, com duas vantagens, online e gratuito,
um abraço.
Excelente artigo! estava buscando esta informação bem detalhada já há algum tempo. Aliás se for permitido, passo uma dica que descobri e esquevi no meu Blog, com relação ao substituto do photoshop, e de graça: http://www.netjan.com/blog/2009/03/05/editor-grafico-online/.
Jan Carle Escreveu um post sobre… RESOLUÇÃO 300 (CONTRAN)
Gostei das Informações, criação e desenvolvimento do Site!!!!