O documento fornece instruções passo-a-passo para criar um GIF animado usando o site Pixton para desenhar quadrinhos, o Paint para recortar cada imagem e o site Picasion para juntar as imagens em um GIF. O GIF animado pode então ser incorporado em um blog para atrair mais visitantes.

1. Vamos MELHORAR o visual do nosso BLOG, colocando uma atração “chamativa” denominada GIF
ANIMADO. Que é uma sequencia de imagens integradas em um mesmo arquivo, simulando
movimento.
Agora que já temos alguns conhecimentos do excelente aplicativo online PIXTON, podemos criar uma
série de quadrinhos, que serão a base para a nossa animação, sem os diálogos, naturalmente.
Claro, imagine sempre uma sequencia que vai ser incorporada ao seu projeto, com alguma
movimentação significativa. O endereço é http://www.pixton.com/br/my-home na opção CRIAR !
Neste exemplo, pensei em vencer obstáculos e correr para casa, mesmo enfrentando alguns
“problemas” no percurso, para utilizar o computador em nossas práticas!
Em seguida, você pode usar o PRINT – SCREEN, após concluir o seu quadrinho no site da PIXTON!

2. Feito isto, vamos colar a sequência de quadrinhos no PAINT, para recortar cada imagem e fazer um
“quadrinho” de nossa animação. Use sempre a ferramenta SELECIONAR, para depois recortar com
CTRL + X, depois escolher ARQUIVO, NOVO, COLAR e salvar como Imagem1.png:
 Ferramenta selecionar do PAINT ( de forma retangular )
 Primeiro quadrinho selecionado no PAINT e pronto para ser recortado com CTRL + X
 Quadrinho colado em um novo arquivo e salvo na área de trabalho como imagem1.png
 VAMOS REPETIR A OPERAÇÃO para todos os outros quadrinhos!!

3. Feito isto, temos na área de trabalho SEIS IMAGENS:
Imagens salvas em minha área de trabalho ( deste meu exemplo ) !
Agora vamos escolher um programa para gerar um GIF ANIMADO LIVRE na Internet:
( experimentei diversas opções, achei este muito simples e divertido )
Este endereço para criar um GIF é: http://picasion.com/pt/
Nesta tela inicial, vamos carregar ( upload ) as nossas imagens da área de trabalho:
No meu exemplo, escolhi Adicionar mais, para INSERIR minhas seis imagens.

4. Sem mais nenhuma modificação, podemos escolher a opção no botão abaixo, “Criar animação”.
Pronto: nossa animação foi gerada, está arquivada naquele endereço, bastando, “capturar” o seu
significado, que está estampado mais abaixo e recebe o nome de “código de programação”. Vamos
usar a opção “HTML para SITES”, para poder inserir a novidade em nosso Blog!
Bem, agora podemos voltar ao nosso Blog, na postagem que desejamos colocar a animação !
Como temos um “código” de programação, vamos escolher a opção HTML !
Abrimos um espaço depois de uma divisão <DIV> e colamos nossa “imagem”:
Depois disto, escolhemos Escrever, PARA AJUSTAR com o mouse, o TAMANHO e a POSIÇÃO e o
TAMANHO DA IMAGEM, que na verdade, é uma junção animada das seis imagens anteriores:

5. Não esqueça de escolher na parte direita, superior, o botão ATUALIZAR para SALVAR SUAS
ALTERAÇÕES e depois veja o resultado com a opção Visualizar Blog !
Nossa ideia final :
Confira este resultado em http://mayer2013.blogspot.com.br/p/algumas-praticas-iniciais.html !!!
Apenas para resumir nosso trabalho, guarde estas definições: