Curso de Flash 5. Autora: Silvana T. Ynemine. Cursos Virtuais. O Site de Cursos do Brasil.

Transcrição

1 Curso de Flash 5 1 Curso de Flash 5 Autora: Silvana T. Ynemine O Site de Cursos do Brasil Proibida qualquer reprodução dessa apostila. Para entrar em contato com a autora, use o professora@cursosvirtuais.com.br

2 Curso de Flash 5 2 Notas: Sobre a apostila: Apostila criada exclusivamente para a Revista - Fev/2001 O conteúdo da apostila é uma versão compacta do Curso de Flash promovido pelo site. Sobre a autora: Silvana Tauhata Ynemine é instrutora do site e ministra diversos cursos, entre eles, de WAP, JavaScript, ASP, Dreamweaver, Java, Flash, DHTML. É autora dos livros: Flash 5, Aprenda Rápido Flash 5, Dreamweaver 3 e Dreamweaver 3 - software em Português. Todos os títulos lançados pela editora Visual Books. Todas as marcas citadas na apostila são exclusivamente de uso didático. Todas as marcas são registradas e de propriedade de seus fabricantes.

3 Curso de Flash 5 3 Índice: Tópicos Página - Introdução Requisitos do Sistema Instalação do software Interface do programa Barra de Menu Barra de Ferramentas Laucher Bar Painéis Bibliotecas Timeline Movie Explorer Iniciando o trabalho com o Flash Novo arquivo e Movie Properties Frames, keyframes, layers, cenas e label Salvando, testando e exportando o filme Desenhando no Flash Animações Tweening motion Tweening shape Mask Motion guide Trabalhando com símbolos Botões Gráficos Movie-clips Imagens Importando imagens Transformando imagens em vetores (trace bitmap) Sons Inserindo sons em botões Inserindo sons em movie-clips Inserindo sons na timeline principal Trabalhando e criando gifs animados Importando um gif animado para o Flash Publicando o filme Criando executáveis FSCommands Dicas Finais Trabalhando com bibliotecas compartilhadas Projeto: Criando um site no Flash Sites... 78

4 Curso de Flash 5 4 Introdução O software Flash é produzido pela Macromedia. Atualmente encontra-se na versão 5.0 e, sem dúvida, é uma das melhores ferramentas para se trabalhar com animações na Internet. Com ele é possível criar não apenas animações, como também pequenos CD-Roms, aplicativos, jogos, entre outros. Com dedicação e criatividade, os desenvolvedores passaram a ter a possibilidade de criar, através do Flash, animações de alto nível para serem usadas em páginas na Internet. Dessa maneira, desde as suas primeiras versões, o programa vem tendo destaque na comunidade dos desenvolvedores de sites. A sua capacidade em elaborar animações complexas em arquivos com baixo tamanho, sem dúvida, tem sido um dos principais motivos para a difusão desse programa, além da sua facilidade em ser manipulado e a sua interatividade. O único senão é que o usuário deverá possuir um plug-in para poder visualizar as animações na Internet. Felizmente os navegadores em suas versões mais atuais já vêm com o plug-in Flash Player embutido em seus programas, o que demonstra o atual crescimento do uso dessa tecnologia na Web. O Flash pode ser adquirido no site da Macromedia ( ). A fabricante também disponibiliza nesse site a versão demonstração do programa com todas as opções habilitadas, porém com tempo limitado de uso (30 dias), a chamada versão Trial. Nesse curso iremos aprender como manipular o software e dominar seus comandos básicos. Dessa maneira poderemos construir sites totalmente interativos e animados seguindo a atual tendência da grande rede.

5 Curso de Flash 5 5 Requisitos do Sistema Para a correta instalação do programa, seu computador dever ter no mínimo as seguintes configurações: Windows:. Processador Pentium 133 Mhz ou Equivalente (Recomendado: 200 Mhz). Plataforma Windows 95 ou superior (inclusive Windows 2000), NT 4.0 ou Superior. Memória de 32 MB RAM (Recomendado: 64 MB). 40 MB disponível no HD. Monitor com resolução de vídeo de 800 x 600. Drive de CD-ROM (somente para instalação via cd-rom). Macintosh:. Processador Power Macintosh (G3 ou superior). Plataforma Mac OS 8.5 ou Superior. Memória 32 MB RAM. 40 MB disponível no HD. Monitor com resolução de vídeo de 800 x 600. Drive de CD-ROM (somente para instalação via cd-rom).

6 Curso de Flash 5 6 Instalação do Software Após obter o programa Flash 5, clique 2X no arquivo executável para iniciar a instalação. Fig Tela de Início da instalação do programa Flash 5. O programa de instalação será executado extraindo os arquivos necessários para a correta instalação. Fig Mensagem do programa antes da instalação. Em seguida, o programa de instalação recomenda a você fechar todos os programas extras que estiverem abertos para que não haja nenhum problema durante o processo. Em seguida clique no botão Next.

7 Curso de Flash 5 7 Fig Contrato de licença do software. A próxima etapa é ler o Contrato de Licença do software. Caso esteja de acordo, clique em Yes. Esse procedimento continua a instalação. Caso você não concorde, clique em No. Fig Escolhendo o diretório de instalação Em seguida, você deve selecionar o diretório de instalação. O programa está configurado para ser instalado no diretório Flash 5 dentro de Arquivos de Programas ou Program Files (no caso do sistema operacional ser em inglês). Caso você queira instalar em outro diretório, basta clicar no botão Browse e indicar o novo diretório em seu HD. Uma vez escolhido o diretório, clique no botão Next.

8 Curso de Flash 5 8 Fig Escolhendo o tipo de instalação O próximo passo é definir o tipo de instalação. Existem três tipos disponíveis:. Typical - instalação padrão. É o tipo de instalação recomendada a ser feita.. Compact - instalação compacta. Instala o mínimo de componentes requeridos pelo programa, por isso ocupa menor espaço no HD.. Custom - instalação customizada. O próprio usuário escolhe os componentes que quer instalar. Esse tipo de instalação é recomendado apenas para usuários avançados. Vamos escolher a instalação Typical. Em seguida, clique em Next. Na próxima tela você deve indicar o nome do programa que aparecerá no menu Programas do Windows. Nessa etapa, basta clicar no botão Next. Fig Instalação do Plug-in.

