Guia do Usuário Cancelar

Exportação de arquivos SVG

  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

 

O que é SVG?

Gráficos vetoriais escaláveis (SVG) é uma linguagem de markup XML para descrever imagens bidimensionais. Arquivos SVG fornecem gráficos HiDPI independentes de resolução na Web, impressos e em dispositivos móveis em formato compacto. Você pode definir um SVG com CSS e o suporte de script e animação faz o SVG uma parte integral da plataforma da Web.

Alguns formatos de imagem comuns da Web, como GIF, JPEG e PNG, são volumosos e normalmente são de baixa resolução. O formato SVG oferece muito mais valor ao permitir que você descreva imagens em termos de formas de vetor, texto e efeitos de filtro. Arquivos SVG são compactos e fornecem gráficos de alta qualidade na Web e também em dispositivos de mão, que têm restrições de recursos. Você pode ampliar a exibição de uma imagem SVG na tela, sem comprometer a nitidez, os detalhes ou a clareza. Além disso, o SVG fornece suporte superior para texto e cores, o que garante que você verá as imagens exatamente como elas aparecem no Palco. O formato SVG é totalmente baseado em XML e oferece muitas vantagens a desenvolvedores e outros usuários.

 Agora, você pode exportar arquivos SVG do Animate sem que definições e IDs indesejáveis sejam criadas junto com ele. A composição em SVG foi aprimorada na versão 19.1 do Animate. Essa opção de exportação melhorará a qualidade de SVGs que estão sendo importados no Character Animator.

O fluxo de trabalho SVG exportado no Animate

O Animate permite exportar para o formato SVG, versão 1.1. Você pode criar ilustrações visualmente ricas usando ferramentas de design poderosas no Animate e, em seguida, exportar para SVG.

No Animate, você pode exportar quadros selecionados e quadros-chave de uma animação. E, como a ilustração exportada é Vetor, a resolução da imagem é alta, mesmo ao redimensionar para tamanhos diferentes.

O recurso de exportação do SVG substitui a antiga exportação FXG (abandonada no Animate (junho de 2013)). Você descobrirá que o desempenho do recurso de exportação SVG e a qualidade de saída são superiores. Além disso, em comparação com o FXG, a perda de conteúdo é mínima no SVG.

Ilustração com efeitos de filtragem

Com o SVG, os efeitos de filtro podem não aparecer exatamente da mesma forma que no Animate, já que não há mapeamento um a um entre filtros disponíveis no Animate e no SVG. Contudo, o Animate aproveita combinações de filtros primitivos diferentes disponíveis no SVG para simular um efeito semelhante.

Manipulação de vários símbolos

A exportação SVG lida com vários símbolos sem dificuldade, sem perda de conteúdo. O resultado é muito parecido com a arte-final no Palco no Animate.

Exportação de arte-final no formato SVG

  1. No Animate, mova o indicador de reprodução até o quadro adequado.
  2. Selecione Arquivo > Exportar > Exportar imagem. ou selecione Arquivo > Configurações de publicação (selecione a opção Imagem SVG na seção Outros formatos.
  3. Insira ou navegue até o local em que deseja salvar o arquivo SVG. Certifique-se de selecionar SVG como o tipo em Salvar como.
  4. Clique em OK.
  5. Na caixa de diálogo Exportar SVG, escolha Incorporar ou Vincular seu arquivo SVG.
    • Incluir camadas ocultas Exporta todas as camadas ocultas do documento Animate. Desmarcar Exportar camadas ocultas impede que todas as camadas (inclusive as aninhadas em clipes de filmes) marcadas como ocultas sejam exportadas para o SVG resultante. Isso permite que você teste facilmente diferentes versões de documentos do Animate tornando as camadas invisíveis.
    • Incorporar: Incorpora um bitmap no arquivo SVG. Use esta opção se você deseja incorporar bitmaps diretamente ao arquivo SVG.
    • Vincular: Fornece um link para o caminho de um arquivo bitmap. Use esta opção se você não desejar incorporar bitmaps, mas sim fornecer o link para os bitmaps do arquivo SVG. Ao selecionar a opçãoCopiar imagens para a pasta, os bitmaps serão salvos dentro da pasta imagens criada no local para o qual o arquivo SVG foi exportado. Quando a opção Copiar imagens para a pasta não estiver selecionada, os bitmaps serão referenciados no arquivo SVG a partir de seu local de origem. Se o local de origem do bitmap estiver indisponível, eles serão incorporados ao arquivo svg.
    • Copiar imagens para a pasta /Imagens: Permite que você copie o bitmap para /Imagens. A pasta /Imagens, se já não existir, é criada no local de exportação do SVG.
    • Otimizar para o Character Animator: Permite exportar SVG, que funciona bem com Character Animator.

  1. Clique em OK.

 Alguns recursos do Animate não são compatíveis com o formato SVG. O conteúdo criado com tais recursos será removido ou transformado em um recurso suportado no momento da exportação.

Como alternativa, você pode ainda usar a caixa de diálogo Configurações de publicação para exportar arquivos SVG do Animate (Arquivo > Configurações de publicação). Selecione a opção SVG da seção Outros formatos para exportar os arquivos SVG.

 Recomendamos a visualização de arquivos SVG somente em navegadores modernos com as últimas atualizações. Caso contrário, alguns filtros gráficos e efeitos de cores podem não ser renderizados corretamente em versões mais antigas de navegadores, como o Internet Explorer 9.

Troca de arquivos SVG com o Adobe Illustrator

O Animate permite a troca de conteúdo com o Adobe Illustrator. Este fluxo de trabalho é um substituto para o recurso de Exportação FXG que foi encerrado com o Animate (13.0). Você pode exportar arquivos SVG do Animate e importá-los para o Adobe Illustrator. Para obter mais informações sobre como usar arquivos SVG no Adobe Illustrator, consulte este Tópico da ajuda.

Use esse fluxo de trabalho se você deseja criar edições granulares em sua arte-final e adicionar detalhes enriquecedores. Você pode usar também o Illustrator para adicionar efeitos, como sombra, à arte-final.

Para editar arquivos SVG no Adobe Illustrator e usar o conteúdo editado no Animate, faça o seguinte:

  1. No Animate, exporte para SVG.
  2. Edite sua arte-final abrindo o arquivo SVG usando o Adobe Illustrator.
  3. Salve o arquivo SVG como um arquivo .ai e importe-o no Animate. Para obter mais informações sobre como usar arquivos do Illustrator no Animate.

Receba ajuda com mais rapidez e facilidade

Novo usuário?