Guia do Usuário Cancelar

Exportar imagens e GIFs animados

Pesquisar
Animate

Animate

Abrir aplicativo
  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

 

Use esse artigo para saber como exportar imagens e GIFs animados.

O Animate introduz os recursos de Exportar imagem e Exportar GIF animado que ajudam a exportar ativos para o formato .png, jpeg, estático e GIF animado de maneira fácil e interativa.

Ao preparar imagens para a Web e para outras mídias on-line, geralmente é preciso conciliar a qualidade de exibição e o tamanho do arquivo da imagem.

Use os recursos de otimização na caixa de diálogo Exportar imagem para visualizar imagens otimizadas em diferentes formatos de arquivo com diferentes atributos. É possível visualizar simultaneamente várias versões de uma imagem e, durante a visualização, modificar as configurações de otimização para selecionar a combinação mais adequada de configurações. Também é possível especificar a transparência e o fosco, selecionar opções para controlar o pontilhamento e redimensionar a imagem para dimensões de pixel especificadas ou para determinada porcentagem do tamanho original.

Ao salvar um arquivo otimizado usando o comando Exportar imagem, é possível optar por gerar um arquivo HTML da imagem. Esse arquivo conterá todas as informações necessárias para exibir a imagem em um navegador da Web.

No Animate, você pode usar o comando Salvar como para salvar uma imagem como GIF, JPEG ou PNG. Dependendo do formato do arquivo, é possível especificar a qualidade da imagem, a transparência ou a aparência fosca do fundo, a exibição de cores e o método de download. Entretanto, os recursos da Web — como fatias, links e animações — adicionados ao arquivo não são preservados.

Também é possível usar o Processador de imagens do Animate para salvar cópias de uma pasta de imagens no formato JPEG. Você pode usar o Processador de imagens para redimensionar e converter o perfil de cor das imagens em sRGB padrão da Web.

Exportar imagens

Você usa a caixa de diálogo Exportar imagem (Arquivo > Exportar > Exportar imagem e Arquivo > Exportar > Exportar GIF animado) para selecionar as opções de otimização e visualizar a arte otimizada.

A. Opções de exibição B. Menu pop-up Otimizar C. Opções de predefinição D. Opções de tamanho da imagem E. Opções de animação F. Visualização G. Barras de ferramentas 

Visualização de imagens na caixa de diálogo

Clique em uma guia na parte superior da área da imagem para selecionar uma opção de exibição:

Original

Exibe a imagem sem otimização.

Otimizado

Exibe a imagem com as configurações de otimização atuais aplicadas.

Até 2

Exibe duas versões da imagem lado a lado.

Se a ilustração não estiver visível na caixa de diálogo Exportar imagem, use a ferramenta Mão para tornar outra área visível. A ferramenta Zoom pode ser usada para ampliar ou reduzir a visualização.

  • Selecione a ferramenta Mão (ou mantenha a barra de espaço pressionada) e arraste na área de visualização para se deslocar pela imagem.
  • Selecione a ferramenta Zoom  , clique em uma visualização para aplicar mais zoom, mantenha a tecla Alt (Windows) ou Option (Mac OS) pressionada e clique em uma visualização para aplicar menos zoom.

    Também é possível digitar um percentual de ampliação ou escolher um na parte inferior da caixa de diálogo.

Visualização das informações da imagem otimizada e do tempo de download

A área de comentários abaixo de cada imagem da caixa de diálogo Exportar imagem oferece informações sobre a otimização. O comentário da imagem original mostra o nome e o tamanho do arquivo. O comentário da imagem otimizada mostra as opções de otimização atuais, o tamanho do arquivo otimizado e o tempo estimado de download usando a velocidade de modem selecionada. É possível escolher uma velocidade de modem no menu pop-up Exibir.

Visualização do gama da imagem com diferentes valores

O valor do gama do monitor de um computador faz com que uma imagem pareça mais clara ou mais escura em um navegador da Web. Você pode visualizar a aparência das suas imagens em sistemas com diferentes valores de gama e efetuar ajustes de gama nessas imagens para compensar. Ativar uma opção de visualização não afeta a saída da imagem final.

  • Escolha uma das seguintes opções ao usar a opção Visualizar na caixa de diálogo Exportar imagem.

