Guia do Usuário Cancelar

Animação quadro a quadro no Animate

  1. Guia do Usuário do Adobe Animate
  2. Introdução ao Animate
    1. Novidades no Animate
    2. Glossário visual
    3. Requisitos de sistema do Animate
    4. Atalhos de teclado do Animate
    5. Trabalhar com vários tipos de arquivo no Animate
  3. Animação
    1. Noções básicas de animação no Animate
    2. Como usar quadros e quadros-chave no Animate
    3. Animação quadro a quadro no Animate
    4. Como trabalhar com animação de interpolação clássica no Animate
    5. Ferramenta Pincel
    6. Guia de movimento
    7. Interpolação de movimento e ActionScript 3.0
    8. Sobre a animação com interpolação de movimento
    9. Animações de interpolação de movimento
    10. Criação de uma animação de interpolação de movimento
    11. Utilização dos quadros-chave de propriedade
    12. Animação de posição com uma interpolação
    13. Editar interpolações de movimento usando o Motion Editor
    14. Edição do caminho de movimento de uma animação de interpolação
    15. Manipulação de interpolações de movimento
    16. Adição de atenuações personalizadas
    17. Criação e aplicação das predefinições de movimento
    18. Configuração de extensões de interpolação de animação
    19. Trabalhar com interpolações de movimento salvas como arquivos XML
    20. Interpolações de movimento e interpolações clássicas
    21. Interpolação de formas
    22. Uso da animação da ferramenta Bone no Animate
    23. Trabalho com articulações de personagens no Animate
    24. Como usar camadas de máscara no Adobe Animate
    25. Como trabalhar com cenas no Animate
  4. Interatividade
    1. Como criar botões com o Animate
    2. Converter projetos do Animate em outros formatos de tipo de documento
    3. Criação e publicação de documentos HTML5 Canvas no Animate
    4. Adicionar interatividade com snippets de código no Animate
    5. Criar componentes HTML5 personalizados
    6. Uso de componentes do HTML5 Canvas
    7. Criação de componentes personalizados: exemplos
    8. Snippets de código para componentes personalizados
    9. Práticas recomendadas - Publicidade com o Animate
    10. Criação e publicação de Realidade virtual
  5. Fluxo de trabalho e espaço de trabalho
    1. Criação e gerenciamento de pincéis
    2. Uso de Google Fonts em documentos HTML5 Canvas
    3. Uso das Bibliotecas da Creative Cloud e do Adobe Animate
    4. Uso dos painéis Palco e Ferramentas do Animate
    5. Fluxo e espaço de trabalho do Animate
    6. Uso de fontes da Web em documentos HTML5 Canvas
    7. Linhas de tempo e ActionScript
    8. Trabalhar com múltiplas linhas de tempo
    9. Definir preferências
    10. Uso de painéis de criação do Animate
    11. Criar camadas na linha do tempo com o Animate
    12. Exportar animações para aplicativos móveis e mecanismos de jogo
    13. Mover e copiar objetos
    14. Modelos
    15. Localização e substituição no Animate
    16. Desfazer, refazer e o painel de Histórico
    17. Atalhos de teclado
    18. Como usar a linha do tempo no Animate
    19. Criação de extensões HTML
    20. Opções de otimização para imagens e GIFs animados
    21. Configurações de exportação para imagens e GIFs
    22. Painel Ativos no Animate
  6. Multimídia e vídeo
    1. Transformação e combinação de objetos gráficos no Animate
    2. Criar e trabalhar com instâncias do símbolo no Animate
    3. Traçado de imagem
    4. Como usar som no Adobe Animate
    5. Exportação de arquivos SVG
    6. Criação de arquivos de vídeo para uso no Animate
    7. Como adicionar vídeos no Animate
    8. Desenhar e criar objetos com o Animate
    9. Remodelação de linhas e formas
    10. Traçados, preenchimentos e gradientes com o Animate CC
    11. Trabalhar com o Adobe Premiere Pro e o After Effects
    12. Painéis de cor no Animate CC
    13. Abrir arquivos do Flash CS6 com o Animate
    14. Trabalho com texto clássico no Animate
    15. Aplicação de ilustração final no Animate
    16. Bitmaps importados no Animate
    17. Gráficos em 3D
    18. Trabalhar com símbolos no Animate
    19. Desenhar linhas e formas com o Adobe Animate
    20. Trabalho com bibliotecas no Animate
    21. Exportação de sons
    22. Seleção de objetos no Animate CC
    23. Trabalho com arquivos AI do Illustrator no Animate
    24. Aplicação de modos de mesclagem
    25. Organização de objetos
    26. Automação de tarefas com o menu Comandos
    27. Texto multilíngue
    28. Uso de câmera no Animate
    29. Filtros gráficos
    30. Som e ActionScript
    31. Preferências de desenho
    32. Desenho com a ferramenta Caneta
  7. Plataformas
    1. Converter projetos do Animate em outros formatos de tipo de documento
    2. Compatibilidade com plataforma personalizada
    3. Criação e publicação de documentos HTML5 Canvas no Animate
    4. Criação e publicação de um documento WebGL
    5. Compactação de aplicativos no AIR para iOS
    6. Publicação de AIR em aplicativos Android
    7. Publicação no Adobe AIR para desktop
    8. Configurações de publicação do ActionScript
    9. Práticas recomendadas - Organização do ActionScript em um aplicativo
    10. Como usar ActionScript com o Animate
    11. Acessibilidade no espaço de trabalho do Animate
    12. Programação e gerenciamento de scripts
    13. Ativação do suporte para plataformas personalizadas
    14. Visão geral do suporte da plataforma personalizada
    15. Trabalhar com plug-ins personalizados de suporte da plataforma
    16. Depuração do ActionScript 3.0
    17. Ativação do suporte para plataformas personalizadas
  8. Publicação e exportação
    1. Exportação de arquivos do Animate CC
    2. Publicação OAM
    3. Exportação de arquivos SVG
    4. Exportar gráficos e vídeos com o Animate
    5. Publicação de documentos AS3
    6. Exportar animações para aplicativos móveis e mecanismos de jogo
    7. Exportação de sons
    8. Práticas recomendadas - Dicas para a criação de conteúdo em dispositivos móveis
    9. Práticas recomendadas - Convenções de vídeo
    10. Práticas recomendadas - Diretrizes de criação de aplicativos SWF
    11. Práticas recomendadas - Estruturação de arquivos FLA
    12. Práticas recomendadas para otimizar arquivos FLA para o Animate
    13. Configurações de publicação do ActionScript
    14. Especificar configurações de publicação para o Animate
    15. Exportação de arquivos projetores
    16. Exportar imagens e GIFs animados
    17. Modelos de publicação HTML
    18. Trabalhar com o Adobe Premiere Pro e o After Effects
    19. Compartilhar e publicar animações rapidamente
  9. Solução de problemas
    1. Problemas corrigidos
    2. Problemas conhecidos

 

