Criar quadros de animações

Pesquisar

Última atualização em 17 de dez de 2024

Photoshop

Abrir na web

Guia do Usuário do Photoshop

Introdução ao Photoshop

Photoshop e outros produtos e serviços da Adobe

Photoshop para dispositivos móveis (não disponível na China continental)

Photoshop no iPad (não disponível na China continental)

Photoshop na Web (não disponível na China continental)

Photoshop (beta) (não disponível na China continental)

IA generativa (não disponível na China continental)

Autenticidade do conteúdo (não disponível na China continental)

Documentos na nuvem (não disponível na China continental)

Espaço de trabalho

Web design, design de tela e de aplicativos

Noções básicas sobre imagens e cores

Camadas

Seleções

Ajustes de imagem

Adobe Camera Raw

Reparo e restauração da imagem

Aprimoramento e transformação de imagens

Desenho e pintura

Texto

Filtros e efeitos

Salvar e exportar

Gerenciamento de cores

Web design, design de tela e de aplicativos

Vídeo e animação

Impressão

Automação

Solução de problemas

Observação:

Em versões do Photoshop anteriores ao Photoshop CC, algumas funcionalidades discutidas neste artigo ficavam disponíveis somente se o usuário utilizasse o Photoshop Extended. O Photoshop não conta com a opção Extended separada. Todos os recursos do Photoshop Extended fazem parte do Photoshop.

Confira os recursos e as melhorias mais recentes.

Atualizar o Photoshop

Fluxo de trabalho de quadro de animação

No Photoshop, pode-se usar o painel Linha do tempo para criar quadros de animação. Cada quadro representa uma configuração de camadas.

Também é possível criar animações usando uma linha de tempo e quadros principais. Consulte Criar animações de linha do tempo.

Fluxo de trabalho de animação de quadro do Photoshop — Ilustração de uma animação. A imagem do monociclo está em sua própria camada, e a posição dessa camada muda em cada quadro da animação.

Siga estas etapas para criar animações baseadas em quadros no Photoshop.

Abra um novo documento. Se ele ainda não estiver visível, abra os painéis Linha de tempo e Camadas. Coloque o painel Linha do tempo no modo de quadro de animação. No meio do painel de Linha de tempo, clique na seta que aponta para baixo para escolher Criar animação de quadro e clique no botão ao lado da seta.
Adicione uma camada ou converta a camada de fundo. Como não é possível animar uma camada de plano de fundo, adicione uma nova camada ou converta a camada de fundo em uma camada normal.
Adicione conteúdo à animação. Se a animação incluir vários objetos que sejam animados independentemente, ou para alterar a cor de um objeto ou alterar completamente o conteúdo em um quadro, crie os objetos em camadas separadas.
Criar animação de quadros. No painel Linha de tempo, selecione a seta para baixo para selecionar Criar animação de quadros.
Adicione um quadro no painel Linha do tempo.
Selecione um quadro de animação.
Edite as camadas para o quadro selecionado.
- Ative e desative a visibilidade para diferentes camadas.
- Altere a posição de objetos ou camadas para mover o conteúdo da camada.
- Altere a opacidade da camada para fazer o conteúdo aparecer ou desaparecer gradualmente.
- Altere o modo de mesclagem das camadas.
- Adicione um estilo às camadas.
O Photoshop oferece ferramentas para manter as mesmas características de uma camada em todos os quadros.
Adicione mais quadros e edite as camadas conforme necessário. O número de quadros que podem ser criados é limitado apenas pela quantidade de memória disponível no sistema para o Photoshop.