Cor do monitor

Não faz ajustes no gama da imagem. A cor do monitor é a configuração padrão.

Macintosh legado (Sem gerenciamento de cores)

Simula a gama padrão de 1,8 usada pelo Mac OS 10.5 e versões anteriores.

Windows (Sem gerenciamento de cores)

Simula o gama padrão de 2.2 usado pelo Windows e pelo Mac OS 10.6 e versões posteriores.

Usar perfil do documento

Ajusta o gama para corresponder, em um documento gerenciados por cores, a qualquer perfil de documento anexado.

Otimização de imagens para a Web

  1. Escolha Arquivo > Exportar imagem ou Arquivo > Exportar GIF animado.

  2. Clique em uma guia na parte superior da caixa de diálogo para selecionar uma opção de exibição: Otimizado ou Até 2.

  3. (Opcional) Se a imagem tiver várias fatias, selecione uma ou mais que deseje otimizar.

  4. Selecione uma configuração de otimização predefinida no menu Predefinição ou defina opções individuais de otimização. As opções disponíveis variam conforme o formato de arquivo selecionado.

  5. Ajuste as configurações de otimização até estar satisfeito com a relação entre a qualidade da imagem e o tamanho do arquivo. Se a imagem tiver várias fatias, otimize todas elas.

    Observação:

    Para restaurar uma visualização otimizada à versão original, selecione-a e, em seguida, escolha Original no menu Predefinição.

  6. Para garantir que as cores que você vê na imagem otimizada sejam as mesmas em navegadores diferentes, converta as cores da imagem para sRGB.

  7. Selecione as seguintes opções:

    Nenhum

    Nenhum metadado salvo (exceto para aviso de direitos autorais EXIF em arquivos JPEG). Produz o menor tamanho de arquivo.

    Copyright

    Salva avisos de copyright, termos de uso de direitos, status de copyright e URL com informações de copyright.

    Informações de contato e direitos autorais

    Salva todas as informações de copyright e as seguintes informações: criador, cargo do criador, email(s), endereço, cidade, estado/província, CEP, país, telefone(s) e site(s).

    Tudo Todos exceto as informações de câmera

    Salva todos os metadados, exceto dados EXIF sobre configurações de câmera, como velocidade do obturador, data e hora, comprimento focal, compensação de exposição, padrão de medição e uso do flash.

    Tudo

    Salva todos os metadados do arquivo.

  8. Clique em Salvar.

  9. Na caixa de diálogo Salvar otimizado como, siga estes procedimentos e depois clique em Salvar:

    1. Digite um nome de arquivo e selecione um local para o(s) arquivo(s) resultante(s).

    2. Selecione uma opção de formato para especificar que tipos de arquivo você deseja salvar: um arquivo HTML e arquivos de imagem, somente arquivos de imagem ou somente um arquivo HTML.

    3. (Opcional) Defina as configurações de saída de arquivos HTML e de imagem.

    4. Se a imagem tiver várias fatias, selecione uma opção de salvamento no menu Fatias: Todas as fatias ou Fatias selecionadas.

      Observação:

      Para redefinir as configurações de otimização com a última versão salva, pressione Alt (Windows) ou Option (Mac OS) e clique em Redefinir. Para manter as mesmas configurações na próxima vez em que abrir a caixa de diálogo Salvar Para ver a caixa de diálogo Web, pressione Alt/Option e clique em Lembrar.

      5. Para assistir a um vídeo sobre como salvar arquivos para a Web no Illustrator, consulte www.adobe.com/go/vid0063_br.

Salvamento ou exclusão de predefinições de otimização

