Este artigo mostrará como usar passos simples comece a conhecer Adobe Flash CS5. O tema da lição é animação simples, vamos criá-la sem nos aprofundarmos na complexidade da interface e do programa.

Criando um novo documento flash

Abra o programa e crie Novo Documento"ActionScript 3.0".

Vamos desenhar um objeto para animação subsequente

Agora vamos desenhar um círculo. Selecione a ferramenta oval no painel direito e segure botão esquerdo mouse e o botão "shift" no teclado, desenhe um círculo em um fundo branco.

Usando a Ferramenta de Seleção, selecione o objeto recém-criado clicando nele com o mouse ou arrastando-o para uma seleção quadrada.

Convertendo um objeto em um símbolo para animação simples

Para mais trabalho, você precisa converter o objeto em um símbolo. Como o círculo já está selecionado, pressione o botão direito do mouse e em menu contextual selecione "Converter em símbolo".

Na lista "Tipo", selecione "Gráfico"

Agora um quadrado azul deve aparecer ao redor do nosso objeto.

Criar uma animação clássica (Classic Tween)

Para criar uma animação, você precisa designar um "quadro-chave".

No painel inferior há uma escala de animação, selecione o vigésimo quinto quadro e pressione o botão direito do mouse, no menu de contexto que aparece, selecione "Inserir quadro-chave".

Selecione o círculo e, segurando o botão esquerdo do mouse, mova-o para a direita.

Selecione o primeiro quadro na escala de animação e no menu principal na parte superior, no item "Inserir", selecione "Classic Tween".

Ver animação criada

Agora podemos assistir a animação. No menu principal, no item "Controle", selecione "Jogar".

Vamos adicionar um efeito de "desaparecimento" ao círculo. Para fazer isso, selecione o objeto novamente e no painel direito no menu "efeito de cor", selecione "alfa", defina o valor para "0".

Vamos ver o que aconteceu. Vá para o item "Controle" selecione "Jogar".

Você já se perguntou o que está por trás da bela animação de banners na Internet? Ou para novos desenhos animados criados com tecnologia de computador? Na maioria das vezes eles são baseados em "carne", mais precisamente, é assim que o nome da tecnologia Flash é traduzido do inglês. Hoje falaremos sobre animação em flash para o site:

Tecnologia Flash

O framework multimídia foi desenvolvido pela Macromedia. Mas após sua aquisição (fusão), todos os direitos sobre a tecnologia foram transferidos para um novo proprietário - Adobe Systems.

Escopo da aplicação moderna do Adobe Flash:

• A criação de aplicativos da web é uma direção relativamente nova. Implica o uso total ou parcial do Flash para criar sites. Com aplicação parcial, esta tecnologia cria elementos individuais design: vários menus interativos, botões animados, etc.

Em comparação com os recursos convencionais, baseado em html sites em flash têm alguns recursos que limitam seu uso. Isso inclui altos custos de desenvolvimento, recursos de servidor exigentes, longos tempos de carregamento com uma conexão lenta à Internet e alguns outros aspectos:

• Implementação de recursos multimídia - para ouvir áudio e reproduzir vídeo em sites, geralmente são usados ​​players de mídia baseados em Flash. Seu desenvolvimento inclui o uso de uma das linguagens de script (mais frequentemente JavaScript):

• Na publicidade na Internet - na maioria das vezes, a tecnologia é usada para criar banners animados. Implicam não apenas a reprodução de publicidade multimídia, mas também algum tipo de interação com o usuário em uma base de jogo.

Fundamentos e Ferramentas para Desenvolvimento em Flash

Para criar animação em flash, as ferramentas tradicionais da Adobe são usadas com mais frequência:

• Adobe Flash Professional - um programa para criar animação interativa (animador);
• Adobe Flash Builder - um ambiente para criação de uma interface para aplicações web;
• O Adobe Flash Player é um player integrado ao navegador para reproduzir Flash.

Além dele, vários aplicativos de terceiros. Os mais populares são Gnash, QuickTime e alguns outros:

Esta tecnologia permite exibir qualquer tipo de gráfico ( raster, vetor, 3D). E também suporta transmissão de streaming de dados de áudio e vídeo. Especialmente para dispositivos móveis leve foi desenvolvido versão flash Leve.

O padrão principal para arquivos flash é a extensão SWF. A sigla significa Small Web Format. O vídeo gravado em Flash tem extensões de arquivo FLV, F4V.

O desenvolvimento da animação interativa em Flash é baseado em Gráficos vetoriais. Graças a isso, foi possível implementar o suporte à plataforma multimídia e a independência da qualidade da animação da resolução da tela.

O tamanho do arquivo de um aplicativo Flash é o mesmo para todos os usuários, independentemente especificações resolução da tela).

A animação interativa em Flash é baseada em morphing (tipo de vetor ), que se mistura lentamente entre os quadros-chave. Para reproduzir os dados, é usado um flash player, cuja operação é em muitos aspectos semelhante ao trabalho máquina virtual JavaScript. O componente de software da tecnologia é implementado usando a linguagem ActionScript.

As desvantagens da tecnologia incluem os seguintes pontos:

• carga pesada em CPU máquina cliente. Isso se deve à baixa eficiência da máquina virtual flash, que é incorporada ao player no navegador do usuário;
• Alta probabilidade de erro – Reproduzir animação em Flash pode ser muito propenso a erros. Além disso, falhas na reprodução do Flash afetam negativamente a operação de todo o aplicativo cliente (navegador). Isso ocorre devido ao controle insuficiente sobre a tolerância a falhas do código do programa ao criar aplicativos flash;
• Não pode ser indexado - Todo o conteúdo de texto exibido no conteúdo do Flash não é indexado. Essa limitação é especialmente problemática para os recursos baseados nessa tecnologia.

Visão geral do software de criação de Flash de terceiros

O Sothink SWF Quicker foi considerado um aplicativo protótipo no qual demonstraremos os fundamentos da criação do Flash. De acordo com muitos profissionais, o programa é o mais compreensível e fácil de aprender.

Além de criar e editar, o editor flash “sabe” trabalhar com todos os outros tipos de animação web (GIF, HTML e outros padrões):

Após a instalação, vamos para a interface amigável do programa. Infelizmente, depois de vagar por todos os cantos e recantos do seletor de idioma da interface, não o encontramos.

Para entender como fazer uma animação em flash neste aplicativo, usaremos os modelos internos. A caixa de diálogo New From Template aparece imediatamente após iniciar o programa. Além disso, ele pode ser chamado através do item do menu principal "Arquivo". Dentre as opções propostas, optamos pela criação de um banner:

Na próxima janela do assistente, você precisa selecionar um modelo na lista suspensa, de acordo com o qual a animação será criada. Abaixo está um pequeno quadro no qual o modelo selecionado é reproduzido:

Nas próximas etapas, você precisa definir o tamanho do banner e inserir 5 frases de texto que serão reproduzidas na animação. Além disso, você deve especificar o endereço do recurso para o qual o usuário será direcionado clicando no banner:

Depois de compilar o projeto e fechar a janela do assistente, você pode visualizar o vídeo resultante no player integrado. Para fazer isso, clique na seta verde na parte superior:

Após fechar o player, vamos dar uma olhada na interface do aplicativo. Observe que ele consiste em duas janelas principais: a superior é para editar o intervalo de tempo do vídeo e a inferior é um editor gráfico comum. Cada um dos elementos está localizado em uma camada separada, que está disponível para edição usando ferramentas padrão localizado na barra lateral.

Vemos animações em flash o tempo todo, na internet e na TV. Criar uma animação em flash simples usando a tecnologia Flash é bastante tarefa simples, já que o Flash oferece muito ferramentas úteis que facilitam todo o processo. Se você deseja criar uma animação em flash ou desenho animado, pode esboçá-lo em apenas algumas horas.

Passos

Parte 1

Animação em flash quadro a quadro