Gerar novos quadros com alterações intermediárias entre dois quadros existentes no painel usando o comando Transição. É uma maneira rápida de fazer um objeto se mover pela tela ou, gradualmente, aparecer ou desaparecer.
Defina as opções de looping e o tempo de retardo dos quadros. Pode-se atribuir um tempo de atraso a cada quadro e especificar um looping que a animação seja reproduzida uma vez, um número determinado de vezes ou continuamente.
Visualize a animação. Use os controles no painel Linha do tempo para reproduzir a animação conforme ela for criada. Depois, use o comando Salvar para Web a fim de visualizar a animação no navegador da Web.
Otimize a animação para obter um download mais eficaz.
Salve a animação usando qualquer uma destas etapas.
- Salve como um GIF animado usando o comando Salvar para Web.
- Salve no formato Photoshop (PSD) para que você possa fazer mais trabalho na animação posteriormente.
- Salve como uma sequência de imagens, um filme QuickTime ou como arquivos separados.

Como adicionar quadros a uma animação

A inclusão de quadros é o primeiro passo na criação de uma animação. Se uma imagem estiver aberta, o painel Linha do tempo a exibirá como o primeiro quadro de uma nova animação. Cada quadro adicionado começa como uma duplicata do quadro anterior. Depois, use o painel Camadas para fazer alterações no quadro.

Coloque o painel Linha do tempo no modo de quadro de animação.
Clique no botão Duplicar quadros selecionados .

Seleção de quadros de animação

Antes de poder trabalhar com um quadro, é necessário selecioná-lo como o quadro atual. O conteúdo do quadro atual aparece na janela de documentos.

No painel Linha do tempo, o quadro atual é indicado por uma borda estreita (por dentro do realce de seleção sombreado), ao redor de sua respectiva miniatura. Os quadros selecionados são indicados por um realce sombreado ao redor de suas respectivas miniaturas.

Seleção de um quadro de animação

Siga um destes procedimentos no painel Linha do tempo:
- Clique em um quadro.
- Clique no botão Selecionar próximo quadro para selecionar o próximo quadro na série como o quadro atual.
- Clique no botão Selecionar quadro anterior para selecionar o quadro anterior na série como o quadro atual.
- Clique no botão Selecionar primeiro quadro para selecionar o primeiro quadro na série como o quadro atual.

Seleção de vários quadros de animação

No painel Linha de tempo, siga um destes procedimentos:
- Para selecionar vários quadros contíguos, clique em um segundo quadro com a tecla Shift pressionada. O segundo quadro e todos os quadros entre o primeiro e o segundo são adicionados à seleção.
- Para selecionar vários quadros não contíguos, clique nos quadros adicionais com a tecla Ctrl (Windows) ou Command (Mac OS) para adicioná-los à seleção.
- Para selecionar todos os quadros, escolha Selecionar todos os quadros no menu do painel.
- Para desmarcar um quadro em uma seleção de vários quadros, clique nele com a tecla Ctrl (Windows) ou Command (Mac OS) pressionada.

Edição de quadros de animação

No painel Linha do tempo, selecione um ou mais quadros.
Siga um destes procedimentos:
- Para editar o conteúdo de objetos em quadros de animação, use o painel Camadas para modificar as camadas na imagem que afetem o quadro.
- Para alterar a posição de um objeto em um quadro de animação, selecione a camada contendo o objeto no painel Camadas e arraste-o para a nova posição.
Observação:

Você pode selecionar e alterar a posição de vários quadros. Entretanto, ao arrastar vários quadros não adjacentes, eles são inseridos consecutivamente na nova posição.
- Para inverter a ordem dos quadros de animação, no menu do painel, escolha Inverter quadros.
Observação:

Os quadros a serem invertidos não precisam ser adjacentes; pode-se inverter quaisquer quadros selecionados.
- Para excluir os quadros selecionados, escolha Excluir quadro no menu do painel Linha do tempo, ou clique no ícone Excluir e, em seguida, clique em Sim para confirmar a exclusão. Também é possível arrastar o quadro selecionado para o ícone Excluir.

Unificar propriedades de camada em quadros de animação