9 Curso de Flash 5 9 Agora vem um passo importante: a instalação do Plug-in. Marque o navegador que você quer instalar o plug-in Flash Player. Caso você tenha os dois navegadores principais do mercado (Internet Explorer e Netscape) instalados em seu computador, marque as duas caixas de seleção como pode ser visto na Figura 06. Caso contrário, marque apenas o navegador que você possui. Após selecionar, clique no botão Next. Fig Instalação sendo efetuada. Nessa etapa, processo de instalação será iniciado como é mostrado na figura 07. Após terminar, uma tela informando se você quer visualizar o arquivo Read Me é exibido. Se quiser ver, marque a caixa de seleção. Caso contrário, deixe a caixa desmarcada e clique no botão Finish para concluir a instalação. Pronto. O programa Flash 5 está instalado no seu computador e pronto para o uso!

10 Curso de Flash 5 10 Interface do Programa Quando abrimos o programa Flash 5 temos vários menus, barras e painéis disponíveis ao longo da tela. Menu principal Barra de Atalho de Menu Linha do Tempo - Timeline Barra de visualização área de trabalho painéis Laucher Bar Ferramentas Stage ou Palco Fig Visão geral do programa Flash 5. Vamos, a seguir, analisar cada um separadamente: Menu Principal Fig Menu Principal Esse menu contém todos os comandos do software. E está dividido em: - File: neste menu você pode criar um novo arquivo (New), abrir um arquivo já existente (Open), abrir um arquivo como biblioteca (Open as Library), abrir um arquivo como biblioteca compartilhada (Open as Shared Library), fechar um arquivo (Close), salvar (Save), exportar o filme (Export Movie), publicar o

11 Curso de Flash 5 11 filme (Publish), imprimir (Print), entre outros. - Edit: neste menu você pode utilizar recursos de edição como copiar (copy), colar (paste), cortar (cut), desfazer (undo) ou refazer (redo) uma ação, selecionar todo o conteúdo do stage (select all), entre outros. - View: contém recursos relacionados à visualização do programa Flash. Nesse menu você pode inserir um zoom para visualizar melhor a área de trabalho, inserir régua (rulers), grade (gride), ocultar ou mostrar a timeline (timeline), entre outros. - Insert: esse menu contém os elementos a serem inseridos em seu filme, como layers, frames, keyframes, símbolos, entre outros. - Modify: esse menu contém comandos de modificação dos elementos inseridos no seu filme, como frames, scenes, layers, entre outros. - Text: contém recursos de definição de atributos de texto, como tipo de fonte, alinhamento, tamanho, estilos, etc. - Control: contém comandos de controle do filme. Nesse menu você pode rebobinar (Rewind), executar o filme (play), testar seu filme (test movie), entre outros. - Window: esse menu permite a manipulação das janelas na sua área de trabalho, ou seja, através dele, é possível ocultar ou mostrar determinados painéis, janelas e paletas. - Help: esse menu apresenta os tópicos de ajuda, amostras (samples), lições extras (lessons) e informações adicionais sobre o programa. Barra de menu de atalho Fig Barra de menu de atalho. Esta barra é também chamada de Barra de Ferramentas Padrão por conter alguns comandos fundamentais do software. Estão disponíveis nessa barra, os seguintes comandos: - New : Esse ícone cria um novo arquivo.

12 Curso de Flash Open : abre um arquivo já existente. - Save : salva o arquivo atual. - Print : imprime o arquivo. - Print Preview : visualização prévia da impressão. - Cut : corta um conteúdo. - Copy : copia um conteúdo. - Paste : cola um conteúdo. - Undo : desfaz uma ação. - Redo : refaz uma ação. - Snap : ajusta à grade (encaixe). - Smooth : suaviza a linha. - Straighten : torna a linha mais reta. - Rotate : rotaciona um elemento. - Scale : altera a dimensão de um elemento. - Align : alinha os elementos na vertical e na horizontal. - Stop : para a execução de um filme. - Rewind : rebobina o filme, retornando ao primeiro frame. - Step Back : volta um frame por vez. - Play : executa um filme. - Step Forward : avança um frame por vez. - Go to End : vai para o último frame do filme.

13 Curso de Flash 5 13 Barra de Ferramentas A barra de ferramentas apresenta os recursos para efetuar desenhos e inserção de textos no stage. Também permite fazer correções com o uso de borracha e troca de cores. Na parte inferior da barra, conforme o tipo de ferramenta selecionado, podem-se abrir algumas opções para aquela ferramenta, aumentando os recursos do software. Fig Barra de ferramenta. Vamos estudar cada ferramenta: - Arrow Tool (Atalho: tecla V) : esta ferramenta é usada para selecionar, arrastar e transformar elementos. - SubSelect Tool (A) : a ferramenta é usada para selecionar, arrastar e redimensionar elementos. A diferença entre SubSelect Tool e a Arrow Tool é que a primeira seleciona o elemento subdividindo em partes, onde a alteração ocorre em pontos específicos (os nós), enquanto que a segunda, permite a alteração em qualquer ponto do elemento. - Line Tool (N) : utilizada para desenhar uma linha reta. - Lasso Tool (L) : chamada de laço. Essa ferramenta permite selecionar uma área. Para isso, clique na posição inicial da área que quer marcar dentro do stage e mantenha o botão esquerdo do mouse pressionado, em seguida, trace toda a área. - Pen Tool (P) : ferramenta caneta. Usada para desenhar linhas e curvas. - Text Tool (T) : utilizada para inserção de textos. A fonte padrão é Times Roman tamanho 12. Pode-se alterar essas propriedades através do painel Character ou do menu principal -> Text. - Oval Tool (O) : utilizado para desenhar um círculo ou oval. - Retangle Tool (R) : usado para desenhar um retângulo ou quadrado. Um recurso interessante é o arredondamento das bordas. Para isso, basta clicar no ícone Round Rectangle Radius em Options. Abrirá uma janela onde você deve digitar o valor da curvatura.

14 Curso de Flash Pencil Tool (Y) : ferramenta lápis. Utilizada para efetuar qualquer desenho no stage. - Brush Tool (B) : ferramenta pincel. Usada para pintar áreas. - Ink Bottle Tool (S) : efetua a pintura das bordas. - Paint Brucket Tool (K) : ferramenta lata de tinta. Pinta o interior de desenhos fechados. - Dropper Tool (I) : capta a tonalidade de cor de um elemento para ser aplicado em outro. - Eraser Tool (E) : ferramenta borracha. Utilizada para apagar um conteúdo desenhado no stage. Ferramenta de Visualização Fig 12 - Ferramenta de Visualização Essa barra apresenta apenas dois recursos: Hand Tool (H), para movimentar a área de trabalho e Zoom Tool (M ou Z) para dar um zoom no stage. Além da ferramenta de visualização, próximo à barra de status, na parte inferior esquerda, há uma caixa de seleção como é mostrada na figura 13. Fig Visualização da Área de trabalho. Você pode redimensionar o stage para facilitar a visualização e edição de alguns elementos. Quando quiser escolher um tamanho maior ou menor, basta escolher outro valor na caixa de seleção.