As configurações de otimização podem ser salvas como um conjunto nomeado e aplicadas a outras imagens. As configurações salvas são exibidas no menu pop-up Predefinição, com as configurações nomeadas predefinidas. Se um conjunto nomeado ou predefinido for editado, o menu Predefinição exibirá o termo “Sem nome”.

  1. Defina as opções de otimização conforme desejado e escolha Salvar configurações no menu da paleta Otimizar.

  2. Nomeie as configurações e salve-as na pasta apropriada:

    Photoshop

    (Windows XP) Document and Settings\[Nome de usuário]\Application Data\Adobe\Adobe Photoshop CS5\Optimized Settings

    (Windows Vista) Usuários\[Nome de usuário]\AppData\Roaming\Adobe\Adobe Photoshop CS5\Optimized Settings

    (Mac OS) Usuários/[Nome de usuário]/Library/Preferences/Adobe Photoshop CS5 Settings/Optimized Settings

    Illustrator

    (Windows XP) Document and Settings\[Nome de usuário]\Application Data\Adobe\Adobe Illustrator CS5 Settings\[Idioma]\Save for Web Settings\Optimize

    (Windows Vista) Users\[Nome de usuário]\AppData\Roaming\Adobe Illustrator CS5 Settings\[Idioma]\Save for Web Settings\Optimize

    (Mac OS) Usuários/[Nome de usuário]/Library/ApplicationSupport/Adobe/Adobe Illustrator CS5/[Idioma]/Save for Web Settings/Optimize

    Observação:

    Se as configurações forem salvas em outro local, elas não estarão disponíveis no menu pop-up Predefinição.

  3. Para excluir uma predefinição, selecione-a no menu Predefinição e, no menu Otimizar, selecione Excluir configurações.

Compactação de gráficos da Web em um tamanho específico de arquivo

  1. Escolha Arquivo > Exportar > Exportar imagem ou Arquivo > Exportar > Exportar GIF animado.

  2. Clique em uma guia na parte superior da caixa de diálogo Exportar GIF animado para selecionar uma opção de exibição: Otimizado ou Até 2. 

  3. (Opcional) Selecione as fatias que deseja otimizar e o formato de arquivo desejado.

  4. Selecione Otimizar para tamanho de arquivo, no menu Otimizar (à direita do menu Predefinição).

  5. Digite o tamanho de arquivo desejado.

  6. Selecione uma opção Iniciar com:

    Configurações atuais

    Usa o formato atual de arquivo.

    Seleção Automática GIF/JPEG

    Seleciona automaticamente o formato ideal de acordo com o conteúdo da imagem.

  7. Selecione uma opção Usar, para indicar se quer aplicar o tamanho especificado de arquivo somente à fatia atual, a cada fatia da imagem ou a todas as fatias. Clique em OK.

Redimensionamento da arte-final durante a otimização

Na caixa de diálogo Exportar imagem, é possível redimensionar uma imagem para dimensões em pixel especificadas ou para uma porcentagem do tamanho original.

  1. Clique na guia Tamanho da imagem, na caixa de diálogo Exportar imagem.

  2. Defina estas opções adicionais:

    Limitar proporções

    Mantém as proporções atuais entre a largura e a altura dos pixels.

    Observação:

    Nenhum dos recursos na paleta Tamanho da imagem está disponível para formatos de arquivo SWF e SVG, exceto Anexar para tela de pintura.

  3. Digite novas dimensões em pixels ou especifique uma porcentagem para qual a imagem deve ser redimensionada e clique em Aplicar.

Visualização de imagens otimizadas no navegador da Web

Você pode visualizar uma imagem otimizada em qualquer navegador da Web instalado em seu sistema a partir da caixa de diálogo Exportar imagem (Arquivo > Exportar > Exportar imagem ou Arquivo > Exportar > Exportar GIF animado). A visualização do navegador exibe a imagem com a legenda relacionando o tipo de arquivo, as dimensões em pixels, o tamanho do arquivo, as especificações de compactação e outras informações de HTML da imagem.

  • Para visualizar uma imagem no navegador da Web padrão, clique no ícone do navegador, na parte inferior da caixa de diálogo Exportar imagem.
  • Na caixa de diálogo Navegadores, é possível encontrar todos os navegadores no computador e definir o navegador padrão para visualizar a imagem.

Mais tópicos da Ajuda

Opções de otimização para imagens e GIF animados

Configurações de saída para exportar imagens e GIFs animados

 

 

Receba ajuda com mais rapidez e facilidade

Novo usuário?

Links rápidos

Veja todos os seus planos Gerenciar seus planos
Ver links rápidos
Ocultar links rápidos

Avisos legais | Política de privacidade online