Os botões de unificação (Unificar a posição da camada, Unificar a visibilidade da camada e Unificar o estilo de camada) no painel Camadas determinam como as alterações feitas nos atributos do quadro de animação ativo aplicam-se aos outros quadros na mesma camada. Ao selecionar um botão de unificação, o atributo é alterado em todos os quadros na camada ativa. Quando o botão é desmarcado, as alterações aplicam-se apenas ao quadro ativo.

A opção Propagar quadro 1 no painel Camadas também determina como as alterações feitas nos atributos do primeiro quadro aplicam-se aos outros quadros da mesma camada. Ao selecioná-la, a alteração de um atributo no primeiro quadro faz com que todos os quadros subsequentes na camada ativa sejam alterados conforme o primeiro (e preservando a animação já criada).

Unificação de propriedades de camada

No painel Linha do tempo, altere o atributo em um quadro.
No painel Camadas, clique em Unificar a posição da camada , Unificar a visibilidade da camada ou Unificar o estilo de camada para que o atributo alterado seja aplicado a todos os outros quadros na camada ativa.

Propagar Quadro 1

No painel Camadas, selecione a opção Propagar quadro 1.
No painel Linha do tempo, altere o atributo para o primeiro quadro.

O atributo alterado é aplicado (em relação) a todos os quadros subsequentes em uma camada.

Observação:

Também é possível propagar quadros selecionando qualquer grupo de quadros consecutivos em uma camada selecionando a tecla Shift e alterando um atributo em qualquer um dos quadros selecionados.

Mostrar ou ocultar os botões de unificação de camadas

Escolha Opções de animação no menu do painel Camadas e selecione uma das opções a seguir:

Automático

Exibe os botões de unificação de camadas quando o painel Linha do tempo está aberto.

Sempre Mostrar

Exibe os botões de unificação de camadas com o painel Linha do tempo aberto ou fechado.

Sempre Ocultar

Oculta os botões de unificação de camadas com o painel Linha do tempo aberto ou fechado.

Copiar quadros com propriedades de camada

Para entender o que acontece quando um quadro é copiado e colado, imagine-o como uma versão duplicada de uma imagem, com uma determinada configuração de camada. Ao copiar um quadro, copiam-se as configurações de camadas (incluindo as configurações de visibilidade, posição e outras propriedades de cada camada). Ao colar um quadro, aplica-se a mesma configuração de camada ao quadro de destino.

Selecione um ou mais quadros a serem copiados no painel Linha do tempo.
No menu do painel, escolha Copiar quadro(s).
Selecione um quadro ou mais quadros de destino na animação atual ou em outra animação.
No menu do painel, escolha Colar quadro(s).
Selecione um método de Colar:

Substituir Quadros

Substitui os quadros selecionados pelos quadros copiados. Nenhuma nova camada é adicionada. As propriedades de cada camada existente nos quadros de destino são substituídas pelas propriedades copiadas de cada camada. Quando quadros são colados entre uma imagem para outra, novas camadas são adicionadas à imagem, mas apenas as camadas coladas ficam visíveis nos quadros de destino (as camadas existentes permanecem ocultas).

Colar sobre a Seleção

Adiciona o conteúdo dos quadros colados como novas camadas na imagem. Ao colar quadros na mesma imagem, use essa opção para dobrar o número de camadas na imagem. Nos quadros de destino, as camadas recém-coladas são visíveis, enquanto as originais ficam ocultas. Nos quadros que não são de destino, as camadas recém-coladas ficam ocultas.

Colar Antes da Seleção ou Colar Após Seleção

Adiciona os quadros copiados antes ou após o quadro de destino. Quando quadros são colados de uma imagem para outra, novas camadas são adicionadas à imagem, mas apenas as camadas coladas ficam visíveis nos novos quadros (as camadas existentes permanecem ocultas).
(Opcional) Para vincular as camadas coladas no painel Camadas, selecione Vincular camadas adicionadas.