15 Curso de Flash 5 15 Ferramenta de Cores Esta ferramenta permite inserir cores nos elementos no stage. - Stroke Color : define uma cor para uma linha ou borda. - Fill Color : define a cor do preenchimento. Fig Ferramenta de Cores - Default Colors : define a cor preta para Stroke Color e a cor branca para Fill Color. - No Color : retira a cor de preenchimento ou da borda, ficando vazio. Basta selecionar o ítem Stroke Color ou Fill Color e pressionar este ícone para que não seja inserido o elemento (preenchimento ou borda). - Swap Colors : inverte as cores de Stroke Color com Fill Color. Laucher Bar O Laucher Bar ou Barra Iniciadora é uma novidade presente na versão 5 do Flash. Ela se localiza na parte inferior do lado direito do programa, próximo à barra de status e contém ícones ( atalhos ) que acessam os seguintes painéis: Fig Laucher Bar - Show Info : Esse ícone o painel Info. - Show Mixer : Esse ícone abre o painel Mixer - Show Character : Esse ícone abre o painel Character. - Show Instance : Esse ícone abre o painel Instance. - Show Movie Explorer : Esse ícone abre o painel Movie Explorer. - Show Actions : Esse ícone abre a janela (Frame ou Object) Actions. - Show Library : Essse ícone abre a biblioteca do filme.

16 Curso de Flash 5 16 Painéis Uma novidade presente no Flash 5 foi a inserção de painéis, permitindo uma maior organização do software. Comandos a fins foram distribuídos no mesmo painel, facilitando a aplicação do mesmo pelo desenvolvedor. Os painéis disponíveis no Flash são: Info: Neste painel ficam as informações sobre o elemento inserido no stage, como por exemplo, a altura (H), largura (W), posição nos eixos X e Y, entre outros. Fig Painel Info Mixer Fig Painel Mixer Este painel permite a alteração de cores no elemento. As opções são as mesmas da barra de ferramenta de cores. Além disso, você pode escolher diretamente a tonalidade RBG digitando o valor correspondente à cor e configurar o grau de transparência (alpha - valores próximos a 100% o elemento fica opaco). Swatches Este painel apresenta as cores disponíveis pelo programa. Na parte inferior do painel, há cores personalizadas com efeitos distintos, com degradé, entre outros. Fig Painel Swatches

17 Curso de Flash 5 17 Character Fig Painel Character Neste painel são configuradas as características da fonte, como o tipo de fonte, o tamanho, efeito (negrito - itálico), cor, espaçamento entre as letras, subscrito, entre outros. No campo URL você pode digitar um endereço e aquele texto passa a ser um link! Exemplo: Paragraph Este painel permite definir o tipo de alinhamento do texto, além de valores de recuo do texto, margens, entre outros. Fig Painel Paragraph Text Options Fig Painel Text Options Este painel apresenta as opções de texto presentes no Flash 5. São 3 opções:. Static Text: usado para inserção de texto no stage.. Dynamic Text: usado para textos dinâmicos.. Input Text: usado para entradas de texto por parte do usuário, inclusive senhas.

18 Curso de Flash 5 18 Instance Neste painel é definido o nome da instância de um objeto. O painel será bastante usado para definir nome de instâncias de movie-clips, o que é fundamental para o correto funcionamento do filme. Fig Painel Instance Effect Este painel permite definir o tipo de efeito a ser aplicado em símbolos. Pode-se aplicar graus de transparências (alpha), alterar o brilho (brightness), cor, entre outros. Fig Painel Effect Frame Este painel permite inserir dois parâmetros no frame: o label (rótulo) que servirá de identificação para aquele(s) frame(s) e o tweening que é fundamental para se criar animações. Fig Painel Frame Sound Este painel define as características do som inserido no Flash. Fig Painel Sound

19 Curso de Flash 5 19 Transform Este painel permite a aplicação de transformações nos elementos, como rotações e alterações de perspectiva. Fig Painel Transform Stroke Este painel permite definir o tipo de linha utilizada pelo elemento. Você pode escolher usar linhas sólidas, linhas tracejadas, pontilhadas, entre outros. Pode-se escolher a cor e a espessura da linha. Fig Painel Stroke Fill Este painel permite definir o tipo e a cor do preeenchimento. Você pode criar preenchimentos sólidos e em degradê. Fig Painel Fill Align Este painel permite definir o alinhamento entre objetos diferentes no Stage. Pode-se alinhar na horizontal, na vertical, espaço entre os elementos, entre outros. Fig Painel Align

20 Curso de Flash 5 20 Bibliotecas As bibliotecas são coleções de elementos que estão disponíveis para serem usados no filme. O Flash 5 apresenta basicamente 3 tipos de bibliotecas. São eles:. biblioteca do filme. bibliotecas comuns. bibliotecas compartilhadas Biblioteca do Filme A biblioteca do filme contém todos os elementos inseridos no filme. Ela pode ser aberta através do menu principal Window -> Library ou através dos atalhos CRTL+L. Fig Biblioteca do filme. A biblioteca do filme permite a organização dos elementos do seu filme, separando-os por pastas. Através dessa biblioteca você pode criar novos elementos. Veja na barra inferior da biblioteca os comandos: - New Symbol : cria um novo símbolo (movie-clip, botão ou gráfico). - New Folder : cria uma nova pasta para organizar o conteúdo da biblioteca. Dessa maneira, você pode inserir todos os botões em uma pasta, todos os movieclips em outra, etc. Basta clicar no ícone New Folder e nomear a pasta. Em seguida, arraste os elementos que quiser para dentro da pasta. - Properties : exibe as propriedades de um elemento. - Delete : exclui um ítem na biblioteca. Para usar, é só clicar 1X no elemento dentro da biblioteca e em seguida clicar no ícone. Para usar um elemento que está nessa biblioteca, basta arrastá-lo para o stage.