Noções básicas de animação quadro a quadro. Este método é considerado o principal método para criar animação "tradicional", na qual cada quadro subsequente inclui uma imagem, mas ligeiramente modificada. Ao reproduzir todos os quadros, a imagem "ganha vida". Este mesmo método é usado por animadores de desenhos animados à mão livre e consome mais tempo do que geminação (veja a próxima seção).

• Por padrão, o Flash é renderizado a 24 quadros por segundo (FPS). Isso significa que 24 quadros serão mostrados em um segundo, mas nem todos precisam ser diferentes. Você pode alterar essa configuração (se quiser) para 12fps, mas a 24fps a animação será reproduzida mais "suavemente".

1. Instale o FlashPro. Existem muitos programas para criar animações em flash, mas o mais poderoso é o Adobe Flash Professional CC. Você pode instalar gratuitamente versão de teste este programa ou use outro produto (se você não quiser se registrar na Adobe Creative Cloud). O restante deste artigo descreve como trabalhar com o Flash Professional.

   Como a animação quadro a quadro requer várias imagens (que são ligeiramente diferentes umas das outras), você precisa criar essas imagens manualmente. Para fazer isso, use o Adobe Flash Professional ou desenhe imagens em qualquer editor gráfico.

   • Se você deseja que suas imagens sejam facilmente redimensionadas sem perder qualidade, crie imagens em vetor em vez de gráficos raster. Imagens vetoriais serão redesenhados quando forem redimensionados (ou seja, você evitará pixelização ou anti-aliasing). Bitmaps são imagens tradicionais, como fotografias, quadros pintados e assim por diante. Se você tentar ampliar essas imagens, obterá uma imagem muito distorcida.

2. Crie o primeiro quadro. Ao iniciar o Adobe Flash Professional pela primeira vez, você verá uma tela em branco (camada) e uma linha do tempo vazia. À medida que os quadros são adicionados, a linha do tempo será preenchida automaticamente. Você pode trabalhar com camadas como no Photoshop.

   • Antes de adicionar uma imagem, crie um plano de fundo base para sua animação. Renomeie "Layer 1" para "Background" e, em seguida, recorte-o. Crie uma segunda camada e nomeie-a como quiser. Esta será a camada na qual você criará a animação.
   • Adicione um desenho à tela do primeiro quadro. Você pode importar um desenho do seu computador ou pode usar as ferramentas de desenho para criar um desenho diretamente no programa.
   • O primeiro quadro é o quadro "chave". Um quadro-chave é um quadro que inclui uma imagem e forma a base ("backbone") da animação. Você criará um novo quadro-chave toda vez que alterar a imagem.
   • Os quadros-chave na linha do tempo são indicados por um ponto preto.
   • Você não precisa de um quadro-chave em cada quadro subsequente. Crie um quadro-chave a cada quatro ou cinco quadros para fazer uma boa animação.

3. Converta a imagem em um símbolo. Nesse caso, você poderá adicionar a imagem ao quadro várias vezes. Isso é especialmente útil se você precisar adicionar rapidamente várias imagens do mesmo tipo a um quadro (por exemplo, peixes em um aquário).

   • Selecione um desenho. Clique com o botão direito do mouse no desenho e selecione Converter em símbolo. A imagem será adicionada à biblioteca, facilitando o uso no futuro.
   • Apague o desenho. Não se preocupe - você pode adicioná-lo ao quadro com um simples arrastar e soltar da biblioteca. Desta forma, você pode adicionar a mesma imagem ao quadro várias vezes.

4. Adicione quadros em branco. Assim que seu primeiro quadro-chave estiver concluído, insira quadros em branco e comece a criar seu segundo quadro-chave. Pressione F5 (quatro ou cinco vezes) para adicionar quadros em branco após o primeiro quadro-chave.

   Crie um segundo quadro-chave (depois de adicionar alguns quadros vazios). Existem dois várias maneiras para fazer isso: você pode copiar um quadro-chave existente e fazer pequenas alterações nele, ou pode criar um quadro-chave vazio e adicionar uma nova imagem a ele. Se estiver usando um desenho criado em outro programa, use o segundo método. Se você estiver inserindo uma imagem criada com as ferramentas de desenho do Adobe Flash Professional, use o primeiro método.

   • Para criar um quadro-chave usando o conteúdo do quadro-chave anterior, pressione F6. Para criar um quadro-chave em branco, clique com o botão direito do mouse no último quadro na linha do tempo e selecione Inserir quadro-chave em branco.
   • Depois de criar o segundo quadro-chave, você precisa fazer alterações em sua imagem para dar vida à animação. Se você usou as ferramentas de desenho do Adobe Flash Professional, selecione a ferramenta Transformar para selecionar um elemento em seu desenho (como a mão de um personagem) e modificá-lo.
   • Se você inserir uma nova imagem em cada quadro-chave, certifique-se de que esteja no lugar certo (de acordo com a sequência lógica de quadros).