Essa opção só funciona quando os quadros são colados em outro documento. Selecione-a quando planejar reposicionar as camadas coladas como uma unidade.
Clique em OK.

Criação de quadros usando transições

O termo tweening (transição) é uma derivação de "in betweening" (interpolação), que é um termo tradicional na área de animação usado para descrever esse processo. As transições (também chamadas de interpolação) reduzem significativamente o tempo exigido para criar efeitos de animação, como aparecimento e desaparecimento, ou movimentação de um elemento sobre um quadro. Depois de criados, os quadros agrupados em transições podem ser editados individualmente.

Use o comando Transição para adicionar ou modificar automaticamente uma série de quadros entre dois quadros existentes, variando as propriedades de camadas (parâmetros de posição, opacidade ou efeito) igualmente nos novos quadros para criar a ilusão de movimento. Por exemplo, para fazer com que uma camada desapareça gradualmente, defina a opacidade da camada no quadro inicial como 100% e, em seguida, defina a opacidade da mesma camada no quadro final como 0%. Quando a transição for feita entre os dois quadros, a opacidade da camada será reduzida uniformemente entre os novos quadros.

Criação de quadros usando transições do Photoshop — Uso de transições para animar a posição do texto

Para aplicar transições a uma camada específica, selecione-a no painel Camadas.
Selecione um único quadro ou vários quadros adjacentes.
- A seleção de um único quadro permite optar pela transição desse quadro com o anterior ou o seguinte.
- A seleção de dois quadros contíguos fará com que novos quadros sejam adicionados entre eles.
- A seleção de mais de dois quadros fará com que os quadros existentes entre o primeiro e o último selecionados sejam alterados pela operação de transição.
- A seleção do primeiro e do último quadros de uma animação fará com que eles sejam tratados como contíguos, e os quadros de transição são adicionados depois do último. (Esse método de transição é útil quando a animação está definida para executar loop várias vezes.)
Siga um destes procedimentos:
- Clique botão Transições no painel Linha do tempo.
- No menu do painel, escolha Transição.
Especifique a(s) ou camada(s) que serão modificadas nos quadros adicionados:

Todas as Camadas

Modifica todas as camadas em um ou mais quadros selecionados.

Camada Selecionada

Modifica apenas a camada atualmente selecionada em um ou mais quadros selecionados.
Especifique as propriedades de camada a serem modificadas:

Posição

Altera uniformemente a posição do conteúdo da camada nos novos quadros, entre os quadros inicial e final.

Opacidade

Modifica uniformemente a opacidade dos novos quadros, entre os quadros inicial e final.

Efeitos

Modifica igualmente as configurações de parâmetros de efeitos de camada entre o primeiro e o último quadros.
Ao selecionar um único quadro na etapa 2, no menu Transição para, escolha um local para adicionar os quadros:

Próximo Quadro

Adiciona quadros entre o quadro selecionado e o quadro seguinte. Essa opção não fica disponível quando o último quadro do painel Linha do tempo está selecionado.

Primeiro Quadro

Adiciona quadros entre o último e o primeiro quadro. Essa opção apenas fica disponível quando o último quadro do painel Linha do tempo está selecionado.

Quadro Anterior

Adiciona quadros entre o quadro selecionado e o quadro anterior. Essa opção não fica disponível quando o primeiro quadro do painel Linha do tempo está selecionado.

Último Quadro

Adiciona quadros entre o primeiro e o último quadro. Essa opção apenas fica disponível quando o primeiro quadro do painel Linha do tempo está selecionado.
Na caixa Quadros a Adicionar, digite um valor ou use a tecla de Seta para cima ou Seta para baixo para escolher o número de quadros. (Esta opção não está disponível ao selecionar mais de dois quadros.)
Clique em OK.

Adicionar uma camada nova para cada quadro novo

O comando Criar nova camada para cada quadro novo adiciona automaticamente uma nova camada visível no novo quadro, mas oculta em outros quadros. Essa opção poupa tempo durante o processo de criação de uma animação que requer a adição de um novo elemento visual em cada quadro.