21 Curso de Flash 5 21 Bibliotecas Comuns As bibliotecas comuns ou Common Libraries são bibliotecas do próprio programa Flash contendo alguns elementos que você pode usar várias vezes nos diversos filmes. Para acionar esse tipo de biblioteca vá ao menu Window -> Common Libraries e clique na biblioteca a sua escolha. As principais bibliotecas são: Button Contém botões pré-definidos. Graphics Contém imagens e pequenas animações prontas. Movie-clips Contém movie-clips prontos. Sounds Contém sons prontos para uso. Fig Bibliotecas Comuns: Botões, Gráficos, Movie-clips e Sons, respectivamente. Além dessas quatro bibliotecas, o Flash 5 ainda contém a Biblioteca de Smart Clips que são elementos de formulários já pré-configurados e a Biblioteca Learning Interactions, com explicações de criação de algumas interações. Para usar um elemento que está em qualquer uma das bibliotecas, basta arrastá-lo para o stage.

22 Curso de Flash 5 22 Shared Libraries As Shared Libraries ou bibliotecas compartilhadas estão presentes apenas a partir da versão 5 do Flash. Elas permitem que um mesmo elemento possa ser compartilhado por diversos filmes em um site. No curso, na seção Dicas Finais, há um exercício de uso das bibliotecas compartilhadas. Timeline A timeline ou linha do tempo é o local onde controlamos e coordenamos a animação. Cena (Scene) Camada (Layer) Frames Número do frame Fig Timeline Os elementos que compões a timeline são: - Scene: representa a cena atual na qual estamos trabalhando. - Layer: representa a camada que estamos trabalhando. Um filme pode ter várias camadas, sendo que a animação de uma camada não interfere na outra (exceto em casos onde há interações). - Frames: são chamados de quadros. Os quadros terão o conteúdo da animação. A sequência de quadros forma a animação final. - Keyframes: são chamados de quadros-chaves. Eles são inseridos dentro de um frame somente quando houver modificação no conteúdo do frame em algum elemento ou inserção de alguma ação.

23 Curso de Flash 5 23 Movie Explorer O Movie Explorer foi mais um comando incorporado na versão 5 do Flash. Esse recurso permite que o desenvolvedor tenha uma visualização da estrutura do seu filme, além de poder gerenciar seu filme através dele. Para acioná-lo vá ao menu principal Window -> Movie Explorer ou aperte simultaneamente as teclas CRTL + ALT + M. Na parte inferior é mostrada a estrutura do filme: as cenas, layers, frames. Observe a manutenção da estrutura do filme, ou seja, Symbol 1, por exemplo, está presente dentro do frame 1 que por sua vez está no layer 1 da Scene 1. Fig Movie Explorer Você pode especificar o que quer visualizar no Movie Explorer. Para isso basta clicar nos ícones do ítem Show, no alto da janela. São eles: - Show Text : Mosta os textos inseridos no stage. - Show Buttons, Movie-clips and Graphics : Mostra os símbolos inseridos no stage. - Show Action Scripts : mostra os action scripts inseridos no filme. - Show Vídeos, Sounds and Bitmap : mostra os vídeos, sons e figuras inseridos no stage. - Show Frames and layers : mostra os frames e layers do filme. - Customize which items to show : configura os ítens que o Movie Explorer deve mostrar. Ao clicar no ícone abrirá uma janela para você marcar as opções. O Movie Explorer ainda apresenta um campo de pesquisa chamado Find. Basta digitar o conteúdo que quer encontrar para ele mostrar. Portanto, o Movie Explorer é um recurso interessante de visualização do filme como um todo, facilitando o seu desenvolvimento.

24 Curso de Flash 5 24 Iniciando o Trabalho com o Flash 5 Novo Arquivo Quando abrimos o programa Flash, ele abre com um novo arquivo em branco. Iremos trabalhar nesse arquivo. Caso, por algum motivo, não abra um novo arquivo, você pode iniciar o trabalho de três maneiras:. menu File -> New. clicando no ícone New da barra de atalhos.. apertando simultaneamente as teclas CRTL+N. Utilizando qualquer um dos métodos acima, um novo arquivo será criado no Flash. Após criar o novo arquivo, basta inserir um conteúdo no stage (área de trabalho) e começar a trabalhar no seu filme. Movie Properties A seguir, você deve configurar as propriedades do seu filme. Isso é feito através do Movie Properties, presente no menu Modify -> Movie. Se preferir, use o atalho do teclado CRTL+M. Fig Movie Properties. - Frame Rate: é a taxa máxima de execução da quantidade de frames por segundo. O padrão é 12 fps, ou seja, no máximo, 12 frames por segundo. - Dimensions: determina o tamanho do stage (área de trabalho). O tamanho padrão é 550 pixels de largura (W) e 400 pixels de altura (H). Se quiser outro tamanho de filme, basta digitar os novos valores nos respectivos campos.

25 Curso de Flash Match: determina o tamanho do stage alterando o valor digitado no ítem dimensions. Se você clicar em Printer, o stage ficará do tamanho máximo para ser impresso de acordo com o papel definido para a impressão. Se clicar em Contents, o tamanho do stage ficará de acordo com o conteúdo inserido na área de trabalho. - Background Color: determina a cor de fundo do filme. - Ruler Units: determina a unidade da régua. O valor padrão é em pixels. Para ativar a régua no Flash 5, acione o menu View -> Rulers. A régua ficará na lateral (vertical e horizontal) ao redor da área de trabalho. Frames, Keyframes, Layers e Cenas Frames A quantidade de frames de uma animação, como já foi dito anteriormente, determinará o tamanho da animação. Em outras palavras, isso significa que se um filme tiver 10 frames e um segundo filme tiver 90 frames, o primeiro filme será executado mais rapidamente do que o segundo. Você provavelmente já deve ter brincado de fazer cinema com um bloco de papel. A idéia era desenhar em cada folha do bloco uma sequência de movimento. No final, as folhas eram passadas rapidamente dando a sensação do filme. Voltando ao Flash, o que estaremos fazendo seria exatamente isso: cada folha do bloco de papel seria equivalente a um Frame. O conjunto de Frames (o bloco), seria uma cena ou o próprio filme. Inserindo Frames Para inserir frames na timeline, clique 1X no frame 1 (ou se o layer tiver mais frames, clique a partir do frame que você quer inserir) e pressione F5 quantas vezes forem necessárias. Outra maneira é através do menu principal Insert -> Frame. A terceira opção é clicar com o botão direito do mouse sobre o frame 1 e clicar, em seguida, na opção Insert Frame. Apagando Frames Para apagar um frame, clique com o botão direito do mouse sobre o frame que quer apagar e em seguida na opção Remove Frame. Além dessa opção, você pode ir ao menu principal Insert -> Remove Frame ou ainda apertar as teclas SHIFT + F5.