Criar animações quadro a quadro

A animação quadro a quadro altera o conteúdo do Palco em cada quadro. É mais adequado para animações complexas, em que uma imagem é alterada em todos os quadros, em vez de simplesmente se movimentar pelo Palco. Esse tipo de animação aumenta mais o tamanho do arquivo do que a animação interpolada. Na animação quadro a quadro, o Animate armazena os valores de cada quadro completo.

Para criar uma animação quadro a quadro, defina todos os quadros como principais e crie uma imagem diferente para cada um deles. Cada quadro-chave novo contém, inicialmente, o mesmo conteúdo que o quadro-chave que o preceder, assim você pode modificar os quadros na animação aceleradamente.

  1. Clique no nome de uma camada para torná-la a camada ativa e selecione um quadro na camada em que a animação deve iniciar.
  2. Se o quadro não for um quadro-chave, selecione Inserir > Linha do tempo > Quadro-chave.
  3. Crie a arte para o primeiro quadro da sequência. Use as ferramentas de desenho, cole o gráfico da Área de transferência ou importe um arquivo.
  4. Para adicionar um quadro-chave cujo conteúdo seja o mesmo que o primeiro quadro-chave, clique no próximo quadro à direita na mesma linha. Selecione Inserir > Linha do tempo > Quadro-chave, ou clique com o botão direito (Windows) ou clique com a tecla Control pressionada (Macintosh) e selecione Inserir quadro-chave.

  5. Para desenvolver o próximo incremento da animação, altere o conteúdo deste quadro no Palco.
  6. Para completar sua sequência de animação quadro a quadro, repita as etapas 4 e 5 até montar o movimento desejado.
  7. Para testar a sequência de animação, selecione Controlar > Reproduzir ou clique no botão Reproduzir, no Controlador (Janela > Barras de ferramentas > Controlador).

Criar animações quadro a quadro convertendo interpolações clássicas ou de movimento

É possível converter uma interpolação clássica ou extensão da interpolação de movimento em animação quadro a quadro. Na animação quadro a quadro, cada quadro contém quadros-chave distintos (não quadros-chave de propriedade), contendo cada um ocorrências separadas do símbolo animado. A animação quadro a quadro não contém valores de propriedade interpolados.

  1. Clique com o botão direito do mouse (Windows) ou com a tecla Ctrl pressionada (Macintosh) na extensão de interpolação que deseja converter e escolha Converter em animação quadro a quadro, no menu de contexto.

Usar onion skinning

Geralmente, só um quadro da sequência de imagem aparece no Palco. Para ajudar a desenhar, posicionar e editar animações quadro a quadro, o recurso de onion skinning fornece a referência exibindo o conteúdo dos quadros anteriores e seguintes no palco. O quadro sob o indicador de reprodução aparece totalmente colorido. Aplique cor e o alfa para diferenciar os quadros novos e antigos. 

