Arquivo da tag: cinemagraph

Como Fazer “Cinemagraphs” no Photoshop

Oi, pessoal, tudo bem?

Desde que publiquei o post anterior tenho recebido várias dúvidas sobre como fazer cinemagraphs usando o Photoshop. Então achei uma boa idéia sanar (quase) todas de uma vez e fazer um tutorial específico para ele :).

Usei o Photoshop CS4 em inglês para produzir este tutorial, com um vídeo cedido pela visitante Sheslla, que puxou bastante minha orelha para ajudá-la com cinemagraphs :P. Obrigado, Sheslla! E parabéns pelo belo vídeo :D, que pode ser visto abaixo:

Cliquem nas imagens caso queiram ampliá-las.

1 – Importando o vídeo para o Photoshop.

Vá ao menu File > Import > Video Frames to Layers.

Selecione o arquivo de vídeo desejado. Em seguida surgirá uma janela para que você determine um intervalo de frames (quadros) do vídeo que serão importados como layers (camadas) dentro do programa. Configure o “pedaço” do vídeo que deseja, marque a opção Make Frame Animation e confirme.

Caso o painel Animation não esteja visível no seu programa, vá ao menu Window e marque a opção Animation. Nesse painel, as layers aparecem como frames. O número abaixo da miniatura de cada quadro é a duração (em segundos) do quadro na animação.

2. Alinhando os quadros.

Os desafios encontrados durante a produção de um cinemagraph dependem do que se deseja fazer, e do material que se tem disponível. No caso do que estamos fazendo, um dos problemas encontrados foi o movimento da câmera durante a gravação do vídeo.

Uma solução para isso é ir no menu Edit > Auto-Align Layers. Uma nova janela se abrirá, com as opções do comando. No nosso caso só precisamos reposicionar as camadas de modo a alinhá-las, por isso foi selecionada  a opção Reposition, e confirmada a operação.

Dependendo das dimensões e da quantidade de camadas, pode levar um bom tempo até a conclusão do alinhamento. Vá tomar um cafezinho :P.

Após esse processo, muito provavelmente será necessário cortar alguns excessos da área da imagem. Isso pode ser feito com a ferramenta Crop (C). Simplesmente selecione a área que deseja manter e pressione a tecla Enter.

Aperte o botão de play no painel Animation para verificar se em nenhum quadro restaram áreas “vazias”. Caso tenham restado, use a ferramenta Crop novamente.

4. Mantendo determinadas partes da animação “estáticas”.

Agora a parte que mais interessa! E a mais simples :P…

Selecione a camada que contém as áreas que você deseja que fiquem “estáticas”. Duplique a camada e a coloque acima de todas as outras. Em seguida selecione a ferramenta borracha, e escolha um Brush com bordas extremamente suaves.

Agora apague na camada duplicada toda a área que você deseja que se mova durante a animação.

Ta-dah! Se você tiver apagado certinho, quando executar a animação verá que as áreas não apagadas parecerão “estáticas”, como desejado.

5. Ajustes finais.

Aqui aplicamos algumas outras táticas, como remover frames muito parecidos com o inicial e o final e aumentar a duração destes (é só clicar duas vezes sobre o frame e as opções aparecerão).

6. Salvando a animação GIF.

Agora é só ir no menu File> Save for Web and Devices, selecionar o formato GIF na parte superior direita, e brincar com as outras configurações caso queira alterar a qualidade/tamanho do arquivo final. Ao terminar, clique em Save e selecione o local de destino.

Pronto, a mágica está feita, eis um cinemagraph :D! Vejam o resultado final (talvez seja necessário clicar para abrir o .gif em movimento):

Caso tenham alguma dúvida ou sugestão, podem mandar ver, estou aqui para isso :D!

Abraços!

Como Fazer “Cinemagraphs”

Ultimamente têm se falado em vários blogs sobre as impressionantes fotografias animadas de Jamie Beck, que começaram a ser postadas em seu perfil no tumblr.

Imagens .gif animadas não são novidade, nem mesmo as que usam esse conceito de “partes imóveis + partes em movimento”. A grande sacada de Beck foi usar o conceito artisticamente, e não humoristicamente, como é o comum.

Exemplo de GIF que já usava a idéia
Exemplo de GIF que já usava a idéia

Mas esse diferencial acabou despertando o interesse de outros artistas, especialmente amantes da fotografia, como minha amiga Fabiana, sobre como fazer essas tais fotografias animadas, que têm sido chamadas, por Jamie, de cinemagraphs (algo como “cinemagrafias”).

Antes de tudo, é preciso ter em mãos um programa que trabalhe com imagens .gif animadas. Há dezenas, como o Photoshop, o Fireworks e até alguns gratuitos. E hoje em dia praticamente todo programa de edição de imagem suporta editar animações nesse formato. Basta pesquisar “como fazer gif animado” junto com o nome do programa que você mais usa, e provavelmente aparecerão vários tutoriais.

Este tutorial será bem genérico nesse aspecto, não se focando no uso de um programa específico, podendo ser aplicado até em contextos diferentes de um imagem GIF animada…

1. Obtendo as imagens que serão usadas: No caso do uso “artístico” do conceito, objetivo deste post, filme a cena da qual deseja fazer o GIF mantendo a câmera e outros elementos da cena que desejar em uma posição o mais imóvel possível.

2. Transformando o vídeo em gif animado: Há várias formas de se fazer isso. Há programas e sites que fazem isso automática e gratuitamente, como o GIFSoup, mas nem sempre com a qualidade desejada. Uma das formas ideias para GIFs de alta resolução como os de Jamie Beck é a explicada neste link, usando o Photoshop.

3. Fazendo a animação se repetir “suavemente”: Essa parte pode ser mais ou menos complicada dependendo do caso. As principais dicas são:

– Compare o primeiro quadro (ou frame; é cada imagem que compõe a animação e é exibida por uma determinada quantidade de tempo) com o último, e delete este se não estiver satisfatoriamente parecido com o primeiro. Repita o processo até que encontre um quadro suficientemente parecido.

– Se a dica anterior não tiver resolvido o problema, um truque que pode servir em algumas ocasiões é fazer a animação “inversa” logo após a animação normal. Ou seja, ir copiando os quadros anteriores ao último e adicionando ao final da animação, até chegar no primeiro, gerando uma sensação de “vai-e-volta” que em alguns casos nem dá pra ser notada e torna a transição entre repetições completamente imperceptível.

– Se a transição entre uma repetição e outra ainda não estiver imperceptível o suficiente, tente diminuir o tempo de duração dos últimos quadros, para a transição ser mais rápida.

– Se nada funcionar, pode ser necessário realmente editar as imagens de alguns quadros das formas mais diversas, das mais simples às mais complexas…

4. Mantendo determinadas partes da animação “imóveis”: Escolha um quadro que contém as partes imóveis do jeito que deseja, copie a imagem dele e apague nela as áreas que irão se mover. Faça com que essa imagem se repita para todos os outros quadros, sobreposta às imagens originais deles. Isso vai “tapar” com uma imagem estática tudo o que você não quer que se mova. O jeito de fazer isso pode variar dependendo do programa utilizado.

Salve o .gif animado de acordo com as instruções para o seu programa, e voilá, você fez um cinemagraph =D.

Caso alguém tenha dúvidas na criação e edição de .gifs animados usando algum programa específico, é só perguntar nos comentário que eu farei o possível para ajudar =).

PS.: Escrevi um tutorial de como fazer usando o Photoshop! Veja aqui.