26 Curso de Flash 5 26 Keyframes Você deve inserir um keyframe quando quiser alterar o conteúdo de um frame ou quando quiser inserir uma ação (Action) no frame. Inserindo Keyframes Para inserir um keyframe, clique 1X no frame onde for fazer a inserção e em seguida vá ao menu principal Insert -> Keyframe. Se preferir utilizar uma tecla de atalho, basta apertar F6. Uma outra maneira de fazer a inserção é clicar com o botão direito do mouse no frame e em seguida em Insert Keyframe. Limpando Keyframes Para apagar o conteúdo de um keyframe, vá ao menu Insert -> Clear Keyframe. Se quiser, clique com o botão direito do mouse no keyframe que quer apagar e em seguida em Clear Keyframe. O atalho para essa função é SHIFT+F6. Layers Os layers ou camadas são usados no desenvolvimento do seu filme para que uma animação não interfira em outra. Dessa maneira é possível haver animações ocorrendo simultaneamente. Fig Layer Inserindo layers Para inserir um layer, clique no ícone Insert Layer inferior esquerda da timeline. Se preferir, va ao menu principal Insert -> Layer. presente na parte Apagando um layer Para apagar um layer, clique 1X sobre o layer que você quer apagar e em seguida clique no ícone de lixeira, presente na parte inferior da timeline.

27 Curso de Flash 5 27 Cenas As cenas têm a finalidade de organizar o seu filme. Você pode colocar uma seção do seu site em uma cena diferente. Isso vai de acordo com o desenvolvedor, uma vez que você pode criar todo o seu filme em uma única cena perfeitamente. Inserindo Cenas Existem várias maneiras de se inserir uma cena. A mais fácil será usando o painel Scene. Fig Painel Scene Para inserir, clique no ícone Insert Scene painel. na parte inferior direita do Apagando Cenas Para apagar uma cena e consequentemente todo o seu conteúdo, clique 1X na cena que quer apagar dentro do painel Scene e em seguida clique no ícone da lixeira. Abrirá uma janela de confirmação se você realmente deseja apagar a cena, já que o processo é irreversível. Label O Label ou etiqueta é uma espécie de identificador de um frame. Você pode especificar visualmente na timeline onde uma determinada ação, animação ou efeito ocorre. Repare na Fig. 37 os 3 layers. O Layer1 contém uma animação que se inicia no frame 1 e termina no frame 10. O Layer2 contem uma outra animação que se inicia no Fig Labels no layer 3. frame 11 e termina no frame 20. O Layer 3 contém apenas labels, determinando o início da animacao1 e da animacao2.

28 Curso de Flash 5 28 Inserindo um label A inserção de uma etiqueta deve ser feita no painel Frame. Você deve clicar no frame que quer inserir o label e escrever o nome dele no campo Label do painel Frame. Caso o frame que você quiser inserir um label esteja após o frame 1, você deve criar um keyframe antes. Fig Inserindo um label. Salvando um filme Para salvar um filme, vá ao menu principal File -> Save. Se preferir utilize o menu de atalho Save ou acione as teclas CRTL+S. Testando o filme Para testar o filme acione o comando Control -> Test Movie ou utilize o atalho CRTL+ Enter. O seu filme será testado dentro do próprio Flash. Exportando o filme Uma observação importante a ser feita é que os arquivos salvos no Flash conterão a extensão.fla. Para que seu filme seja visualizado na Internet, ele deverá ser exportado para o formato.swf. Isso é feito através do comando File -> Export Movie ou acionando as seguintes teclas simultaneamente: CRTL+ALT+SHIFT+S. Uma vez exportado, você pode visualizar em qualquer computador que tenha o plug-in Flash Player instalado.

29 Curso de Flash 5 29 Desenhando no Flash O Flash é um programa muito interessante para se fazer desenhos. As ferramentas utilizadas estão presentes na barra de ferramentas no lado esquerdo da tela e todas elas são semelhantes às ferramentas de desenhos de programas gráficos do mercado. A combinação ferramenta + painel pode gerar efeitos interessantes, como a alteração do tipo de traçado de linhas (painel Stroke), utilização de degradés (painéis Swatches e Fill) em cores internas de desenhos, entre outros. Vamos fazer dois exercícios para exemplificar: Exercício 1: - Abra o programa Flash e crie um novo arquivo. Caso tenha alguma dificuldade, consulte o ítem Iniciando o trabalho com o Flash 5. - Selecione a ferramenta Rectangle Tool e desenhe um quadrado no stage. - Selecione, em seguida, a ferramenta Arrow Tool. Vá ao menu Edit -> Select All. Se preferir aperte CRTL+A para selecionar tudo. Fig Quadrado desenhado e selecionado no stage. - Abra o painel Stroke (menu Window -> Panels -> Stroke). Escolha um tipo de linha e a espessura dela. Fig Painel Stroke com a linha pontinhada escolhida e a espessura 5. No lado esquerdo, o quadrado onde o efeito foi aplicado. - Salve o seu arquivo apertando CRTL+S. Abrirá uma janela para que você indique o nome do arquivo (exercicio1) e o diretório onde irá querer salvar. Após fazer isso, clique no botão Save.

30 Curso de Flash 5 30 Exercício 2: - Abra o programa Flash e crie um novo arquivo. - Selecione a ferramenta Oval Tool. Nas ferramentas de cores, clique em Stroke Color e em seguida no ícone No Color para que o conteúdo desenhado seja apenas de preenchimento e não tenha contorno. - No ítem Fill color, escolha o tipo degrade. Fig Escolha da cor de preenchimento na ferramenta Fill Color. - Em seguida, desenhe um círculo no stage. O resultado poderá ser visto na figura abaixo: Fig Círculo com degradê. - Agora vamos melhorar esse efeito, simulando uma bola em 3D. Para isso, selecione agora a ferramenta Paint Bucket Tool. Em seguida, clique em qualquer ponto na extremidade do desenho no stage. - Se deu tudo certo, você terá uma bola com sombreado simulando um efeito 3D. - Salve como exercicio2.fla. Fig Bola em 3D. Esses dois exercícios são exemplos simples de desenhos feitos no Flash. Com um pouco de criatividade e facilidade na manipulação das demais ferramentas é possível fazer desenhos bem interessantes dentro do software. Só para ilustrar, você já encontra na Web, sites de desenhos animados em Flash.