5. Repita o processo. Depois de criar dois quadros-chave, repita o processo - adicione alguns quadros em branco entre cada quadro-chave e certifique-se de que a animação seja reproduzida "suavemente".

   • Faça pequenas mudanças. Quanto menores (menores) as alterações, mais suave a animação será reproduzida. Por exemplo, se você quiser que o personagem levante a mão, o segundo quadro-chave não deve incluir um desenho que mostre o personagem com a mão já levantada. Em vez disso, use alguns quadros-chave para fazer a transição da mão abaixada para a mão levantada. Nesse caso, a animação será mais suave.

6. Converta o desenho. Depois de criar quadros-chave e um caminho, você pode transformar a imagem para que ela mude suavemente à medida que você se move ao longo do caminho do gêmeo. Você pode alterar a forma, cor, inclinação, tamanho e qualquer outro aspecto da imagem.

   • Selecione o quadro no qual o desenho será transformado.
   • Abra o painel de propriedades do desenho. Para fazer isso, pressione F3.
   • Altere os valores dos parâmetros na janela de propriedades do desenho. Por exemplo, você pode alterar o matiz ou a cor, adicionar filtros, alterar o tamanho.
   • Você também pode usar a ferramenta Free Transform para alterar o desenho como quiser.

7. Adicione os toques finais. Verifique a animação criada pressionando Ctrl + Enter. Certifique-se de que o desenho (personagem) mude corretamente e que a animação seja reproduzida na velocidade correta. Se a animação for reproduzida muito rápido, reduza o valor do FPS ou aumente a duração da interpolação.

   • O FPS padrão é 24, então tente diminuir para 12. Altere o valor do FPS no painel de propriedades. No entanto, em FPS = 12, a animação pode não ser reproduzida com suavidade suficiente.
   • Para alterar a duração de uma interpolação, selecione a camada que contém a interpolação e use o controle deslizante para alterar a duração da interpolação. Se você quiser dobrar o comprimento da interpolação, mova o controle deslizante para 48 quadros. Não se esqueça de colar o fundo nos quadros vazios para que o fundo não desapareça no meio da animação. Para fazer isso, selecione a camada de fundo, clique no último quadro da animação (na linha do tempo) e pressione F5.

Parte 3

Adicionando efeitos sonoros e música

1. Gravar ou baixar efeitos sonoros e música. Você pode adicionar efeitos sonoros à sua animação para torná-la mais impactante. A música tornará uma animação mais emocionante e pode transformar uma boa animação em uma ótima. O Flash suporta vários formatos de arquivo de áudio, incluindo AAC, MP3, WAV e AU. Escolha um formato que garanta alta qualidade de som com o menor tamanho de arquivo.

   • O formato MP3 garante um som de alta qualidade com um tamanho mínimo de arquivo. Os arquivos WAV são grandes.

2. Importe arquivos de áudio para a biblioteca para poder adicionar sons e músicas rapidamente às animações. Clique em "Arquivo" - "Importar" - "Importar para Biblioteca". Encontre o arquivo de áudio em seu computador. Certifique-se de que o arquivo de áudio tenha um nome fácil de lembrar para que você possa encontrá-lo rapidamente.

   Crie uma nova camada para cada arquivo de áudio. Isso não é necessário e você pode adicionar áudio a camadas existentes, mas colar o arquivo de áudio em uma camada separada lhe dará mais controle faixa de áudio animações.

   Crie um quadro-chave a partir do qual o áudio começará a ser reproduzido. Na camada de som, selecione o quadro de animação a partir do qual o som começará a ser reproduzido. Pressione F7 para inserir um quadro-chave vazio. Por exemplo, se você deseja inserir um arquivo de áudio que é reproduzido em toda a animação, selecione o primeiro quadro na camada do arquivo de áudio. Se você estiver adicionando a voz de um personagem, selecione o quadro em que o personagem começa a falar.

