Como animar seu próprio GIF personalizado com o Photoshop

Criar animações do zero no Photoshop pode parecer assustador, mas, na verdade, elas são muito simples. Abra o Photoshop e pegue alguns de seus arquivos. É hora de aborrecer as calças dos seus amigos com muitos GIFs animados!

Nós conversamos sobre algumas maneiras simples de transformar vídeo e Youtube em GIFs animados, mas hoje vamos mostrar como fazer uma animação simples sem usar nenhum arquivo de vídeo. Continue lendo - isso é muito divertido.

Criando animações com as ferramentas de animação do Photoshop

Para uma animação simples, criaremos uma parte da imagem em uma camada separada que podemos mover. Estaremos apenas animando o movimento dos olhos, mas você pode criar qualquer tipo de animação dessa maneira, incluindo células reais de animação desenhadas à mão ou fotografias em movimento..

Independentemente do que você deseja animar, comece com pelo menos duas camadas. Em nosso exemplo, estamos usando o logotipo HTG e estamos movendo os olhos para uma segunda camada que podemos usar para animar o movimento.

Para começar, abra o painel Animação. Encontre-o indo em Window> Animation.

O painel aparece na parte inferior da janela e é bastante simples de usar. Cada novo “quadro” da animação é como um instantâneo do arquivo. Clique no no painel de animação sempre que você quiser criar um novo instantâneo fora do estado atual do arquivo. Mas ainda não!

Este painel também permite definir um “atraso” para cada quadro individual, ou seja, por quanto tempo (no todo ou em frações de segundo) ele é exibido na tela antes de avançar para o próximo quadro. 25 quadros por segundo (0,04) é uma taxa padrão para animação, mas talvez um pouco rápida para GIFs animados. Para nosso exemplo, comprometemos um atraso de 0,05, que você também pode usar. Se você quiser usar um número diferente de quadros por segundo, simplesmente divida 1 pelo número de quadros para obter o tempo de atraso adequado. (Por exemplo, 1 segundo dividido por 25 quadros é igual a 0,04 de atraso).

A ideia é mover a camada dos olhos pequenos incrementos e tirar instantâneos ao longo do caminho. Nós estaremos usando o mover ferramenta (tecla de atalho "V") e cutucando nossa camada usando o teclas de seta. Em nosso exemplo, tiramos uma foto depois de cutucar cada dois pixels ou mais.

Clicando no no painel, você pode ver novos quadros criados na animação. Eles tomam o tempo de atraso do quadro antes deles, então você pode querer escolher o atraso certo em primeiro lugar, para que você não tenha que mudar cargas de quadros quando você terminar de capturar as imagens.

(Nota do autor: Se você for como eu, você estará ajustando o atraso um zilhão de vezes, de qualquer forma. As coisas nem sempre funcionam da maneira exata que você quer!)

Coloque seus quadros à medida que avança, usando seu painel de camadas para mover seu objeto (no nosso exemplo, os olhos), da maneira que você quiser, e tire muitos e muitos instantâneos. Lembre-se, 25 ou mais serão iguais a um segundo, então tire suas fotos de acordo.

Você também pode editar o atraso de vários quadros de uma só vez usando a tecla Shift e selecionando muitos ou todos os seus quadros e alterando o atraso. Observe que você pode definir seu atraso como "Outro ..." próximo ao final para usar nosso atraso personalizado de 0,05.

Navegue até Arquivo> Salvar para Web e Dispositivos para abrir a ferramenta com o mesmo nome.

Esta ferramenta permitirá que você crie um GIF animado para o navegador, além de testá-lo dentro da ferramenta (como mostrado acima, onde está o cursor da seta). Certifique-se de definir seu tipo de arquivo para GIF e use qualquer uma das configurações Perceptivo, Seletivo ou Adaptativo. Estes podem mudar sua imagem de maneiras diferentes, mas para muitos de vocês darão resultados quase idênticos. Para reduzir o tamanho do arquivo, você pode alterar Tamanho da imagem (na parte inferior) e seu número de Cores (no lado superior direito). Você também pode reduzir o tamanho do seu arquivo, não incluindo uma transparência, embora não tenhamos em nosso exemplo (whoops!).

E o nosso GIF animado está pronto para ser colocado na web para encantar, chocar e criar admiração.

E isso envolve a animação. Pensamentos ou perguntas sobre o nosso método? Tem um método melhor ou algumas técnicas mais simples? Quer ver algo mais avançado? Conte-nos sobre eles nos comentários ou envie-nos seus pensamentos em [email protected], e podemos incluí-los em um artigo gráfico.