31 Curso de Flash 5 31 Animações A seguir, vamos estudar algumas técnicas de animações presentes no Flash. São elas:. Tweening Motion. Tweening Shape. Mask. Motion Guide Tweening Motion O Tweening também é chamado de interpolação. Este tipo de animação é linear e o desenvolvedor precisa apenas criar o frame inicial e o último frame da animação com o conteúdo modificado, que o programa cria automaticamente o conteúdo dos frames intermediários. O Tweening Motion é usado para animar letras e símbolos (gráficos) no Flash. Exercício 3: - Crie um novo arquivo no Flash. - Clique no frame 30 e aperte F5 para criar 30 frames no layer 1. - Selecione a ferramenta Text Tool e digite no stage uma frase. Fig Texto digitado no stage. - Se quiser alterar as características da fonte (tipo, cor, tamanho), selecione todo o texto com o ponteiro do mouse e em seguida vá ao menu Text e escolha a opção que quiser. Se preferir, pode efetuar a alteração diretamente no painel Character. - Observe a alça do texto (Fig. 44) na parte superior direita. Essa alça significa que você está criando um texto do tipo Static Text. Caso a alça esteja na parte inferior direita, altere o tipo de texto no painel Text Options para Static Text. - Em seguida, clique no frame 30 e crie um keyframe, apertando F6. Com a ferramenta Arrow Tool selecionada, arraste a frase digitada para outro local no stage. Fig Aspecto da timeline com um keyframe no frame 30. Repare que o frame 30 passa a ter uma bolinha preenchida, indicando que ali tem um keyframe. - Clique no frame 1. Abra o painel Frame (Window -> Panels -> Frame). No campo Tweening selecione o tipo Motion. - Salve seu arquivo como exercicio 3. Teste seu filme apertando CRTL+ Enter.

32 Curso de Flash 5 32 Fig Aspecto da timeline após a aplicação do tweening motion. Nota: você pode inserir uma rotação com o tweening motion. No painel frame, basta selecionar o ítem rotate como CW ou CWW e digitar um número maior que 1 no campo times. Tweening Shape O Tweening shape é usado para criar movimentos em desenhos feitos no Flash. Exercício 4: - Crie um novo arquivo. Clique no frame 20 e aperte F5 para criar os frames. - Selecione a ferramenta Rectangle Tool e desenhe um quadrado no stage. Se quiser, altere as características da borda no painel Stroke como fizemos no exercício 1. - Clique no frame 20 e crie um keyframe (F6). Se tiver dificuldades, consulte o ítem Iniciando o trabalho com o Flash 5. A partir desse momento vamos partir do princípio que você ja sabe criar frames, keyframes, entre outros. - Em seguida, com a ferramenta Arrow Tool selecionada, arraste o quadrado para uma outra posição no stage. - Clique no frame 1 e abra o painel Frame. Selecione o tipo tweening shape, como pode ser visto na Fig. 47. Fig Painel frame com o tweening shape aplicado. - Salve seu exercício como exercicio4 e teste (CRT+ENTER). Fig Aspecto da timeline após a aplicação do tweening shape.

33 Curso de Flash 5 33 Mask O mask ou máscara permite a substituição de um conteúdo sobreposto de uma camada por outro. Para esse efeito utilizaremos dois layers. Exercício 5: - Crie um novo arquivo. - Deixe o Layer 1 com apenas um frame. Em seguida, crie um novo layer clicando no icone Insert Layer na parte inferior esquerda da timeline. Fig Layer 2 em cima do Layer 1. - Clique no frame 1 do layer de cima (Layer 2), selecione a ferramenta Text Tool e digite uma frase no stage. - Clique no frame 1 do layer de baixo (Layer 1), selecione a ferramenta Rectangle Tool. Em seguida, escolha uma cor diferente da fonte na ferramenta Fill Color. Nesse caso, escolhemos a cor em degradê azul. - Desenhe um retângulo no stage, maior do que a frase escrita. Fig Frase escrita em amarelo (layer 2), contendo um retângulo (Layer 1) maior que a frase. - Clique sobre o nome Layer 2 com o botão direito do mouse e em seguida na opção Mask. - Se deu tudo certo, o mask foi aplicado. Veja o resultado na Fig. 51b. - Salve seu arquivo como exercicio5.fla. Nota: repare que a frase passa a ficar na cor do fundo. Fig. 51a - Aplicação do efeito Mask no Layer 2. Fig. 51b - Aspecto final do stage após a aplicação do Mask.

34 Curso de Flash 5 34 Motion Guide O motion guide ou guia de movimento permite a criação de trajetórias não lineares. Exercício 6: - Crie um novo arquivo. - Deixe o layer 1 com 20 frames. - No stage selecione a ferramenta Text Tool e digite seu nome. - Clique em cima do nome Layer 1 com o botão direito do mouse e em seguida no ítem Add Motion Guide. Fig Motion guide aplicado no Layer 1. - Um novo layer é automaticamente criado. Nesse layer, agora, chamado de Guide: Layer 1, deve ser especificado a trajetória do elemento presente no Layer 1. Faremos isso a seguir. - Clique no frame 1 do Guide: Layer 1. Selecione a ferramenta Pencil Tool e desenhe a trajetória, como mostrada na Figura 53. Fig Trajetória do texto. - Em seguida, clique no frame 1 do Layer 1. Arraste o texto digitado para o começo da trajetória. Observe que há uma posição de encaixe do texto com a linha. Essa posição é mostrada através de uma alça no meio do texto. área cinza texto fora do stage alça de encaixe stage área branca Fig Encaixe do texto na trajetória trajetória

35 Curso de Flash 5 35 Fig Após o encaixe do elemento na trajetória, o ponto central é mostrado com um sinal de +. - Clique no frame 20 do Layer 1. Crie um keyframe (F6). Em seguida, selecione a ferramenta Arrow Tool e arraste a frase para o final da trajetória. Faça o encaixe corretamente. - Clique no frame 1 do Layer 1 e aplique um tweening motion (painel Frames) Fig Painel Frames com o Tweening Motion aplicado no frame 1 do Layer 1. Fig Aspecto final da timeline. - Salve como exercicio6.fla. - Teste o arquivo. Nota: a trajetória ficará desenhada no stage. Porém, ao exportar o filme, ela não aparece.