Nisto página da Internet Sua atenção é apresentada ao programa para criar e editar animação em flash. Com a ajuda deles, você pode transformar suas próprias ideias em vídeos animados para o seu site.

Editor Flashé um programa para criar animações em flash e editar vídeos em flash prontos.

Formato FLAé o documento original do seu clipe. Depois de abri-lo, você entra no programa Macromedia Flash e pode editar ainda mais o clipe.

Formato SWF- este é um arquivo Flash executável, ao "clicar" o mouse sobre ele, você tem a oportunidade de visualizar o clipe usando o programa Macromedia Flash Player.

Animação com Adobe Flash Professional

Adobe Flash Professional CS3- as vantagens e a funcionalidade deste programa podem ser descritas por muito tempo. Este programaé o líder indiscutível no ambiente de tecnologia flash. O Adobe Flash Professional é usado por desenvolvedores profissionais de sites e designers de flash.

Com a ajuda deste programa, até a fantasia mais doentia pode ser realizada em flash. Em geral, se você decidir criar arquivos flash animados profissionais, o Adobe Flash Professional é exatamente o programa que você não pode prescindir.

O volume depende da versão de 500 Mb.

No este momento Adobe Flash Professional CS5 uma nova versão software de animação e multimídia.

SO: Windows XP/Vista/7

Captura de tela do programa:

baixar Adobe Flash Professional CS3

Talvez para um webmaster iniciante, criar uma animação em flash usando Software da Adobe O Flash Professional parecerá um tanto complicado e fora de alcance.

Nesse caso, não se desespere e desista do que começou. Experimente suas ideias de flash com Swishmax.

Swishmax - editor flash

SwishMAXé um programa alternativo com uma interface amigável e simples para criar animações em flash, que é menos funcional que o anterior, mas ao mesmo tempo permite obter um resultado de boa qualidade. A principal vantagem do editor flash inferior é sua facilidade de uso. Mesmo um usuário iniciante, tendo aulas de vídeo em mãos, poderá criar vídeos em flash profissionais em pouco tempo.

Volume: 9,27 MB.

O idioma da interface é russo.

Sistema operacional: Windows 98/Me/NT/2000/XP

Captura de tela do programa:

baixar swishmax

Jacaré Flash Designer

O programa flash a seguir é ainda mais simples, tanto em termos de funcionalidade quanto de conteúdo de interface. Os recursos deste editor flash permitem que você crie facilmente um banner flash para o site em questão de minutos.

Existem mais de 130 efeitos: fade, zoom, girar. Desenhos animados, formas ou texto e até mesmo som são adicionados perfeitamente à sua animação em Flash.

Aqui você também pode especificar OnClick ou OnOver.

Volume: 5,3 MB.

O idioma da interface é russo.

SO: Windows XP/Vista/7

Captura de tela do programa:

baixar Alligator_Flash_Designer_7.0

Outro programa que não é um editor de animação em flash, mas seus recursos são essenciais para um web designer iniciante.

Descompilador Flash Trillix

Flash Decompiler Trillix - o principal objetivo deste programa é exportar arquivos SWF de volta para o formato FLA com um clique do mouse. Recupera todos os objetos Flash de arquivo SWF e os salva em um arquivo FLA, que pode ser editado posteriormente no Flash.

A vantagem do Flash Decompiler é editar sons, imagens, cores, gradientes, linhas, textos dinâmicos e links sem converter para FLA.

Volume: 7,27 MB.

O idioma da interface é russo.

SO: Windows XP/Vista/7

Captura de tela do programa:

Baixar Flash Decompiler Trillix

13 de outubro de 2014