Escolha Criar nova camada para cada novo quadro no menu do painel Linha do tempo.

Uma marca de seleção indica que a opção está ativada.

Ocultar camadas em quadros de animação

Quando uma nova camada é criada, por padrão, ela fica visível em todos os quadros de uma animação.

Para mostrar novas camadas somente em quadros ativos, cancele a seleção de Novas camadas visíveis em todos os quadros no menu do painel Linha do tempo.
Para ocultar uma camada em um quadro específico, selecione o quadro e, no painel Camadas, oculte a camada desejada.

Especificação de um tempo de retardo em quadros de animação

É possível especificar um atraso, ou seja, o tempo durante o qual um quadro é exibido, para quadros individuais ou para vários quadros de uma animação. O tempo de atraso é exibido em segundos. Frações de segundos são exibidas como valores decimais. Por exemplo, um quarto de segundo é especificado como 0,25. Se você definir um atraso no quadro atual, todos os quadros criados depois disso memorizarão e aplicarão esse valor de atraso.

Selecione um ou mais quadros no painel Linha do tempo.
Clique no valor de Atraso, abaixo do quadro selecionado, para visualizar o menu pop-up.
Especifique o atraso:
- Escolha um valor no menu pop-up. (O último valor usado aparece na parte inferior do menu.)
- Escolha Outro, digite um valor na caixa de diálogo Definir atraso do quadro e clique em OK. Ao selecionar vários quadros, o valor de atraso especificado para um deles é aplicado a todos os outros quadros.

Escolher um método de disposição de quadro

O método de descarte de quadros especifica se o quadro atual deve ser descartado antes da exibição do quadro seguinte. Selecione um método de descarte para animações que inclua transparência de fundo para especificar se o quadro atual ficará visível através das áreas transparentes do quadro seguinte.

Métodos de descarte de quadros do Photoshop — Métodos de descarte de quadros

A. Quadro com transparência de plano de fundo, usando a opção Restaurar para o fundo B. Quadro com transparência de plano de fundo, usando a opção Não descartar

O ícone do Método de descarte indica se o quadro está definido para Não descartar ou Descartar. (Nenhum ícone aparece quando a opção de método de descarte está definida como Automático.)

Selecione um ou mais quadros para os quais escolher um método de descarte.
Clique com o botão direito do mouse (Windows) ou com a tecla Control (Mac OS) na miniatura do quadro para visualizar o menu de contexto Método de descarte.
Escolha um método de descarte:

Automático

Determina automaticamente um método de disposição para o quadro atual, descartando o quadro atual se o seguinte incluir transparência de camada. Para a maioria das animações, a opção Automático (padrão) produz os resultados desejados.

Observação:

Para preservar os quadros que incluem transparência, selecione Descarte automático, ao usar a opção de otimização Remoção de pixel redundante.

Não Dispor

Preserva o quadro atual à medida que o quadro seguinte é adicionado à exibição. É possível exibir o quadro atual (e os anteriores) através das áreas transparentes do quadro seguinte. Use um navegador para ter uma visualização precisa de uma animação com a opção Não descartar.

Dispor

Descarta o quadro atual da exibição antes de mostrar o quadro seguinte. Apenas um quadro é exibido por vez (e o quadro atual não aparece através das áreas transparentes do quadro seguinte).

Especificação de looping em quadros de animação

Selecione uma opção de looping para especificar quantas vezes a sequência de animação é repetida durante a reprodução.

No canto inferior esquerdo do painel Linha do tempo, clique na caixa Seleção de opções de looping.
Selecione uma opção de looping: Uma vez, Três vezes, Sempre ou Outra.
Ao selecionar Outra, digite um valor na caixa de diálogo Definir total de loops e clique em OK.

Observação:

As opções de looping também podem ser definidas na caixa de diálogo Salvar para Web.