36 Curso de Flash 5 36 Trabalhando com os Símbolos Os símbolo que você pode usar no Flash são:. Botões. Gráficos e. Movie-clips O processo de criação dos três tipos de símbolos é sempre o mesmo. Você deve selecionar com o ponteiro do mouse o conteúdo que quer transformar em símbolo e em seguida ir ao menu Insert -> Convert to Symbol. Se preferir acione a tecla F8. Abrirá a tela Symbol Properties, onde deve-se marcar, no campo Behavior, o tipo de símbolo a ser criado. Fig Janela Symbol Properties. Botões Os botões servem para determinar uma ação em seu filme. Essas ações podem ser disparadas através de eventos do mouse ou de teclado. Gráficos São imagens estáticas. Movie-clips São pequenos trechos de animações que são independentes da timeline principal. A interação é feita através do comando Tell Target. A seguir, vamos fazer três exercícios. Em cada um, criaremos um tipo de símbolo e usaremos alguns conceitos já vistos no curso.

37 Curso de Flash 5 37 Exercício 7: - Crie um novo arquivo no Flash. - Clique no frame 30 e aperte F5 para criar 30 frames. - Selecione a ferramenta Rectangle Tool e desenhe um retângulo no stage. Se quiser altere a cor e o tipo de borda. - Em seguida, selecione a ferramenta Text Tool e digite a palavra Links. - Aperte CRTL+A para selecionar todo o conteúdo e aperte F8. - Na janela Symbol Properties, marque o Behavior Button. Aperte Ok. Fig Janela Symbol Properties. No lado esquerdo o conteúdo selecionado para ser transformado em botão. - Pronto. O botão já foi criado. O segundo passo é editar o botão. - Clique 2X sobre o botão. Abrirá a timeline do Symbol 1, que é o botão que estamos trabalhando. - Observe os campos Up, Over, down e Hit. Eles definem os estados do botão:. Up: estado do o botão ao ser carregado.. Over: estado quando o ponteiro do mouse passa sobre o botão.. Down: estado do botão quando é clicado.. Hit: Área clicável do botão. Portanto, será necessário definir os quatro campos. Para isso, crie um keyframe em cada um dos campos. Fig Timeline do botão com um keyframe em cada campo. - Clique no campo Over, aperte ESC para desmarcar todo o conteúdo. Em seguida clique 1X no texto do botão e altere a cor da fonte. - Clique no campo Hit e desenhe um retângulo cobrindo toda a área do botão. Fazemos isso para informar a área que poderá ser clicada no botão. - Clique na palavra Scene 1 no alto da timeline do botão para retornar à timeline principal.

38 Curso de Flash Agora só falta inserir uma ação nele. - Para criar uma ação, clique 1X no botão para marcá-lo. Em seguida, abra o painel Object Actions (CRTL+ALT+A). Na coluna à esquerda do painel ficam os actions (ações) que você pode aplicar. Os actions aplicados ficam na coluna da direita. - Clique 2X no action Get URL presente no ítem Basic Actions. Alguns parâmetros se abrem no final do painel. Basta preencher o campo URL com seu site (Fig. 62). Exemplo: Fig Painel Object Actions Fig Parâmetro de configuração do comando Get URL. - Salve o exercício como exercicio7.fla e teste o botão quando estiver conectado à Internet. Se deu tudo certo, ele acessará o site que você especificou. Nota: tenha sempre o hábito de marcar a área de clique no campo Hit do botão. Caso você crie um botão contendo apenas letras e o campo Hit sem conteúdo, o botão poderá ser difícil de ser clicado! Exercício 8: - Crie um novo arquivo no Flash. - Deixe o Layer 1 com 20 frames no total. - Escreva seu nome no stage. Se preferir, abra o painel Character e troque o tipo de fonte, tamanho e cor. - Clique uma vez sobre o texto inserido e aperte F8 para criar o símbolo.

39 Curso de Flash 5 39 Fig Janela Symbol Properties aberta ao criar um símbolo do tipo Gráfico. - Marque a opção Graphic no ítem Behavior, como mostrada na fig. 63. Em seguida, aperte o botão Ok. Um símbolo gráfico foi criado. Utilizaremos esse símbolo para animações com efeitos, que faremos a seguir: - Clique no frame 20 e crie um keyframe. - Clique no frame 1 e abra o painel Effect (menu Window -> Panels -> Effect) e escolha a opção Alpha. Essa opção define a transparência. Fig Selecionando o efeito alpha. - Após selecionar esse efeito, deve-se definir o grau de transparência. Digite o valor 0%. Ou se preferir clique no ícone de triângulo no lado direito do campo de digitação para especificar o novo valor (Fig. 65). Fig Aplicação do efeito alpha a 0%. Repare no lado esquerdo, o gráfico com transparência total (alpha 0%). - Abra o painel Frame e aplique o tweening motion no frame 1.

40 Curso de Flash 5 40 Fig Painel Frame com Tweening motion aplicado no frame 1. Fig Aspecto da timeline. - Salve o exercício como exercicio8.fla Nota: Este é um exemplo de efeito Fade. Você pode criar várias animações simultâneas em seu filme, basta inserir cada animação em um layer diferente. Dessa maneira, uma não interfere na outra. Se quiser testar, crie um novo layer e faça uma outra animação nela com outros elementos (botões, gráficos, etc). Exercício 9: - Crie um novo arquivo com um frame. - Com a ferramenta Oval Tool desenhe um círculo pequeno no stage. - Em seguida, selecione o círculo e aperte F8. Iremos criar um movie-clip. Então, marque a opção Movie-clip no ítem Behavior da janela Symbol Properties. A seguir, aperte o botão ok. Fig Criando um movie-clip.

41 Curso de Flash Uma vez criado o movie-clip, clique 2X sobre ele para editá-lo. Nesse momento você entra na timeline do movie-clip (Symbol 1). - Clique no frame 10 e aperte F5, para criar 10 frames na timeline do símbolo. - Neste frame 10, crie um keyframe. Vá ao menu Modify -> Transform -> Scale and Rotate ou pressione simultaneamente CRTL+ ALT+S. Abrirá uma tela para você determinar o quanto quer redimensionar ou rotacionar a figura. Fig Redimensionando o desenho no stage. - Digite o valor 150 no campo Scale. Em seguida clique em Ok. O desenho aumentou de tamanho. - Clique no frame 1 e aplique um Tweening shape no painel Frame. Fig Tweening shape aplicado no frame 1 da timeline do símbolo. - Clique no frame 1. Abra o painel Frame Actions (menu Window -> Actions) Clique 2X no action Stop presente no ítem Basic Actions. Estamos inserindo uma ação para parar quando o frame 1 for executado. Isso faz com que a animação não seja executada inicialmente e sim quando quisermos. Fig Parte da janela Frame Actions. No frame 1 foi inserido o action Stop.

