Índice:
- Implementando a interatividade de forma inteligente
- Usando Símbolos para fazer objetos reutilizáveis
- Incorporando design web responsivo
- Contando suas múltiplas opções de publicação
- Fontes no Adobe Edge Animate
- Trabalhando em seu idioma de escolha
Vídeo: Episódio 01: HTML5 -- Por que eu deveria... 2024
Adobe Edge Animate CC é muito mais do que mover elementos ao redor da tela. Você pode usar muitos dos seus recursos para criar interatividade para o seu público - e ajustar demais para configurar o software de acordo com suas preferências:
-
Interatividade: Você pode criar animações totalmente interativas com esses controles e ações como botões, links e loops.
-
Símbolos: Você pode salvar elementos que você criou (como botões) e usá-los novamente em uma animação diferente.
-
Design web responsivo: O Edge Animate permite que você crie uma composição que responda aos tamanhos de janela do navegador e do dispositivo.
-
Várias opções de publicação: O Edge Animate oferece inúmeras maneiras de publicar sua animação para uso em diferentes aplicativos - como diferentes navegadores da Web e iBooks - ou você pode importar o Adobe Edge Animation para diferentes produtos da Adobe, como InDesign ou Muse.
-
Escolhas de fonte: Edge Animate fornece uma infinidade de opções de fontes. Se você é exigente sobre fontes particulares, a boa notícia é que, se você pode encontrar uma fonte na web, você provavelmente pode usá-la em sua animação.
-
Escolha o seu idioma: Se o inglês não é o seu idioma nativo e você prefere trabalhar (digamos) alemão, espanhol, francês ou japonês, o Edge Animate já abordou.
Implementando a interatividade de forma inteligente
O Adobe Edge Animate CC permite que você faça muito mais do que apenas desenhar e animar elementos. Você também pode tornar esses elementos interativos, o que permite ao seu público clicar em itens para fazer diferentes ações acontecerem.
Por exemplo, você pode fazer os botões Stop, Play e Pause para uma apresentação de slides interativa. Você também pode criar um menu adicionando links que permitem que seu público navegue para diferentes partes de suas animações - ou para páginas web totalmente diferentes.
Quando seu público move o cursor em torno de sua animação, você pode fazer diferentes ações acontecerem quando o cursor se desloca sobre áreas específicas. Este tipo de movimento do cursor é chamado de mouseover . Ou, se o seu público estiver usando tablets ou telefones inteligentes para visualizar sua animação, você pode permitir que eles simplesmente toquem um elemento para causar uma ação.
Usando Símbolos para fazer objetos reutilizáveis
No início, usar Símbolos pode ser um pouco assustador, mas depois de ganhar experiência trabalhando com eles, eles se tornam indispensáveis.
Então, o que exatamente é um símbolo ? É essencialmente uma animação aninhada que você cria, que possui sua própria linha de tempo e recursos interativos independentes.Por exemplo, diga que você se encontra criando o mesmo elemento com as mesmas ações repetidas vezes para muitos projetos diferentes. Ao salvar esse elemento recorrente como símbolo, você pode reutilizá-lo e suas ações associadas para qualquer projeto.
Um excelente exemplo de um símbolo é um botão. Se você se encontrar recriando o mesmo botão - digamos, um botão Play para uma apresentação de slides - você pode querer salvar o botão Play como um símbolo para reutilizar mais tarde.
Você pode encontrar o seu símbolo no painel Biblioteca, como mostrado.
Incorporando design web responsivo
Direito juntamente com HTML5, design web responsivo é a mais recente terminologia de palavras-chave quando se trata de desenvolvimento web. Um design web receptivo permite que sua animação redimensione adequadamente dependendo do tamanho da janela do navegador.
Isso pode significar muitas coisas. Digamos, por exemplo, que alguém está visualizando sua animação em um computador desktop. Se o usuário redimensionar a janela do navegador para torná-lo maior ou menor, os elementos da sua animação redimensionam-se adequadamente, com os novos tamanhos com base em porcentagens.
Por exemplo, se a janela do navegador for maximizada em 100%, as imagens e assim por diante em sua animação aparecem em 100%. Se a janela do navegador for encolhida para 50% do tamanho, suas imagens também diminuem para 50% do tamanho normal.
Este é um recurso muito poderoso porque há uma grande variedade de tamanhos de tela nos dias de hoje. Você nunca sabe se seu público está visualizando sua animação em uma tela de 60 polegadas, um iPhone de 4 polegadas ou qualquer coisa intermediária. Os comprimidos aumentam a diversidade de tamanhos de tela.
Contando suas múltiplas opções de publicação
Você tem mais de uma maneira de publicar animações nos dias de hoje - e o Adobe Edge Animate CC cobriu, oferecendo uma infinidade de opções (como mostrado nesta figura). Você pode publicar sua animação como uma página web autônoma ou pode inseri-la em uma página da Web existente.
Você também encontra opções que permitem exportar sua animação para uso em um iBook. Você pode até mesmo publicar sua animação como uma página HTML estática para uso em navegadores da Web mais antigos que não suportam HTML5 ou animações.
Fontes no Adobe Edge Animate
Você pode usar uma infinidade de fontes na web e o Adobe Edge Animate CC tem coberto. Além de uma lista padronizada padrão de fontes disponíveis para você (veja a figura), o Edge Animate também permite importar fontes da Web.
Se nenhuma dessas fontes satisfizer suas necessidades, você pode importar fontes de várias fontes diferentes - incluindo fontes da Web do Google. Você também pode usar o Adobe Edge Web Fonts, que está incorporado em Animate. E se você está familiarizado com Typekit (outra ferramenta de fonte gratuita), você pode comemorar sabendo que essa ferramenta também funciona com o Edge Animate.
Trabalhando em seu idioma de escolha
Adobe Edge Animate CC é global em muitos aspectos - incluindo o idioma que você vê em menus e painéis. Se você se sentir mais confortável trabalhando em um idioma diferente do inglês, o Edge Animate facilita a mudança do idioma usado no software para um dos muitos idiomas populares.
No menu Ajuda, como mostrado nesta figura, você pode escolher entre vários idiomas diferentes. Quando você escolhe um idioma no menu Ajuda, esse idioma aparece no software. Os idiomas que você pode escolher incluem alemão, inglês, espanhol, francês e japonês.
Se você escolher outro idioma, você deve fechar e reiniciar o Edge Animate para ver a mudança ter efeito. Depois de selecionar o idioma desejado, a interface não atualiza automaticamente, basta fechar o programa e, em seguida, reabri-lo para ver o idioma recém-selecionado.