Como Criar e Adicionar Cinemagraphs no WordPress

Você quer aprender como criar e adicionar cinemagraphs em seus posts do WordPress? Cinemagraphs são imagens com uma parte ou área em movimento enquanto o resto da imagem permanece estático. Essas imagens são altamente envolventes e adicionam um elemento de narrativa aos seus artigos. Neste artigo, mostraremos como criar e adicionar cinemagraphs facilmente no WordPress.

O que são Cinemagraphs?

Cinemagraphs são tipicamente imagens GIF onde uma pequena parte da imagem está em movimento enquanto o resto dela permanece estático. Elas parecem muito cinematográficas, daí o nome cinemagraphs.

Elas adicionam um elemento de narrativa às imagens, o que as torna mais envolventes. Elas são particularmente úteis quando acompanham conteúdo extenso, episódio de podcast, ou uma história em áudio.

Criar cinemagraphs é um pouco diferente de GIFs regulares. No entanto, se você tiver as ferramentas certas, com um pouco de esforço e prática, você será capaz de criar cinemagraphs impressionantes a partir de seus próprios vídeos.

Dito isso, vamos ver como criar e adicionar cinemagraphs facilmente no WordPress.

Criando Cinemagraphs a partir de Vídeos

Para começar, você precisará dos seguintes itens:

1. Um pequeno clipe de vídeo que você deseja converter em um cinemagraph
2. Adobe Photoshop
3. Seu tempo, paciência e criatividade

Vamos começar.

Primeiro, você precisa preparar seu vídeo. Você pode usar uma ferramenta de edição de vídeo como o iMovie para cortar o vídeo até o clipe mínimo necessário para o cinemagraph.

Em seguida, você precisa abrir o Photoshop e importar seu vídeo em camadas clicando no menu Arquivo » Importar » Quadros de Vídeo para Camadas.

Selecione seu vídeo e clique no botão OK para continuar. Dependendo do tamanho do seu vídeo, pode levar um pouco para ser totalmente importado.

Assim que seu vídeo for importado, você verá os quadros de vídeo como camadas no painel de camadas.

Agora você precisa selecionar todas as camadas, exceto a primeira camada (Camada 1).

Vá para o menu Camada » Nova » Grupo de Camadas ou pressione Command + G (CTRL+G no Windows) para adicionar camadas a um grupo.

Em seguida, você precisa selecionar o grupo e ir para Camada » Máscara de Camada » Revelar Tudo para adicionar uma máscara ao grupo.

Após adicionar a máscara, pressione as teclas Command + I (Ctrl + I no Windows) para inverter a cor da máscara.

Agora defina a cor de primeiro plano para branco e clique na ferramenta pincel. Você precisa usar a ferramenta pincel para destacar a área que deseja mostrar no loop.

Depois disso, vá para Janela » Linha do Tempo para abrir todas as suas camadas em formato de animação.

Você notará que todos os quadros aparecem transparentes na linha do tempo, exceto o primeiro quadro.

Para mudar isso, selecione a primeira camada (Camada 1) no painel de camadas e clique no ícone Unificar Visibilidade da Camada e, em seguida, pressione o botão Corresponder.

Em seguida, clique no ícone de alternância da Linha do Tempo e selecione todos os quadros. Depois disso, clique no botão de alternância novamente para escolher Copiar Quadros.

Após copiar os quadros, clique no botão de alternância e selecione a opção ‘Colar Quadros’.

Você será solicitado a escolher um método de colagem. Selecione ‘Colar Após Seleção’ e pressione o botão OK.

Em seguida, você precisará clicar no ícone de alternância da Linha do Tempo mais uma vez e selecionar a opção ‘Inverter Quadros’.

Sua animação cinemagraph está quase pronta.

Para salvá-la em seu computador, vá para a opção Arquivo » Salvar para Web. Isso abrirá um pop-up onde você precisará selecionar o formato GIF e clicar no botão Salvar.

Pronto, seu Cinematograph está pronto.

Você pode adicioná-lo ao seu site como adicionaria qualquer outro GIF no WordPress. Simplesmente edite a postagem ou página onde você deseja adicionar o cinemagraph e clique no botão adicionar mídia.

Isso abrirá a janela pop-up do uploader de mídia, clique no botão selecionar arquivos para fazer o upload do arquivo GIF do seu computador.

Após o upload, clique no botão ‘Inserir no post’ para continuar.

Agora você verá a imagem no seu editor de posts do WordPress.

Não se esqueça de salvar ou atualizar o post. Agora você pode clicar no botão de pré-visualização para ver a cinemagrafia em ação. Aqui está a cinemagrafia que criamos durante este tutorial.

Esperamos que este artigo tenha ajudado você a aprender como criar e adicionar cinemagrafias no WordPress. Você também pode querer ver nossa lista de sites que oferecem imagens gratuitas livres de royalties para usuários do WordPress.

Se você gostou deste artigo, então por favor inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e Facebook.