Baixe o app para aproveitar ainda mais
Prévia do material em texto
2 Sumário Aula 1 – Introdução ao Adobe Flash CS6................................ 6 Definição Principal do Flash CS6 ............................................... 6 As Ferramentas do Flash CS6 .................................................. 7 Linha do Tempo ................................................................... 10 Exercícios de Fixação: ........................................................... 13 Aula 2 – Configuração de Palcos .......................................... 14 Palcos e Filmes no Flash CS6 ................................................. 14 Salvar documentos Flash ...................................................... 19 Salvar um documento Flash no formato FLA padrão ................. 19 Salvar um documento no formato XFL descompactado .............. 19 Salvar um documento como modelo ....................................... 20 Salvar documento como documento Flash CS4 ........................ 20 Salvar documentos ao sair do Flash ........................................ 20 Exercícios: .......................................................................... 21 Exercícios de Fixação: ........................................................... 22 Aula 3 – Trabalhando com Ferramentas de Desenho ............ 23 Compreendendo as Ferramentas de Desenho .................... 23 Desenhar com a ferramenta Lápis .......................................... 27 Pinte com a ferramenta Pincel ............................................... 28 Ferramenta Seleção ............................................................. 29 Ferramenta de Subseleção .................................................... 30 Exercícios: .......................................................................... 31 Exercícios de Fixação: ........................................................... 32 Aula 4 – Compreendendo o funcionamento de Gradientes e Pinturas ............................................................................... 33 Degradês e Pinturas ............................................................. 33 Ferramenta Tinteiro .............................................................. 35 Ferramenta Balde de Tinta .................................................... 35 Transformação de gradiente .................................................. 36 Exercícios: .......................................................................... 37 Exercícios de fixação: ........................................................... 38 3 Aula 5 – Trabalhando com Grupos no Flash CS6 .................. 39 Compreendendo os grupos no Flash CS6 ................................. 39 Exercícios: .......................................................................... 43 Exercícios de Fixação: ........................................................... 44 Aula 6 – Entendendo parte da Barra de Ferramentas ........... 45 Compreendendo o Conta-gotas e o Apagador .......................... 45 Exercícios: .......................................................................... 49 Exercícios de Fixação: ........................................................... 50 Aula 7 – Utilizando a importação de Imagens ...................... 51 Compreendendo a Importação de Imagens ............................. 51 Exercícios: .......................................................................... 57 Exercícios de Fixação: ........................................................... 58 Aula 8 – Trabalhando com Símbolos no Flash CS6 ............... 59 Estudando a os símbolos no Flash CS6 .................................... 59 Exercícios: .......................................................................... 61 Exercícios de Fixação: ........................................................... 62 Aula 9 – Trabalhando com Camadas e Linha do Tempo ........ 63 Compreendendo as Camadas e Linhas de Tempo ..................... 63 Opções de visualização e travamento .........................Quando estamos trabalhando com uma camada, um ícone de Lápis é exibido para indicar que aquela camada está sendo editada: ................ 63 Camada de máscara ............................................................. 65 Exercícios: .......................................................................... 66 Exercício de Fixação: ............................................................ 68 Aula 10 – Criando animações no Flash ................................. 69 Criar animações quadro a quadro ........................................... 69 Linhas de tempo e animação ................................................. 69 Usar sequência em papel transparente ................................... 71 Visualize simultaneamente vários quadros de uma animação no Palco .................................................................................. 71 Controlar exibição de papel transparente ................................ 71 Alterar a exibição dos marcadores de transparência ................. 72 Exercícios: .......................................................................... 73 Exercício de Fixação: ............................................................ 74 Aula 11 – Utilizando Interpolação de Movimento ................. 75 Compreendendo as Interpolações de Movimento ...................... 75 4 Exercícios: .......................................................................... 81 Exercício de Fixação: ............................................................ 82 Aula 12 - Utilizando Interpolação de Forma ......................... 83 Interpolação de formas ......................................................... 83 Controlar alterações de forma com as referências correspondentes ......................................................................................... 85 Exercícios: .......................................................................... 88 Exercício de Fixação: ............................................................ 89 Aula 13 – Trabalhando com Ferramenta Rotação 3D ............ 90 Compreendendo a Ferramenta Rotação ................................... 90 Sobre os gráficos 3D no Flash ................................................ 90 Movimentação de uma seleção de múltiplos objetos em um espaço 3D ..................................................................................... 92 Girar objetos no espaço 3D ................................................... 93 Exercícios: .......................................................................... 95 Exercício de Fixação: ............................................................ 96 Aula 14 – Trabalhando com ferramenta Rotação Bone ......... 97 Sobre a cinemática inversa .................................................... 97 Editar armaduras IK e objetos ............................................. 100 Exercícios: ........................................................................ 101 Aula 15 – Trabalhando com Clipe de Filme ......................... 110 Compreendendo o funcionamento de Clipes de Filme no Flash CS6 ....................................................................................... 110 Registro de clipe de filme .................................................... 111 Trabalho com bibliotecas ..................................................... 111 Trabalho com pastas no painel Biblioteca .............................. 112 Criar uma nova pasta ......................................................... 112 Abrir ou fechar uma pasta ................................................... 112 Abrir ou fechar todas as pastas ............................................ 113 Mover um item entre as pastas ............................................ 113 Exercícios: ........................................................................ 114 Exercício de Fixação: ..........................................................126 5 Aula 16 – Utilizando botões no Flash CS6 .......................... 127 Compreendendo o funcionamento de Botões no Flash CS6 ...... 127 Criação de um símbolo de botão: ......................................... 129 Testar um botão ................................................................ 130 Exercícios: ........................................................................ 131 Exercício de Fixação: .......................................................... 132 Aula 17 – Criando ações interativas ................................... 133 O que são ações? ............................................................... 133 Painel Ações ...................................................................... 133 Ação de play e StopPlay e Stop são dois botões muito usados para controlar movimento. ......................................................... 134 gotoAndPlay e gotoAndStop ................................................ 135 Exercícios: ........................................................................ 136 Exercício de Fixação: .......................................................... 159 Aula 18 – Arquivos de Audio e de Video no flash CS6......... 160 Como utilizar sons e vídeos no Flash CS6? ............................ 160 Formatos de arquivo de som suportados ............................... 162 Vídeo no Flash ................................................................... 162 Fluxo de vídeo com o Adobe Flash Media Server: ................... 163 Download progressivo de vídeo a partir de um servidor Web ... 163 Incorporar vídeo em um documento do Flash ........................ 163 Formatos de vídeo e Flash ................................................... 164 Exercícios: ........................................................................ 165 Exercício de Fixação: .......................................................... 166 6 Aula 1 – Introdução ao Adobe Flash CS6 Definição Principal do Flash CS6 Crie e manipule documentos e arquivos usando vários elementos, como painéis, barras e janelas. Qualquer organização desses elementos é denominada área de trabalho. As áreas de trabalho dos diferentes aplicativos no Adobe Creative Suite 5 compartilham a mesma aparência para que você possa alternar entre aplicativos facilmente. Para adaptar cada aplicativo ao seu modo de trabalho, selecione uma das vários espaços de trabalho predefinidos ou crie seu próprio. Embora o layout do espaço de trabalho padrão varie em produtos diferentes, você manipula os elementos da mesma maneira em todas. O painel Ferramentas contém ferramentas para a criação e a edição de imagens, arte-final, elementos de página e assim por diante. As ferramentas relacionadas são agrupadas. • O Painel de controle exibe as opções para a ferramenta atualmente selecionada. No Adobe Flash é chamado de Inspetor de Propriedades, e inclui as propriedades do elemento atualmente selecionado. 7 • A janela Documento exibe o arquivo em que você está trabalhando. Janelas de documento podem ser tabuladas e, em certos casos, agrupadas e encaixadas. • Os Painéis ajudam a monitorar e modificar seu trabalho. Um exemplo é a Linha de tempo no Flash. OBS: Os painéis podem ser agrupados, empilhados ou encaixados. As Ferramentas do Flash CS6 A ferramenta selecionar ,assim como seu nome já diz, é utilizada para selecionar um objeto. A ferramenta Subseleção , ela tem uma grande utilidade para modificar formas. Para selecioná-la, podemos dar um clique sobre ela ou pressionar a tecla A do teclado. Note que aparecem vários pontos de ancoragem. Estes pontos servem para modificar formas do objeto. Veja no exemplo. Esta é a ferramenta Transformação livre , podemos adicioná-la clicando em sou botão ou pressionando a tecla Q do teclado. A ferramenta transformação livre tem várias funções. Você pode aumentar ou diminuir um objeto, girá-lo ou até mesmo deformá-lo. Esta ferramenta tem opção a mais do que as duas primeiras que vimos, note que tem um pequeno triângulo na parte inferior direta dela. Tanto no adobe Flash como em outros programas, quando uma ferramenta tem este triângulo significa que existe uma variação da 8 ferramenta que, neste caso, é a ferramenta de Transformação gradiente. Com a ferramenta de Transformação gradiente selecionada, você pode transformar os efeitos de um objeto que estejam preenchidos com gradiente, ou seja, duas ou mais cores no mesmo objeto, veremos mais a frente como usá-las. A ferramenta Laço – pode ser clicada ou adicionada teclado a tecla L do teclado. A ferramenta laço tem em sua principal função selecionar um objeto de uma forma livre, ou seja, você pode selecionar qualquer parte de um objeto. Veja o exemplo. A ferramenta Caneta é usada para desenhos mais sofisticados, porque você pode criar vários pontos de ancoragem diretamente na criação do Objeto. A ferramenta Texto é utilizada para criação de textos no flash. Existem 3 tipos de texto no Adobe Flash CS6. Texto estático, texto de entrada e texto dinâmico. A ferramenta Linha, como seu próprio nome já diz, é utilizada para criar linha retas. Para utilizá-la, você deve clicar em qualquer ponto do palco e arrastar. 9 Lembre-se que ela faz linha retas, ou seja, em qualquer desenho que tenha retas iniciais você pode utilizá-la, e se precisar fazer esta reta obter um ângulo curvado, você pode usar a ferramenta selecionar. A ferramenta de formas geométricas é utilizada para criar desenhos de forma retangular ou oval. Na aula de edição de desenho, vamos utilizá-las frequentemente. Como as demais, para criar um desenho precisamos selecionar a ferramenta, clicar no palco e arrastá-la. OBS: Para fazer um círculo perfeito ou um quadrado perfeito, você precisa manter a tecla SHIFT pressionada durante a criação. A ferramenta Lápis é utilizada para desenhos a mão livre. A ferramenta Pincel foi feita para criarmos desenhos de formas e tamanhos diferentes. Veja como ele funciona. A ferramenta Balde de tinta , que temos em diversos softwares e a principal função é preencher um objeto com as cores que gostaríamos de utilizar. OBS: Podemos pintar com uma cor sólida ou até mesmo preencher com uma cor gradiente. A ferramenta Conta-gotas é utilizadas para descobrimos as cores de uma figura, foto ou objetos. A ferramenta Borracha é utilizada para apagar uma parte do objeto. A ferramenta Mão é utilizada apenas para movimentar o palco para melhor movimentação. A ferramenta Zoom é utilizada para aproximar ou afastar a visualização do palco ou objeto. 10 Linha do Tempo Todas as animações, desde o começo dos desenhos animados às animações mais modernas, são criadas de acordo com os frames. A. Indicador de reprodução. B. Quadro-chave vazio. C. Cabeçalho da Linha do tempo. D. Ícone da camada de guia. E. Menu pop-up Exibição de quadros. F. Animação quadro a quadro. G. Animação interpolada. H. Botão Rolar até o indicador de reprodução. I. Botões de papel de Transparência. J. Indicador de quadro atual. K. Indicador de taxa de quadros. L. Indicador de tempo decorrido. A Linha do tempo mostra onde a animação ocorre em um documento, incluindo a animação quadro a quadro, a animação interpolada e os caminhos de movimento. Os controles na seção de camadas da Linha do tempo permitem ocultar, mostrar, bloquear ou desbloquear camadas, bem como exibir o conteúdo das camadas como contornos. É possível arrastar quadros para um novo local na mesma camada, ou para uma camada diferente. • Para mover a Linha do tempo quando ela estiver encaixada na janela do documento, arraste a aba da barra de título no canto superioresquerdo da Linha do tempo. • Para encaixar uma Linha do tempo desencaixada na janela do aplicativo, arraste a aba da barra de título para a parte superior ou inferior da janela do documento. 11 • Para encaixar uma Linha do tempo desencaixada em outros painéis, arraste a aba da barra de título da Linha do tempo até o local escolhido. Para impedir que a Linha do tempo seja encaixada em outros painéis, pressione a tecla Ctrl enquanto arrasta. Uma barra azul é exibida para indicar o local em que a Linha do tempo será encaixada. • Para estender ou encurtar campos de nome de camada no painel Linha do tempo, arraste a barra que separa os nomes de camada e as partes dos quadros da Linha do tempo. Vamos conhecer nossa área de trabalho. A. Janelas de Documento tabuladas. B. Barra de aplicativos. C. Alternador da área de trabalho. D. Barra de título do painel. E. Painel de controle. F. Painel Ferramentas. G. Botão Recolher em Ícones. H. Quatro grupos de painel no encaixe vertical. 12 Exercícios: 1. Qual ferramenta que tem uma grande utilidade para modificar formas? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 2. Quais tipos de textos existem no Adobe Flash CS6? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 3. Para que serve a Linha de tempo? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 4. Quais são as ferramentas de forma geométrica que existem no Flash CS6? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 5. Quais são as funções da ferramenta Transformação Livre? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 13 Exercícios de Fixação: Crie um novo arquivo de Flash utilizando Action Script 2 e observe no arquivo sua linha de tempo e todas as ferramentas disponíveis no Flash CS6. 14 Aula 2 – Configuração de Palcos Palcos e Filmes no Flash CS6 O flash trabalha com dois tipos de arquivo. Os FLA que são os arquivos de desenvolvimento e os SWF que são os arquivos para apresentação dos projetos. Documentos com extensão FLA são arquivos de trabalho que podem ser editados em aplicativos Flash, já os arquivos SWF são animações geradas a partir de arquivos FLA. Os arquivos SWF são publicados na web, enquanto os FLA ficam com os desenvolvedores. Para criar um arquivo novo no flash, usamos o menu Arquivo e clicamos na opção Novo. - Na janela Novo Documento, a aba geral permite criar um arquivo em branco. 15 A aba modelos apresenta diversos modelos prontos, em categorias como anúncios publicitários, slideshows e testes. Quando criamos um documento, o palco é preenchido com uma área em branco, chama cena. Nela é feita a parte visual do documento. Para ajustar as propriedades do novo arquivo, clicamos na aba propriedades. 16 Após clicar em Editar abrirá uma janela onde você poderá alterar algumas configurações como o cor de plano de fundo e a taxa de quadros por segundo. OBS: É possível desenhar objetos fora da área de animação, mas eles não aparecer no arquivo final (SWF). Temos também o botão Editar da aba Perfil. Clicando sobre ele abrirá a janela de configuração de publicação. - Na aba Formato, assinalamos os formatos de exportação do arquivo. Além do SWF, nativo do flash, podemos escolher GIF, JPEG e EXE, entre outros. 17 - Na aba Flash, escolhemos para qual versão do Flash Player o filme será exportado. Também ajustamos a ordem de exibição das camadas e a versão do ActionScript. Outra opção importante da aba Flash é a Proteger contra importação. Ela impede que o arquivo SWF seja importado e convertido num arquivo de trabalho (extensão FLA). Marcando esta opção, você evita que outros usuários tenham acesso ao seu trabalho. Ainda na aba Flash, é possível regular a qualidade das imagens e dos arquivos MP3 para reduzir o tamanho do arquivo. A aba HTML contém mais ajustes de publicação do Flash. Uma das mais importantes é a que permite detectar a versão do Flash usada pelo internauta. Há também ajustes de dimensão, qualidade e alinhamento. 18 Quando as réguas são mostradas, elas aparecem ao longo das laterais superior e esquerda do documento. É possível alterar a unidade de medida utilizada nas réguas do padrão de pixels para outra unidade. Quando um elemento é movido no Palco com as réguas exibidas, as linhas que indicam as dimensões do elemento são exibidas nas réguas. • Para mostrar ou ocultar as réguas, escolha Exibir > Réguas. • Para especificar a unidade de medida das réguas para um documento, selecione Modificar > Documento, e selecione uma unidade no menu Unidades da régua. Uso da grade A grade é exibida em um documento como um conjunto de linhas atrás da arte-final em todas as cenas.Para mostrar ou ocultar uma grade de desenho, basta ir no menu Exibir> Grade>Mostrar grade, ou pressione Ctrl+’ (aspas simples). Outros tipos de arquivos Flash Os arquivos AS são arquivos do ActionScript. Você pode usá-los para manter alguns ou todos os códigos do ActionScript fora de seus arquivos FLA, o que é útil para a organização de códigos e para os projetos nos quais há várias pessoas trabalhando em diferentes partes do conteúdo do Flash. • Os arquivos SWC contêm os componentes do Flash reutilizáveis. Cada arquivo SWC contém um clipe de filme compilado, o código do ActionScript e quaisquer outros recursos que o componente exija. 19 • Os arquivos ASC são arquivos usados para armazenar o ActionScript que será executado em um computador que executa o Flash Media Server. Esses arquivos fornecem a capacidade de implementar a lógica do servidor que funciona em conjunto com o ActionScript em um arquivo SWF. • Os arquivos JSFL são arquivos JavaScript que podem ser usados para adicionar nova funcionalidade à ferramenta de autoria do Flash . Salvar documentos Flash É possível salvar um documento FLA Flash usando seu nome e local atuais ou usando um nome ou local diferente. Quando um documento contiver alterações não salvas, aparecerá um asterisco (*) depois do nome do documento na barra do título do documento, na barra do título do aplicativo e na guia documento. Ao salvar o documento, o asterisco é removido. Salvar um documento Flash no formato FLA padrão 1 Siga um destes procedimentos: • Para sobrescrever a versão atual no disco, selecione Arquivo > Salvar. • Para salvar o documento em um local diferente e/ou com um nome diferente ou para compactar o documento, selecione Arquivo > Salvar como. 2 Se você tiver selecionado Salvar como ou se o documento nunca tiver sido salvo antes, digite o nome e o local do arquivo. 3 Clique em Salvar. Salvarum documento no formato XFL descompactado 1 Escolha Arquivo > Salvar Como. 2 No menu Salvar como tipo, escolha Documento não compactado do Flash CS6 (*xfl). 3 Escolha um nome e um local para o arquivo e clique em Salvar. 20 Salvar um documento como modelo 1 Selecione Arquivo > Salvar como modelo. 2 Na caixa de diálogo Salvar como modelo, digite um nome para o modelo na caixa Nome. 3 Selecione uma categoria no menu pop-up Categoria ou digite um nome para criar uma nova categoria. 4 Digite uma descrição do modelo na caixa Descrição (até 255 caracteres) e clique em OK.A descrição aparecerá quando o modelo for selecionado na caixa de diálogo Novo documento. Salvar documento como documento Flash CS4 1 Selecione Arquivo > Salvar como. 2 Digite o nome e o local do arquivo. 3 Selecione o documento Flash CS4 no menu pop-up Formato e clique em Salvar. Salvar documentos ao sair do Flash 1 Selecione Arquivo > Sair. 2 Se você tiver documentos abertos com alterações não salvas, o Flash envia um aviso para salvar ou descartar as alterações para cada documento. • Clique em Sim para salvar as alterações e fechar o documento. • Clique em Não para fechar o documento sem salvar as alterações. 21 Exercícios: 1. Utilizamos qual caminho para especificar a unidade de medida das réguas para um documento? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. O que são arquivos JSFL? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. O que são arquivos SWF? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 4. Qual a função da opção Proteger contra importação? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 22 Exercícios de Fixação: Crie um novo arquivo de Flash utilizando Action Script 2 e ative suas réguas. Logo após isso, salve seu arquivo com o nome de aula 2 e teste seu filme. 23 Aula 3 – Trabalhando com Ferramentas de Desenho Compreendendo as Ferramentas de Desenho As ferramentas de desenho no Adobe® Flash® Professional CS6 permitem criar e modificar linhas e formas para a arte em seus documentos. Todas as linhas e formas que você criar no Flash são gráficos vetoriais leves, que ajudam a manter reduzido o tamanho do seu arquivo FLA. Antes de desenhar e pintar no Flash, é importante entender como o Flash cria arte, e como o desenho, a pintura e a modificação de formas podem afetar outras formas da mesma camada. Ao usar qualquer ferramenta de desenho, temos que escolher as cores de borda (identificada pelo lápis ) e de preenchimento (identificado pelo balde ) do objeto. 24 OBS: No Flash a borda e o preenchimento são tratados diferentemente. As cores de cada ferramenta podem ser selecionadas em três áreas: Opção da ferramenta, Caixa de propriedades e painel de cores. Nas duas primeiras, o usuário tem apenas a paleta de cores seguras para web. 25 Já o painel cor, apresenta a paleta completa do modo RGB, o único suportado pelo Flash. As cores podem ser escolhidas por meio de valores numéricos (RGB ou hexadecimais). A opção Alpha régua a transparência da cor. Se quiser um objeto sem cor de borda ou preenchimento, o usuário deve marcar o ícone do quadrado riscado . - A ferramenta linha é usada para traçar retas. Podemos mudar cor, espessura e até o tipo de traçado. - Note na imagem abaixo como fica a linha quando aplicamos o traçado Irregular. 26 Outra ferramenta fácil de tracejar retas ou curvas é a ferramenta Caneta . Nela podemos tanto criar retas como aplicar curvas nas retas criadas. O Flash tem um recurso que podemos acrescentar pontos de ancoragem, apagar alguns e puxar outros para transformá-los em curvas. As ferramentas Oval e Retângulo permitem criar essas formas geométricas básicas e aplicar traçados, preenchimentos e especificar cantos arredondados. Além do modo Desenho de objeto e Mesclar desenho, as ferramentas Oval e Retângulo também apresentam o modo de desenho Primitiva de objeto. Quando você cria retângulos ou formas ovais usando as ferramentas Primitiva de retângulo ou Primitiva de oval, o Flash desenha as formas como objetos separados da mesma maneira que as formas que você cria quando usa o modo Desenho de objeto. As ferramentas de forma primitiva permitem especificar o raio do canto de retângulos, o ângulo inicial, final e o raio interno de ovais usando os controles do Inspetor de propriedades. Após criar a forma primitiva, altere o raio e as dimensões com a seleção da forma no Palco e o ajuste dos controles no Inspetor de propriedades. Para colocarmos cantos ovais em um retângulo siga os seguintes passos abaixo. - Primeiramente criamos o retângulo na cena. 27 - Feito isto acesse a aba propriedades. - Após acessar o menu propriedades, basta ajustar o raio do retângulo destacado na imagem ao lado. - Ao adicionarmos 15 no raio, note como fica nosso retângulo. Desenhar com a ferramenta Lápis Para desenhar linhas e formas, use a ferramenta Lápis quase da mesma maneira em que usa um lápis de verdade para desenhar. Para aplicar suavização ou correção às linhas e formas enquanto desenha, selecione um modo desenho para a ferramenta Lápis. 1- Selecione a ferramenta Lápis . 28 2- Selecione Janela > Propriedades e selecione a cor do traçado, o peso da linha e o estilo. 3- Selecione um modo desenho em Opções no painel Ferramentas: • Para desenhar linhas retas e converter aproximações de triângulos, ovais, círculos, retângulos e quadrados nessas formas geométricas comuns, selecione Correção . • Para desenhar linhas curvas suaves, selecione Suavização . • Para desenhar linhas à mão livre sem aplicar modificações, selecione Tinta . 4- Para desenhar com a ferramenta Lápis, arraste com a tecla Shift pressionada para restringir as linhas nas direções vertical ou horizontal, clique em Palco e arraste. Pinte com a ferramenta Pincel A ferramenta Pincel desenha traçados semelhantes a pinceladas. Ela cria efeitos especiais, inclusive caligráficos. Selecione a forma e o tamanho do pincel usando modificadores da ferramenta Pincel. 29 Pintar normal: Pinta sobre linhas e preenchimentos na mesma camada. Pintar preenchimentos: Pinta preenchimentos e áreas vazias, sem mudar as linhas. Pintar atrás: Pinta nas áreas em branco do Palco, na mesma camada, não modificando as linhas e os preenchimentos. Pintar seleção: Aplica novo preenchimento à seleção, se for selecionado um preenchimento no controle Cor do preenchimento ou na caixa Preenchimento do inspetor de Propriedades, do mesmo modo que selecionar a área preenchida e aplicar novo preenchimento. Pintar dentro: Pinta o preenchimento no qual é iniciado o traçado com pincel enunca pinta linhas. Se começar a pintar numa área vazia, o preenchimento não modifica as áreas preenchidas existentes. Ferramenta Seleção Ela você poderá selecionar todos os objetos que você for adicionando em suas animações, e também será útil na hora de fazer modificações nas linhas dos desenhos. 30 Ferramenta de Subseleção Esta ferramenta serve para modificar os pontos e curvas das linhas de contorno. Ao clicar com ele sobre uma linha, ela ficará verde com os pontos em evidência. Assim você será capaz de editar ponto a ponto o seu desenho. 31 Exercícios: 1.Quais são os tipos de traçado da ferramenta linha? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 2. Para que serve a ferramenta pincel? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 3. Para que serve a ferramenta subseleção? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 4. Em quantas áreas podem ser selecionadas as cores de cada ferramenta? ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ ______________________________________________________ 32 Exercícios de Fixação: Crie um novo arquivo de Flash utilizando ActionScript 2.0 e logo em seguida crie um retângulo, uma estrela e um círculo no interior do palco. Salve seu arquivo com o nome de aula 3 e teste seu filme. 33 Aula 4 – Compreendendo o funcionamento de Gradientes e Pinturas Degradês e Pinturas Com os recursos que o Flash oferece podemos, além de utilizar cores sólidas para preencher objetos, aplicar efeitos de degradê, chamados de gradiente. Os degradês são criados no painel Color, com efeitos lineares e radiais. Efeitos lineares criam gradientes com formas de retas. Os efeitos radiais são usados para criar gradientes com padrão circular. Estes efeitos ficam ativos quando a opção Solido está na caixa de seleção. Clicando no menu drop down de Tipo e selecionando a opção linear, surgirá uma barra horizontal com dois marcadores um preto e um branco. Cada marcador representa uma cor que fará parte do degradê e, para inserir outras cores, basta clicar no marcador e escolher a tonalidade. 34 Para aumentar ou diminuir a presença de uma cor dentro do degradê é preciso selecionar o marcador correspondente e arrastar ao longo da barra de cores. Após chegarmos ao preenchimento desejado, devemos selecionar a ferramenta Balde para pintar o preenchimento. Com o Flash você pode criar degradê com até quinze cores, que podem ser editadas dentro do efeito através da ferramenta Transformação de Gradiente . Um gradiente radial tem os mesmos fundamentos dos lineares, a diferença é que as cores são organizadas num padrão circular. Para trabalhar com cores sólidas e gradientes o Flash usa duas ferramentas de pintura: Balde e Tinteiro. O tinteiro é usado para colorir as bordas dos desenhos e é empregada da mesma forma que o balde, mas para colorir outra região. 35 Ferramenta Tinteiro Utilize-a para pintar o contorno de um objeto. Basta escolher a cor na paleta Core se pintar o objeto desejado. 1. Selecione a ferramenta Tinteiro 2. Na paleta Cores, clique sobre o botão Cor do traço e escolha a cor desejada. 3. Clique sobre o contorno do objeto ou linha que quer pintar. Ferramenta Balde de Tinta Utilize-a para pintar o preenchimento de um objeto. Basta escolher a cor na paleta Cores e pintar o objeto desejado. - Primeiramente selecione a ferramenta Balde de Tinta. - Na paleta Cores, clique sobre o botão Cor do Preenchimento e escolha a cor desejada. 36 -Após isto, clique sobre o preenchimento do objeto que quer pintar. Transformação de gradiente A ferramenta Transformação de gradiente permite que você dimensione, gire ou incline uma imagem e seu preenchimento de bitmap. O ponto central permite deslocar o gradiente para os lados, o quadrado lateral estica e espreme o degradê e o círculo gira o gradiente. Quando a ferramenta é ativada e se clica na imagem, aparecem três pontos, através dos quais se edita o efeito. 37 Exercícios: 1. Para que serve a ferramenta Transformação de gradiente? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. Para que serve a ferramenta Balde de Tinta? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. Para que serve a Opção Gradiente Radial? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 4. Qual a diferença entre a opção gradiente Linear e gradiente Radial? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 5. Para que serve a ferramenta Tinteiro? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 38 Exercícios de fixação: Crie um novo arquivo de Flash utilizando ActionScript 2.0 e logo em seguida crie um retângulo com preenchimento degradê de vermelho à azul. Salve o arquivo como Aula 4. 39 Aula 5 – Trabalhando com Grupos no Flash CS6 Compreendendo os grupos no Flash CS6 No Flash, quando sobrepomos um objeto ele perde a característica de individual e os objetos se unem. Essa é uma particularidade do Flash, o que dificulta seu uso por iniciantes que estão acostumados com outros programas de desenho vetorial. Quando dois objetos se unem e depois são separados, estão sujeitos a sofrerem danos, como perda de parte da imagem. Para que isso não ocorra e você possa unir imagens com segurança, devem ser usados os grupos. Para criar um grupo selecione os objetos a serem unidos e use o atalho Ctrl+G. Um grupo se comporta como uma camada, permitindo o empilhamento e a organização dos elementos. Clicando no menu Modificar e em Agrupar você também pode criar grupos. Acima do palco surge um ícone com a palavra Agrupar ao lado, o que indica que estamos no modo de edição do grupo criado. 40 Quando clicamoscom a ferramenta Seleção selecionada em qualquer um dos elementos do grupo, surge um contorno em verde, indicando a existência de um grupo. Com o grupo formado podemos sobrepor os objetos e separá- los sem sofrer perdas. Aprender a formar grupos corretamente é fundamental para ter bons resultados no Flash. Para editar um grupo, basta dar um duplo clique sobre ele e as cores dos objetos são clareadas. Isso facilita a identificação do modo de edição. Podemos editar somente a parte desejada e clicar no botão Cena 1 para voltar a tela principal. Os grupos também são usados para definir a ordem de empilhamento dos objetos. Para organizar esse empilhamento vamos até o menu Modificar e clicamos em Organizar. A partir desse menu, podemos alterar a ordem dos objetos sobrepondo uns aos outros. - Primeiramente criamos dou objetos um em cada grupo. Note que o quadrado esta sobre o objeto oval. Para colocar o objeto oval sobre o quadrado basta Seguir os seguintes passos. 41 - Primeiramente selecione o objeto oval. -Feito isto vá no menu Modificar > Organizar e clique em Trazer para a frente. Agora vamos ver como editarmos um objeto que esta agrupado junto a outros. - Primeiramente crie dois objetos na cena. - Agora selecione os dois objetos, vá no menu Modificar, clique em Agrupar para agrupar os dois objetos. 42 - Para editarmos um dos objetos, basta dar dois cliques sobre o grupo, para entrar dentro do grupo e poder editar cada um dos objetos. - Agora para voltar para a cena principal basta clicar na opção Cena1 que fica no topo do palco. 43 Exercícios: 1. Qual o caminho para a criação de grupos? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. Qual a tecla de atalho para agrupar objetos? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. Como podemos colocar um objeto a frente do outro? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 44 Exercícios de Fixação: Crie um arquivo no Flash CS6 com as dimensões 550px x 400px. No interior de seu palco, crie um retângulo, uma estrela e um círculo. Logo após isso salve seu arquivo com o nome de aula 5. 45 Aula 6 – Entendendo parte da Barra de Ferramentas Compreendendo o Conta-gotas e o Apagador Para inserirmos um texto no Flash basta clicar na Ferramenta Texto e em seguida criar uma caixa de texto, selecionando com o mouse, no palco. Após fazer a seleção e soltar o botão do mouse, basta digitar o texto. 46 Note o círculo vermelho na imagem abaixo, este serve para limitar ou ampliar a largura da caixa de texto, basta clicar e arrastar até que obtenha o tamanho desejado. Agora que já sabemos inserir um texto, vejamos as propriedades desta opção. No painel de propriedades é possível ajustar fonte, tamanho, cor alinhamento, entre outras alterações que podem ser feitas no texto. 47 Na opção indicada abaixo é possível indicar o tipo de texto, que pode ser classificado da seguinte forma: Vejamos agora como utilizar a Ferramenta Conta-gotas. Esta serve para copiar o preenchimento de um objeto e aplicá-lo a outro. Basta clicar na ferramenta, em seguida clicar sobre o objeto que deseja copiar a cor e aplicar no objeto que deseja colorir. 48 Uma forma de apagarmos um objeto por inteiro ou apenas parte dele é utilizando a Ferramenta Apagador. Ferramenta Torneira 49 Exercícios: 1. Como inserimos texto no Flash? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. Em que tópico do painel de propriedades é possível inserir links? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. Para que serve o tipo de texto editável? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 4. Para que serve a ferramenta conta-gotas? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 5. Como utilizamos a ferramenta torneira? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 50 Exercícios de Fixação: Crie um arquivo de Flash CS6 nas dimensões de 550 x 400 px. Com a ferramenta Texto ativada, escreva em seu interior Google. Agora selecione todo o texto e ative as propriedades da ferramenta, ative o menu dropdown Opções e coloque o link www.google.com.br, depois disso salve seu arquivo com o nome de Aula 6 e teste seu filme. http://www.google.com.br/ 51 Aula 7 – Utilizando a importação de Imagens Compreendendo a Importação de Imagens Em muitos casos é melhor usar gráficos já prontos do que desenhar no flash. Nestas situações, a saída é usar o recurso de importação de imagens. O flash pode importar imagens vetoriais criadas no Illustrator ou no Freehand. Ou gráficos bitmap, como GIF e JPEG, entre outros formatos. Para importar uma imagem para o Flash, basta acionar o menu Arquivo, posicionamos o cursor em Importar e clicamos em Importar para o palco. Ao importar um bitmap para o Flash, é possível modificar esse bitmap e usá-lo em seu documento Flash de várias maneiras. Se um documento Flash exibe um bitmap importado com um tamanho maior do que o original, a imagem pode ficar distorcida. Para ter certeza de que as imagens serão exibidas adequadamente, visualize os bitmaps importados. Ao selecionar um bitmap no Palco, o Inspetor de propriedades exibe o nome do símbolo do bitmap e suas dimensões em pixel e sua posição no Palco. Usando o Inspetor de propriedades, você pode alternar uma ocorrência de um bitmap, ou seja, substituir a ocorrência por uma ocorrência de outro bitmap no documento atual. Vamos ver agora como importar uma imagem para o palco do Flash CS6. 52 - Primeiramente acesse o menu Arquivo vá em Importar e clique em Importar para o palco ou use as teclas de atalho Ctrl+R. - Feito isto basta clicar na imagem desejada e clicar em Abrir. Note que ao clicar em abrir a imagem já é adicionada diretamenteao palco. Isto acontece pois imagens no formato BMP, como usado no exemplo, aparecem direto no palco. Já arquivos do Photoshop e do Fireworks, aplicativos gráficos da Adobe, podem ser customizados na importação. 53 Depois de importadas, as imagens do tipo bitmap podem ser convertidas para vetores. Este processo reparte a imagem em objetos vetoriais, que podem ser editados separadamente. A conversão é feita por meio do menu Modificar, posicionando o cursor em Bitmap e clicando em Traçar Bitmap. - Feito isto abrirá uma janela para a edição da imagem. A janela de conversão tem quatro ajustes. - O primeiro determina a tolerância do Flash com relação à cor dos pixels, A caixa aceita valores entre 0 e 500. - Quanto menor o valor, mais precisa é a conversão. Em compensação, o arquivo fica maior. - O segundo ajuste define o número de pixels adjacentes incluídos em cada cor convertida pelo Flash. A caixa aceita valores de 1 a 1000. 54 - As duas ultimas opções definem a precisão das linhas arredondadas e dos cantos da imagem. Na maioria dos casos, a configuração padrão dá bons resultados. - Aplicamos o valor 100 para limiar de cor e 20 para a Área mínima. - Veja abaixo como ficou a imagem importada anteriormente. Quando usamos os valores máximos de definição, o objeto vetorial é praticamente uma cópia fiel do arquivo bitmap. Mas o processo de conversão consome muita memória e gera arquivos grandes, por isso, esse recurso só é usado em casos muito específicos. Outro recurso útil no tratamento de bitmaps é o Separar, acionado por meio do menu Modificar e clicando em Separar. 55 Ele quebra a imagem em pixels editáveis que podem ser manipulados pelas ferramentas de pintura do flash. Podemos usar a ferramenta Tinteiro para criar uma borda para o bitmap. Uma possibilidade interessante do Flash é o uso de imagens bitmaps como preenchimento de formas. Para isso, o primeiro passo é quebrar a imagem por meio do separar. - Agora, acionamos a ferramenta conta-gotas e clicamos na imagem. Observação: Uma versão reduzida da imagem aparece no painel cor. 56 Agora que já temos a imagem selecionada como preenchimento, podemos desenhar qualquer forma. Com as ferramentas retângulo ou oval desenhamos no palco e o miolo do objeto será ocupado pela imagem, como demostrado acima. Depois de aplicado, o preenchimento bitmap pode ser editado com auxilio da ferramenta Transformação de Gradiente . Com a imagem selecionada pela ferramenta Transformação Gradiente, ajustamos a imagem dentro do objeto. 57 Exercícios: 1. Qual o caminho utilizado para importar uma imagem para a cena? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. Qual a tecla de atalho para importar um arquivo para o palco? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. Qual o caminho para a utilização do recurso Separar? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 4. Para que serve o modificador Separar? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 58 Exercícios de Fixação: Crie um novo arquivo no Flash com as dimensões de 550 x 400 px. Insira uma imagem no palco e selecione a ferramenta Conta Gotas, logo após isso, clique na imagem. Depois de clicar na imagem, você poderá utilizá-la como preenchimento, sendo assim, selecione a ferramenta retângulo e escolha o preenchimento referente à imagem que você marcou. Agora crie um retângulo, um círculo e uma estrela utilizando o preenchimento da imagem.Logo após isso, salve seu arquivo com o nome de Aula 7 e teste seu filme. 59 Aula 8 – Trabalhando com Símbolos no Flash CS6 Estudando a os símbolos no Flash CS6 Nesta aula falaremos sobre os símbolos no Flash, pois entender a importância destes é fundamental para trabalhar com o programa. Quando um objeto é convertido para símbolo é possível criar várias cópias deste no palco sem que o tamanho do arquivo aumente. As cópias são chamadas de instâncias e podem ser editadas individualmente sem alterar o símbolo. Vejamos como fazer a conversão de um objeto em símbolo: 60 No Flash é possível criar três tipos de símbolos: Se selecionarmos a opção Gráfico, o símbolo aparecerá na Biblioteca com esta identificação. 61 Exercícios: Crie um arquivo de Flash com as dimensões 550 x 400 px, em seu interior, crie um círculo e o transforme em símbolo de botão, coloque seu nome como circulo1 e abra a biblioteca. 62 Exercícios de Fixação: Crie um arquivo de Flash com as dimensões 550 x 400 px, em seu interior, crie uma estrela e a transforme em símbolo de botão, coloque seu nome como estrela1 e abra a biblioteca. Na biblioteca, crie uma cópia do símbolo que você criou e coloque a cópia no palco com outra cor de preenchimento, depois disso modifique as dimensões da cópia. Salve seu arquivo com o nome de Aula 9. 63 Aula 9 – Trabalhando com Camadas e Linha do Tempo Compreendendo as Camadas e Linhas de Tempo Compreendendo Nesta aula você aprenderá sobre as camadas e a Linha do Tempo no Flash. As camadas são fundamentais para a criação de animações no Flash. Elas são exibidas no painel TimeLine (Linha do Tempo). Por padrão, o Flash já abre um novo arquivo com uma camada. Para inserir uma nova camada basta clicar no botão Nova camada , localizado na imagem abaixo. Opções de visualização e travamento Quando estamos trabalhando com uma camada, um ícone de Lápis é exibido para indicar que aquela camada está sendo editada: Temos a opção de ocultar a visualização de uma camada e isso é feito geralmente quando se quer ver o conteúdo das camadas que estão abaixo. Para ocultar a camada basta clicar na opção abaixo do 64 olho e se quiser ocultar todas as camadas de uma só vez basta clicar no olho localizado na figura abaixo. Há casos ainda em que queremos que o conteúdo de uma camada seja travado com o cadeado, ou seja, não possa sofrer modificações. Basta clicar no cadeado indicado abaixo: Desta forma o objeto não será modificada ao menos que a camada seja destravada. Quando se tem várias camadas, fica difícil saber qual o conteúdo de cada uma delas já que está tudo misturado no palco. É justamente por isso que existe a opção de visualização em aramado. O objeto foi exibido em uma determinada cor, facilitando sua distinção do restante dos objetos. Para definir a cor do contorno, dê um duplo clique no local indicado acima para que a janela seja aberta: 65 Agora é só definir a cor do contorno desejada. Perceba ainda que outras opções podem ser modificadas, desde nome até o tipo e altura da camada! Camada de máscara Para criar uma camadade máscara, deve-se inserir uma nova camada acima das outras, clicar sobre ela com o botão direito e selecionar a opção Máscara. Surgirá um ícone indicando que a camada abaixo está mascarada. Podemos usar a mesma máscara para mais de uma camada, para isso clique com o botão direito sobre a camada e escolha a opção Propriedades. Nesta janela encontramos as propriedades da camada, marque a opção Com máscara e clique em OK. Clique no primeiro frame da camada máscara e desenhe uma forma que servirá de máscara. Podemos usar a ferramenta Retângulo, desenhar sobre a figura que queremos cobrir. Em seguida selecione as camadas onde estão os objetos cobertos pela forma, clique com o botão direito e ative a opção Mostrar como máscara. Agora a área abaixo do retângulo é a única que pode ser vista. 66 A Linha de Tempo indica a duração e a velocidade da animação, ela á dividida em frames. Para criar frames clicamos no lugar desejado na linha do tempo e pressionamos a tecla F5 ou acessamos o menu Inserir, posicionamos o cursor em Linha de tempo e clicamos em Quadro. Quadro-chave é um tipo de frame muito importante, indicado por um círculo preto dentro do frame. Para criar um Quadro chave, pressionamos a tecla F6 ou acessamos o menu Inserir > Linha de tempo > Quadro chave. Um Quadro chave é adicionado no ponto onde ocorrerá um evento na animação. Em algumas situações usamos o Quadro chave em branco, que é indicado por um círculo em branco dentro do frame. Inserimos um Quadro chave em branco usando o atalho F7 do teclado ou acessando o menu Inserir > Linha de tempo > Quadro chave em branco. Normalmente, o Quadro chave em branco marca o ponto em que haverá algum evento na animação, mas ainda está vazio. O Playhead (cabeçote de reprodução) é outro componente da Linha do Tempo. Movimentando com o mouse o Playhead ao longo da Linha do Tempo, podemos acompanhar a evolução da animação. Exercícios: 67 1. O que é o Quadro chave? ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ 2. O que significa o lápis na camada? ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ 3. Para que serve o cadeado na aba camadas? ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ 4. Para que serve a opção mostrar como máscara? ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ 5. Como acessamos as propriedades da camada? ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ 68 Exercício de Fixação: Crie um arquivo de Flash com as dimensões de 550 x 400 px. Dentro palco, crie três camadas, a primeira com o nome de Imagem 1, a segunda com o nome de Imagem 2 e a terceira com o nome de Máscara. Insira uma imagem na camada Imagem 1 e outra na camada Imagem 2. Agora transforme a camada Máscara em uma máscara. Vá até as propriedades das camadas Imagem 1 e Imagem 2 se certifique de que a opção Com Máscara está marcada. Crie um retângulo de qualquer cor na camada Imagem 1 e clique com o botão direito sobre a camada e selecione a opção Mostrar Camada. Salve seu arquivo com o nome de Aula 9. 69 Aula 10 – Criando animações no Flash Criar animações quadro a quadro A animação quadro a quadro altera o conteúdo do Palco em todos os quadros, e é indicada para animações complexas, em que uma imagem é alterada em todos os quadros, em vez de simplesmente se movimentar pelo Palco. Esse tipo de animação aumenta mais o tamanho do arquivo do que a animação interpolada, porque o Flash armazena os valores de cada quadro completo. Linhas de tempo e animação Para criar uma animação quadro a quadro, defina todos os quadros como principais e crie uma imagem diferente para cada um deles. Cada quadro-chave novo contém, inicialmente, o mesmo conteúdo que o quadro-chave que o preceder, assim você pode modificar os quadros na animação aceleradamente. 1. Clique no nome de uma camada para torná-la a camada ativa e selecione um quadro na camada em que a animação deve iniciar. 2. Crie a arte para o primeiro quadro da sequência. Use as ferramentas de desenho, cole o gráfico da Área de transferência ou importe um arquivo. 70 3. Para adicionar um novo quadro-chave cujo conteúdo seja igual àquele do primeiro quadro, clique no próximo quadro à direita na mesma linha e selecione Inserir > Linha do tempo > Quadro-chave. 4. Para desenvolver o próximo incremento da animação, altere o conteúdo deste quadro no Palco. 5. Para completar sua sequência de animação quadro a quadro, repita as etapas 4 e 5 até montar o movimento desejado. Para testar a sequência de animação, selecione Controlar > Reproduzir ou clique no botão Reproduzir, no Controlador (Janela > Barras de ferramentas > Controlador). 71 Usar sequência em papel transparente Geralmente, só um quadro da sequência de imagem aparece no Palco. Para ajudar a posicionar e editar uma animação quadro a quadro, visualize dois ou mais quadros no Palco de uma só vez. O quadro na posição de reprodução aparece totalmente colorido, ao passo que os quadros vizinhos ficam mais claros, como se cada quadro fosse desenhado em uma folha de papel transparente, com as folhas presas umas às outras pela parte superior. Não é possível editar esses quadros mais claros. Visualize simultaneamente vários quadros de uma animação no Palco Clique no botão Papel transparente . Todos os quadros entre os marcadores Iniciar e Terminar papel transparente (no cabeçalho da Linha de tempo ) ficarão superpostos, como um único quadro na janela do documento. Controlar exibição de papel transparente • Para exibir os quadros de papel transparente como contornos, clique no botão Contornos de papel transparente . • Para alterar a posição do marcador de transparência, arraste o ponteiro para um novo local. 72 • Para ativar a edição de todos os quadros entre os marcadores de transparência, clique no botão Editar múltiplos quadros . Geralmente, as sequências em papel transparente permitem editar apenas o quadro atual. No entanto, você pode exibir o conteúdo de cada quadro entre os marcadores de transparência, e disponibilizar cada um deles para edição, independentemente de qual seja o quadro atual. Alterar a exibição dos marcadores de transparência -Clique no botão Modificar marcadores de transparência e selecione um dos seguintes itens: Sempre mostrar marcadores: Exibe os marcadores de transparência no cabeçalho da Linha de tempo, estando a opção de papel transparente ativada ou não. Ancorar transparência: Bloqueia os marcadores de transparência na posição atual no cabeçalho de Linha de tempo. Em geral, o intervalo de transparência se refere ao ponteiro atual do quadro e aos marcadores de transparência. A ancoragem dos marcadores impedeque eles se movam do ponteiro atual do quadro. Transparência 2: Exibe dois quadros em cada lado do quadro atual. Transparência 5: Exibe cinco quadros em cada lado do quadro atual. Transparência para todos: Exibe todos os quadros em cada lado do quadro atual. 73 Exercícios: 1. Para que serve o botão Papel Transparente? ________________________________________________________ ________________________________________________________ ________________________________________________________ ________________________________________________________ 2. Para que serve o botão Editar múltiplos quadros? ________________________________________________________ ________________________________________________________ ________________________________________________________ ________________________________________________________ 3. Para que serve a ferramenta Contornos de papel transparente? ________________________________________________________ ________________________________________________________ ________________________________________________________ ________________________________________________________ 4. Quais são as opções do botão Modificar marcadores de transparência? ________________________________________________________ ________________________________________________________ ________________________________________________________ ________________________________________________________ 74 Exercício de Fixação: Crie um arquivo de Flash com as dimensões de 550 x 400 px. Dentro palco, crie um círculo e selecione-o, clique no menu Modificar, clique em Converter em símbolo..., converta o círculo em Clipe de Filme, e coloque seu nome como animação e clique em OK. Selecione o frame 10 e clique em Inserir > Linha do Tempo > Quadro Chave. Modifique as dimensões de seu círculo nesse ultimo frame da forma que quiser, mas não o deixe da mesma forma que foi criado. Agora clique com o botão direito no frame 5 e selecione a opção Criar interpolação clássica. Salve seu arquivo com o nome de Aula 10 e teste seu filme. Falaremos mais sobre Interpolação de forma na próxima aula. 75 Aula 11 – Utilizando Interpolação de Movimento Compreendendo as Interpolações de Movimento A interpolação de movimento é útil para animar símbolos. Normalmente é usada para mover um objeto de um ponto para outro. É possível usar interpolação de movimentos para alterar cor e transparência, fazer giros e inclinações. Só podemos ter um objeto por camada interpolada, portanto se você quer animar mais de um símbolo deve ter mais de uma camada. A animação de interpolação clássica no Flash é similar a interpolações de movimentos, mas é, de alguma forma, mais complicada de se criar e menos flexível. Entretanto, as interpolações clássicas proporcionam mais tipos de controle sobre a animação do que as interpolações de movimento. Colar propriedades da interpolação clássica: O comando Colar movimento permite copiar uma interpolação clássica, e colar apenas as propriedades específicas a serem aplicadas em outro objeto. 1 Selecione os quadros na Linha do tempo que contêm a interpolação clássica a ser copiada. Os quadros que você seleciona devem estar na mesma camada. No entanto, a seleção não precisa se restringir a uma única interpolação clássica; ela pode transpor uma interpolação, quadros vazios, ou duas ou mais interpolações. 2 Selecione Editar > Linha de tempo > Copiar movimento. 3 Selecione a ocorrência de símbolo para receber a interpolação clássica copiada. 4 Selecione Editar > Linha do tempo > Colar movimento especial. Selecione as propriedades específicas da interpolação clássica para colar na ocorrência do símbolo. As propriedades de interpolação clássica são as seguintes: Posição X: Até que distância um objeto se move na direção x. Posição Y: Até que distância um objeto se move na direção y. Escala horizontal: A relação entre o tamanho atual do objeto e seu tamanho natural na direção horizontal (X). Escala vertical: Especifica a relação entre o tamanho atual do objeto e seu tamanho natural na direção vertical (Y). 76 Girar e inclinar: A rotação e a inclinação do objeto. Essas propriedades devem ser aplicadas conjuntamente a um objeto. A inclinação é uma medida de rotação em graus e, quando você gira e inclina, cada propriedade afeta a outra. Cor: Todos os valores de cor, como Tonalidade, Brilho e Alfa, são aplicados ao objeto. Filtros: Todos os valores e alterações de filtro para o intervalo selecionado. Caso sejam aplicados filtros a um objeto, o filtro é colado com todos os valores intactos, e seu estado (ativado ou desativado) também se aplica ao novo objeto. Modo de mesclagem: Aplica o modo de mesclagem do objeto. Substituir propriedades da escala de destino: Quando está desmarcada, especifica que todas as propriedades sejam coladas em relação ao objeto de destino. Quando marcada, essa opção substitui as propriedades de escala do destino. Substituir propriedades de rotação de destino e inclinação: Quando está desmarcada, especifica que todas as propriedades sejam coladas em relação ao objeto de destino. Quando marcada, as propriedades coladas substituem as propriedades existentes de rotação e escala do objeto. Agora vamos aprender a fazer uma animação de interpolação Clássica -Primeiramente criamos duas camadas uma para nosso caminho e outra para criar a bola q vai passar dentro dele. 77 -Agora na camada caminho desenhe o caminho em que a bola irá percorrer. - E na camada bola criamos o objeto que vai passar pelo caminho. - Feito isto posicione o circulo no começo do caminho. - Feito isto, selecione a bola, pressione F8 e crie um Clipe de Filme. -Agora selecione o frame 60 da camada bola e pressione F6 para criar um quadro chave. - Agora clique com o botão direito e escolha a opção Criar interpolação clássica. 78 -Feito isto clique no ultimo frame da camada bola e posicione a bola no fim do maninho. - Agora selecione o frame 60 da camada bola e pressione F5 para criar um quadro. - Clique na camada bola com o botão direito e selecione a opção Adicionar Guia de movimento clássico. Note que uma nova camada foi adicionada. - Nesta camada desenhe com a ferramenta lápis a trajetória em que a bola deve fazer por dentro do caminho. -Agora no primeiro frame posicione o centro da bola no início da linha e no frame 60 coloque o centro da bola no final da linha. 79 - Agora vamos aplicar um gradiente Linear para que possamos ver o efeito de rotação que iremos colocar na bola. - Agora clique no primeiro frame da camada bola, em seguida clique na aba Propriedades e no botão girar escolha a opção Sentido horário. - Ainda na aba Propriedades, modifique a velocidade em que a bola irá girar no local indicado. 80 - Agora mude o valor de 24 frames por segundo para 15 frames por segundo, para deixar seu movimento mais visível. - Agora para visualizar o arquivo basta pressionar Ctrl+ Enter. 81 Exercícios: 1. O que determina a propriedades de interpolação Girar e Inclinar? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. O que determina a propriedades de interpolação Modo de mesclagem? _________________________________________________________ _________________________________________________________ _________________________________________________________ __________________________________________________________________________________________________________________ 3. O que permite o comando Colar movimento? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 82 Exercício de Fixação: Crie um arquivo de Flash com as dimensões de 550 x 400 px. Dentro palco, crie duas camadas, uma chamada Quadrado e a outra chamada Boneco. Na camada Circulo, clique um círculo sem preenchimento, apenas com contorno. Na camada Boneco, coloque uma imagem de um personagem qualquer de sua preferência, você pode procurar na internet, transforme o boneco em um clipe de filme e faça com que ele corra pelo interior do quadrado. Salve seu arquivo como nome de Aula 11 e teste seu filme. 83 Aula 12 - Utilizando Interpolação de Forma Interpolação de formas Na interpolação de forma, você desenha uma forma vetorial em um quadro específico na Linha do tempo e altera essa forma ou desenha outra forma em outro quadro específico. O Flash então interpola as formas intermediárias para os quadros intermediários, criando a animação de uma forma se transformando em outra. As interpolações de forma funcionam melhor com formas simples. Evite formas com recortes ou espaços negativos nelas. Teste as formas que deseja usar para determinar os resultados. Você pode usar referências de forma para informar ao Flash que pontos da forma inicial devem corresponder a pontos específicos na forma final. Você também pode interpolar a posição e a cor das formas em uma interpolação de formas. Para aplicar a interpolação de forma a grupos, ocorrências ou imagens de bitmap, separe esses elementos. Agora vamos transformar objetos com a interpolação de forma. -Primeiramente crie um quadrado no primeiro frame. -Agora clique no frame 50 e pressione F6 para criar um quadro chave. 84 - Feito isto, deletamos o quadrado e clicamos na ferramenta Polystar e criamos uma estrela no canto inferior do palco. - Agora clique com o botão direito em qualquer frame entre 1 e 50 e escolha a opção Interpolação de forma. - Após inserir a interpolação de forma os quadros entre 1 e 50 ficam com uma flecha de transição. - Mude a cor do gradiente da estrela para verde. 85 - Está pronto! Nosso quadrado se transforma em uma estrela no decorrer dos frames. Controlar alterações de forma com as referências correspondentes Para controlar alterações de forma mais complexas ou improváveis, você pode usar as referências de forma. As referências de forma identificam os pontos que devem corresponder nas formas de início e fim. Por exemplo, se você estiver interpolando o desenho de um rosto à medida que ele muda de expressão, é possível usar uma referência de forma para marcar cada olho. Então, em vez do rosto se tornar uma massa amorfa enquanto ocorre a mudança de forma, os dois olhos permanecem reconhecíveis e mudam separadamente durante a alteração. As referências de forma contêm letras (de "a" a "z") para identificar quais pontos correspondem nas formas inicial e final. Você pode usar até 26 referências de forma. As referências de forma são amarelas em um quadro-chave inicial, verde em um quadro- chave final e vermelho quando não estão em uma curva. Para obter melhores resultados ao interpolar as formas, siga estas orientações: • Na interpolação de forma complexa, crie formas intermediárias e interpole-as, em vez de simplesmente definir uma forma inicial e final. • Certifique-se de que as referências de forma sejam idênticas. Por exemplo, se você estiver usando três referências de forma para um triângulo, elas devem estar na mesma ordem no triângulo original e no triângulo a ser interpolado. A ordem não pode ser abc no primeiro quadro-chave e acb no segundo. 86 • As referências de forma funcionam melhor se você as colocar em sentido anti-horário, começando no canto superior esquerdo da forma. - As vezes você pode fazer esse tipo de interpolação, porém a forma do objeto se torcer na sequencia dos frames não é a desejada. - Veja no exemplo: Neste documento foi feito uma pré- interpolação. - Pode ver que o objeto se torce todo até chegar na forma final. - Isso acontece porque o flash faz esses movimentos todos matematicamente. O vamos fazer é adicionar duas referências de forma. - Primeiramente acessamos o menu Modificar, feito isto vamos em forma e clicamos em Adicionar referência de forma. 87 - Agora posicionamos os pontos nos locais onde ocorrerá a transformação. - Clique no ultimo frame e posicione os dois pontos no local onde foi modificado, veja abaixo o exemplo. - Note que agora no mesmo local onde ocorria o erro, o objeto se transformas sem nenhum problema de sobreposição. 88 Exercícios: 1. Conceitue Interpolação de forma. _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 2. O que podemos usar para controlar alterações de forma mais complexas ou improváveis? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 3. Até quantas referências de forma podemos usar? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 4. Na interpolação de forma é possível fazer uma interpolação de cor? _________________________________________________________ _________________________________________________________ _________________________________________________________ _________________________________________________________ 89 Exercício de Fixação: Crie um arquivo de Flash com as dimensões de 550 x 400 px. Dentro palco, crie um quadrado, transforme-o em um Clipe de Filme e crie uma interpolação de forma para que o quadrado fique sempre mudando de forma, como demonstrado no arquivo Aula 12. 90 Aula 13 – Trabalhando com Ferramenta Rotação 3D Compreendendo a Ferramenta Rotação Nesta aula você aprenderá sobre uma nova ferramenta do flash CS6, a Rotação 3D. Umas das vantagens de usar o Flash CS6, é que ele tem novos recursos 3D, em que você pode fazer animações muito mais realistas. Para usar essas opções 3D, o documento deverá ser ActionScript 3.0. Sobre os gráficos 3D no Flash O Flash permite criar efeitos 3D movendo e girando os clipes de filme no espaço 3D do Palco. O Flash representa o espaço 3D incluindo um eixo z nas propriedades de cada ocorrência do clipe de filme. Você pode adicionar efeitos de perspectiva 3D em instâncias de clipes de filme, movendo-os ao longo do seu eixo x ou girando-os ao redor do eixo x ou y, usando as ferramentas de Translação 3D e Rotação 3D. Na terminologia 3D, mover um objeto no espaço 3D chama-se translação e girar um objeto no espaço 3D chama-se transformação. Após aplicar um desses efeitos a um clipe de filme, o Flash considera um clipe de filme 3D e um indicador de eixos coloridos aparece sobreposto no clipe de filme sempre que é selecionado. 91 Para fazer um objeto parecer mais próximo ou mais distante do visualizador, mova-o ao longo do eixo z com a ferramenta Translação
Compartilhar