42 Curso de Flash 5 42 Fig Aspecto da timeline do movie-clip. - Clique na Scene 1 no alto da timeline para retornar à cena 1 do filme. Voltamos à timeline principal. - Selecione a ferramenta Text Tool e digite a frase Clique Aqui. Escolha a fonte, tamanho e cor que desejar. - A seguir, selecione apenas o conteúdo do texto e aperte F8, marque a opção Button no ítem Behavior, para criarmos o botão. - Clique 2X no botão para editarmos. - Crie um keyframe nos 4 campos do botão: up, over, down e hit. - No campo Hit desenhe um retângulo cobrindo todo o texto. - No campo over, troque a cor da frase. - Retorne à Scene 1. A seguir, criaremos uma interação via Tell Target para interagir o botão com o movie-clip. - Clique 1X no movie-clip e abra o painel Instance. No campo Name digite: mc. Estamos colocando o nome do movie-clip como sendo mc. Fig Nome da instância do movie-clip no painel Instance. No lado esquerdo, no alto, o movie-clip, na parte inferior, o botão Clique aqui. - Agora, iremos inserir uma ação para o botão relacionando com o movie-clip. - Clique 1X sobre o botão e abra o painel Object Actions. No ítem Basic Actions há um ítem chamado Tell target. Clique 2X nele. - O próximo passo será configurar o parâmetro do comando. Na parte inferior da janela Object Actions (Fig. 74) aparece o campo Target.

43 Curso de Flash 5 43 Fig Parte da janela Object Actions, aplicando a ação Tell Target. - Em target digite mc. Fig Action Tell Target inserido. - Em seguida, aplique o action Go to presente em Basic Actions. Fig Aplicação do action Go To. - No campo Type escolha o tipo Next Frame. Com isso, cada vez que o botão for acionado, ele irá para o próximo frame do movie clip mc. - Salve o exercício como exercicio9.fla. Teste o filme apertando o botão várias vezes.

44 Curso de Flash 5 44 Imagens Além de desenhos no Flash, o programa suporta imagens nos formatos.gif,.jpg,.png, entre outros. Para utilizar imagens no Flash é necessário fazer a importação. Importando Imagens Para importar imagens, vá ao menu File -> Import. Aparecerá uma tela onde você deve selecionar a imagem que quer utilizar. Essa imagem é inserida no stage. Em seguida você pode trabalhar como quiser com ela. Exercício 10: - Crie um novo arquivo. - Deixe o Layer 1 com 20 frames. - Importe uma imagem para o seu filme. - Crie um keyframe no frame 20. Arraste a figura para uma outra posição no stage. - Clique no frame 1 e aplique um Tweening motion com as seguintes configurações: Rotate: CW 2 times Em seguida aperte Enter. Fig Aplicação do Tweening Motion no frame 1. - Salve o exercício como exercicio10.fla. Teste a animação. Nota: se você quiser aplicar efeitos presente no painel Effects, deverá transformar a figura em um símbolo do tipo Graphics.

45 Curso de Flash 5 45 Transformando imagens em vetores (trace bitmap) O Flash possui um recurso no software de transformar uma imagem bitmap em vetor. Isso é interessante de se fazer caso queira alterar alguma propriedade da imagem dentro do Flash. Para transformar imagens em vetores usaremos o comando Trace Bitmap. Vale lembrar que ao fazer a conversão, normalmente o filme fica mais pesado e o resultado final da conversão pode não ser ideal. Quanto mais simples a figura, melhor o resultado gerado. Exercício 11: - Crie um novo arquivo no Flash. - Deixe o layer 1 com 15 frames. - Importe uma figura no Flash. Procure importar uma figura mais simples. - Clique 1X na figura para selecioná-la e em seguida vá ao menu Modify -> Trace Bitmap. Fig Transformando uma imagem jpg em vetor. - Na janela Trace Bitmap coloque as seguintes configurações: Color threshold: 10 (ou valor 1) Minimum Area: 1 Curve Fit: Pixels Em seguida, aperte ok para iniciar o processo. Quanto mais complexa a imagem usada, maior o tempo de conversão. Após a conversão, o comportamento da figura é de vetor, ou seja, você pode manipular a figura utilizando a barra de ferramentas, mudar a cor, recortar pedaços, entre outros.

46 Curso de Flash Clique no frame 15 e crie um keyframe. - Vá ao menu Modify -> Transform -> Scale and Rotate. Na janela que se abrir, digite o valor 200 para aumentar a imagem. - Na figura aumentada, se quiser, altere alguma característica da figura. No nosso caso, alteramos a cor do texto. Fig Figura redimensionada, com a cor do texto alterada no frame Clique no frame 1 e aplique no painel Frame o Tweening shape. Fig Aplicação do Tweening shape no frame 1. - Salve o exercício como exercicio11.fla. Teste seu filme. Nota: Caso você não queira que a animação fique sendo executada continuamente, insira um action Stop no frame 15. Essa aplicação é feita no painel Frame Actions.

47 Curso de Flash 5 47 Sons Além das animações, você pode inserir sons nos seus filmes. Esses sons podem estar associados a:. um botão. uma timeline (principal ou dentro de um movie-clip). Com isso, você pode criar trilhas ou efeitos sonoros nos filmes. Inserindo sons em um botão Um recurso interessante para inserir em um botão é um som. Você pode inserir o som no momento em que o usuário passar o mouse sobre o botão. Isso é definido no campo OVER quando estiver editando o botão. Vamos fazer o exercício a seguir para entender processo. Exercício 12: - Crie um novo arquivo com um frame apenas. - Crie um botão (F8) com a inscrição Botão. - Após criar o botão, clique 2X nele para editá-lo. - Nos quatro campos de edição, crie um keyframe e faça as edições no botão como de costume. - Abra a biblioteca de som (menu Window -> Common Libraries -> Sounds). - Clique no campo Over. Escolha um som e arraste-o para cima do botão no stage. Fig Som inserido no campo over do botão. Repare no desenho de onda dentro do campo. - Retorne à Scene 1. Abra o painel Object actions e insira um action para esse botão, como exemplo, um Get URL, como fizemos no exercício 7. Caso tenha dificuldades, recorde o exercício 7. - Salve como exercicio12.fla. Teste seu botão passando o mouse sobre ele.