Os quadros anteriores e seguintes do onion skinning têm tons de cores padrão. Para personalizar essas cores, use a opção Configurações avançadas.

Ativar e desativar onion skinning

  • Clique no botão Onion Skin para ativar e desativar o onion skinning.
  • Para excluir ou incluir quadros, no cabeçalho da linha de tempo, clique com o botão direito do mouse em qualquer quadro do onion skin no intervalo de onion skin.
  • Clique e segure o mouse no botão Onion Skin  para visualizar e selecionar as opções.

Configurações avançadas em onion skinning

Clique e segure o mouse no botão Onion Skin  e selecione Configurações avançadas.

Personalizar intervalo

Personalização de cores para exibição de onion skin

  1. Para personalizar a cor dos quadros de onion skin, selecione o quadro do onion skin na barra da linha do tempo.
  2. Clique e segure o mouse no botão Transparência  e selecione Configurações avançadas.
  3. Modifique a tonalidade de cor dos quadros anteriores e futuros.

Modo de contorno e preenchimento

Personalização de opacidade

  1. Para modular a opacidade do quadro de onion skin em ambos os lados do quadro ativo, clique e arraste o controle deslizante Opacidade inicial.

  2. Para diminuir o delta de cada quadro de onion skin por porcentagem, arraste o controle deslizante Diminuir em.

Mostrar apenas os quadros principais

  1. Para personalizar a cor dos quadros de onion skin, selecione o quadro do onion skin na barra da linha do tempo.
  2. Selecione Editar > Preferências.
  3. Na opção Cor do onion skin, selecione os botões de alternância de cores para personalizar e definir cores para quadros do passado, presente e futuro

Marcadores de âncora

Visualizar simultaneamente vários quadros de uma animação no Palco

Clique no botão Papel transparente . Todos os quadros entre os marcadores Iniciar e Terminar onion skin (no cabeçalho da Linha do tempo) ficarão superpostos, como um único quadro na janela do documento.

Marcadores de onion skin

Onion Skinning codificado por cores

A codificação por cores do recurso Onion skinning ajuda a diferenciar entre os quadros do passado, do presente e do futuro. Os quadros de onion skin que se movem para longe do quadro ativo são exibidos com uma transparência cada vez menor.

Onion skinning na linha do tempo

Onion skinning codificado por cores que mostra quadros do passado, presente e futuro

Modo de contorno do Onion Skinning

Personalização de cores para exibição de onion skin

  1. Para personalizar a cor dos quadros de onion skin, selecione o quadro do onion skin na barra da linha do tempo.
  2. Selecione Editar > Preferências.
  3. Na opção Cor do onion skin, selecione os botões de alternância de cores para personalizar e definir cores para quadros do passado, presente e futuro
Observação:

O código de cores também pode ser usado no modo de contorno.

Modo de linha do tempo de onion skin

Onion skinning personalizado

  • Para alterar a posição do marcador de transparência, arraste o ponteiro para um novo local. Normalmente, os marcadores de transparência se movem junto ao ponteiro do quadro atual. Aperte Control/Command e arraste para aumentar ou diminuir a posição em ambos os lados.
  • Para ativar a edição de todos os quadros entre os marcadores de transparência, clique no botão Editar múltiplos quadros . Geralmente, as sequências em papel transparente permitem editar apenas o quadro atual. É possível exibir o conteúdo de cada quadro entre os marcadores de transparência e editá-los.
  • Para mover o intervalo de repetição na linha do tempo para qualquer posição que inclua a posição do indicador de reprodução, use os marcadores na linha do tempo para pressionar a tecla Shift e arrastar o intervalo. 
  • Para ajustar os marcadores de intervalo, use a tecla Shift e arraste os marcadores de intervalo ou a faixa de loop usando os marcadores na Linha do tempo. 
Observação:

As camadas bloqueadas (com um ícone de cadeado) não são exibidas quando está ativada a opção de papel transparente. Para evitar uma grande quantidade de imagens confusas, bloqueie ou oculte as camadas que você não quer ver como papel transparente.

Visualizar o projeto

Para verificar como seu onion skinning está, posicione o mouse sobre a linha do tempo. A animação é reproduzida com contornos coloridos para que você tenha uma visualização precisa das alterações. 

 Adobe

Receba ajuda com mais rapidez e facilidade

Novo usuário?

Adobe MAX 2024

Adobe MAX:
a conferência da criatividade

14 a 16 de outubro, Miami Beach e online

Adobe MAX

A conferência da criatividade

14 a 16 de outubro, Miami Beach e online

Adobe MAX 2024

Adobe MAX:
a conferência da criatividade

14 a 16 de outubro, Miami Beach e online

Adobe MAX

A conferência da criatividade

14 a 16 de outubro, Miami Beach e online