apostila completa flash cs5

70
 FLASH CS5  Desenvolvido por Marcos Paulo Furlan

Upload: juniorinstrutorevolute

Post on 11-Oct-2015

38 views

Category:

Documents


0 download

TRANSCRIPT

  • 5/21/2018 Apostila Completa Flash Cs5

    1/70

    FLASH CS5

    Desenvolvido

    por Marcos Paulo Furlan

  • 5/21/2018 Apostila Completa Flash Cs5

    2/70

    2

    NDICE

    NDICE .......................................................................................................................................... 2

    ADOBE FLASH............................................................................................................................. 3

    O AMBIENTE DO FLASH ........................................................................... 3Atalhos ........................................................................................................ 4Tela de Abertura ......................................................................................... 4Configurando sua rea de trabalho ............................................................. 5Caixa de Ferramentas ................................................................................. 7Ferramentas de Desenho e suas propriedades .......................................... 7

    Manipulando Objetos .................................................................................... 22Trabalhando com objetos externos ............................................................... 24

    Importando bitmaps .................................................................................. 24Importando um arquivo de udio ............................................................... 26

    Importando vdeos .................................................................................... 29Smbolos ....................................................................................................... 31

    Os tipos de Smbolos: ............................................................................... 32Filtros ........................................................................................................ 35

    Linha do Tempo ............................................................................................ 36Animao ...................................................................................................... 37

    Animao Quadro a Quadro ..................................................................... 37Animao com Interpolao de Movimento .............................................. 38Motion Editor ............................................................................................. 41

    Onion Skin ................................................................................................. 42

    Propriedades da barra de ferramentas do quadro .................................... 42Camadas ...................................................................................................... 43

    Camadas Guia .......................................................................................... 44Mscaras ................................................................................................... 47Interpolao de Forma .............................................................................. 50

    Botes........................................................................................................... 51CLIPES DE FILME ....................................................................................... 51Cinemtica Inversa ....................................................................................... 53Motion Presets e spray brush tool ................................................................ 56

    Motion Presets .......................................................................................... 56Spray Brush Tool ...................................................................................... 57

    Aes ............................................................................................................ 60O painel Aes .......................................................................................... 60Utilizando o Script Assist ........................................................................... 60

    Aes bsicas do Flash ................................................................................ 63Exemplo de utilizao de actions .............................................................. 63

    CENAS ......................................................................................................... 66PUBLICAO DO FILME ............................................................................. 67Concluso ..................................................................................................... 70

    Multibrasil Download -www.multibrasil.net

  • 5/21/2018 Apostila Completa Flash Cs5

    3/70

    3

    ADOBE FLASH

    O AMBIENTE DO FLASHAo iniciarmos o Flash ele vai apresentar uma tela com as opes que podemos

    trabalhar com o Flash.

    Para quem j utiliza ou utilizou alguma verso anterior do Flash a primeira

    mudana que pode ser observada de distribuio de sua Workspace. A

    Timeline (linha do tempo), agora est embaixo como maioria dos

    programas de animaoa janela central mostra-se um menu inicial, na direita

    temos algumas paletas como Properties e Library e a caixa de ferramentas.

    possvel mudar a Workspace, para isso basta clicar no menu Window,

    Workspace e escolher uma das opes que o Flash disponibiliza.

  • 5/21/2018 Apostila Completa Flash Cs5

    4/70

    4

    Voc pode tambm modificar sua workspace, e salv-la. Basta definir a

    posio de suas paletas, Timeline, etc. E depois clicar no menu Window,

    Workspace, New Workspace.

    AtalhosO Flash tambm disponibiliza uma grande quantidade de atalhos para facilitar a

    sua utilizao, a grande maioria segue os padres dos programas grficos

    como CRTL+S para salvar, CTRL+A para selecionar todos os objetos. Os

    principais atalhos voc pode observar ao selecionar um item de menu.

    Na barra de ferramentas lateral ao posicionar o mouse sobre uma ferramenta

    ele mostra o nome e entre parnteses a letra correspondente ao atalho dela.

    Para saber sobre todos os atalhos do Flash, clique no menu Edit> Keyboard

    Shortcuts.

    Tela de AberturaNa tela de abertura podemos verificar os ltimos filmes abertos, ou abrir um

    arquivo j existente. Na opo do meio podemos criar um novo filme do Flash

  • 5/21/2018 Apostila Completa Flash Cs5

    5/70

    5

    utilizando a linguagem ActionScript 3, ActionScript 2, documento AIR, Flash

    Mbile, ActionsScript File, ActionScript Communication File, Flash JavaScript e

    Flash Project. Na direita da tela temos A opo de usarmos um Template e de

    adicionarmos uma extenso ao Flash.

    Inicie um novo projeto ActionScript 3

    Configurando sua rea de trabalhoSempre que for criar sua animao em Flash necessrio configurar as

    dimenses de seu filme, a velocidade do filme, cor de fundo, etc.

    Para isso na direita da tela clique no boto Properties, ele abre uma aba onde

    voc pode alterar as propriedades.

  • 5/21/2018 Apostila Completa Flash Cs5

    6/70

    6

    Observe que seu filme tem uma taxa de quadros de 18 fps (frames per second

    frames por segundo) e uma dimenso de 800x600px e fundo de tela branco.

    Voc pode alterar todas as propriedades clicando no boto Edit.

    Voc pode chamar essa tela tambm atravs do clique com o boto direito e

    depois a opo Document Properties.

  • 5/21/2018 Apostila Completa Flash Cs5

    7/70

    7

    Caixa de FerramentasA caixa de Ferramentas do Flash CS5 composta de quatro subdivises:

    Ferramentas (Tools), Exibir (View), Cores (Colors) e Opes (Options).

    A rea de ferramentas composta dos botes de desenho e manipulao dos

    desenhos feitos na rea de desenho do FLASH.

    A rea Exibir permite modificar a forma de visualizar a rea de desenho do

    Flash permitindo mover o desenho ou ampli-lo com a lupa.

    Na rea de cores podemos definir cores de linhas e cores de preenchimento

    dos desenhos feitos no FLASH.

    Opes tratam das opes de desenho selecionado.

    Ainda com relao caixa de ferramentas, ao posicionar a ponta do mousesobre uma ferramenta ela mostra o nome da ferramenta e uma letra entre

    parnteses, ao pressionar a tecla correspondente letra ela ser marcada

    como ativa automaticamente.

    Ferramentas de Desenho e suas propriedades

    A primeira ferramenta a ferramenta seta utilizada para selecionar os

    objetos de sua rea de trabalho, podemos selecionar os objetos clicando sobreeles ou simulando um contorno em forma de retngulo sobre o objeto a ser

    selecionado. Tecla de atalho V.

    Ao selecionar um objeto e clicar na aba Properties, voc poder alterar as

    propriedades do objeto selecionado.

  • 5/21/2018 Apostila Completa Flash Cs5

    8/70

    8

    Podemos definir a sua posio X e Y no palco, definir suas dimenses (w

    largura e h altura), se voc precisar que dimensionamento seja uniforme

    necessrio clicar nela de corrente para fech-lo.

    Na opo Fill (preenchimento) e stroke (contorno), voc pode alterar as

    propriedades de cores e no caso do contorno a espessura do contorno, o tipoda linha e como so cantos abertos (cap) quando os objetos no forem forma

    fechadas e fechados (join) que permite arredondar e cortar o contorno.

    Os objetos no Flash diferenciam contorno de preenchimento ento se voc

  • 5/21/2018 Apostila Completa Flash Cs5

    9/70

    9

    clicar no meio de um objeto voc apenas selecionar o preenchimento. Para

    poder selecionar ambos necessrio um duplo clique ou simular um contorno

    sobre ambos com a ferramenta seta.

    Na imagem acima a primeira bola temos apenas o preenchimento selecionado,na segunda somente o contorno e na terceira ambos.

    A ferramenta em forma de uma flecha branca a ferramenta subselecionar

    que permite trabalhar com os ns de seu objeto.

    Abaixo temos a ferramenta FreeTransform . Ao clicar sobre ela, sero

    mostrado alas de dimenso em volta de seu objeto. Na parte de Options dacaixa de ferramentas ele mostra as opes da ferramenta.

    A primeira opo a Rotate and Skew, que permite rotacionar e inclinar a

    ferramenta.

    A segunda opo Scale permite dimensionar a forma selecionada. Se

  • 5/21/2018 Apostila Completa Flash Cs5

    10/70

    10

    redimensionar seu objeto com a tecla ALT pressionada ao dimensionar para

    um lado ele faz a mesma dimenso para o outro lado.

    A terceira opo a opo Distort que permite distorcer seu objeto em

    perspectiva. A ltima opo a Envelope que vai permitir editar o objeto com

    curvas de bezier.

    Caso voc j tenha convertido seu objeto em smbolo as opes disponveis

    sero somente Rotate and Skew e Scale.

    Free Transform Tool: Essa ferramenta tem junto a ela um pequena flecha no

    canto inferior direito, ferramentas que contm essa flecha contm outras

    ferramentas no mesmo grupo caso no a ferramenta Gradient Transform Tool

    , veremos o uso dessa ferramenta posteriormente.

    A ferramenta seguinte faz parte das novas ferramentas da verso CS4, que a

    ferramenta 3D Rotation Tool . Para que essa ferramenta possa ser utilizada

    necessrio que seu objeto j esteja convertido em smbolo. Veremos como

    converter um objeto em smbolo e funcionamento da ferramenta

    posteriormente.

    Junto a ela temos a 3D Translation Tool , veremos o funcionamento dela

    tambm posteriormente.

    Ao lado da ferramenta linha temos a ferramenta Lao que permite fazer

    selees irregulares em nossos objetos.

    Depois temos o grupo da ferramenta Pen Tool (caneta) que permite

    desenhar linhas e curvas, ela tambm possui um grupo, que so as opes de

    adicionar pontos, apagar pontos e converter os pontos.

    O funcionamento da ferramenta caneta no Flash idntico a qualquer outra

    ferramenta de desenho. Voc clica e ele marca um ponto, depois ao clicar em

    outro ponto e mover o mouse ele far curva conforme voc move o mouse, ao

    clicar em um terceiro ponto ele cria nova curva.

  • 5/21/2018 Apostila Completa Flash Cs5

    11/70

    11

    Voc pode observar que ao criar os pontos ele gera alas que podero depois

    com ferramenta subselecionar (seta branca) serem trabalhados acentuando as

    curvas conforme a sua necessidade. Caso seja necessrio criar algum ponto

    novo, voc pode usar a ferramenta Add Anchor Point Tool que faz parte do

    grupo da ferramenta caneta. Ao selecionar essa ferramenta voc poder

    observar que o cursor fica no formato da caneta com um sinal de mais (+)

    permitindo criar o novo ponto. Para retirar um ponto basta selecionar a

    ferramenta Delete Anchor Point Tool. Com a ferramenta Convert Anchor Point

    voc poder tambm trabalhar diretamente nos pontos.

    A ferramenta Texto possui trs opes. que podem ser Esttico, Dinmico

    e de Entrada.

    Essas opes podem ser modificadas pelo painel Properties

    Texto Esttico: o texto normal. Utilizamos esse tipo de texto no Flash para

  • 5/21/2018 Apostila Completa Flash Cs5

    12/70

    12

    frases e blocos de texto. Para se criar um bloco basta clicar e manter o mouse

    pressionado para definir o tamanho de sua caixa de texto. Ele permite

    formatao de caractere e pargrafo, opes de aplicao de link direto nele e

    filtros (veremos posteriormente junto com smbolos).

    Texto Dinmico: o texto que recebe informaes de uma varivel, ou seja,

    ele l o texto de um arquivo qualquer que contenha uma varivel igual a sua,

    exemplo de usos para leitura de variveis de scripts, ASP, PHP, HTML e at

    mesmo de arquivos TXT, como por exemplo, para textos em barras de

    rolagem.

    Texto de Entrada: Permite que se crie uma caixa de texto e que a mesmo

    comporte-se como campo de formulrios, ele permite que o usurio insira

    informaes que sero repassadas tambm atravs de variveis.

    Agora no Flash CS5 voc pode tambm alternar para o formato de

    texto TLF que permite escrita vertical, caracteres orientais,

    encadeamento de fluxo de texto, etc. Para saber mais sobre este

    novo formato entre em contato com apostilando.com e pea informaes sobre

    o curso WebKit 2.

    Abaixo temos a ferramenta Linha que permite que se trace linhas e

    podemos tambm unir os ponto de uma linha criando assim polgonos.

    Estando com o a ferramenta encaixar (Im) ligada - o mesmo

    encontra-se caixa de propriedades e na barra de ferramentas - ao

    traar ele mantm uma bolinha na extremidade da linha e quando encaixar

    ele tambm a mostrar, isso far tambm com que as linhas sempre saiam

    retas na vertical e diagonal. Esta ferramenta tambm auxiliar na criao de

    quadrados e circunferncias. Tambm manter uma grade invisvel em sua tela

    - o que muitas vezes atrapalha - para o posicionamento de objetos. Para evitar

    o uso do im voc pode deslig-lo ou ento utilizar as setas de seu teclado

    para o posicionamento.

    Grupo de ferramentas de desenho, a primeira ferramenta o retngulo . Para

    se desenhar com o retngulo o processo simples, clica-se na ferramenta e

    com o mouse pressionado arraste-se o mesmo pela tela. Enquanto se desenha

  • 5/21/2018 Apostila Completa Flash Cs5

    13/70

    13

    no canto inferior direito aparece uma pequena bolinha, quando o retngulo fica

    uniforme como um quadrado a bolinha fica mais forte, isso facilita muito para se

    criar objetos perfeitos, outra forma de se criar se criar um quadrado

    pressionar a tecla SHIFT enquanto se desenha.

    Para desenhar seu retngulo com cantos arredondados externos e internos, ao

    selecionar a ferramenta retngulo, voc chama o painel Properties, nele voc

    pode alterar tanto cor de contorno e preenchimento como definir o

    arredondamento dos cantos.

    Quando precisar desenhar um retngulo com cantos arredondados e

    no souber seu ngulo desenhe seu retngulo e sem soltar o mouse

    v arredondando seus cantos com as setas direcionais.

    A ferramenta Elipse permite desenhar circunferncias, ovais, e a partir da

    verso CS4 podemos tambm ngulos de inicio, fim e alterar o raio interno.

  • 5/21/2018 Apostila Completa Flash Cs5

    14/70

    14

    Ferramenta Polystar Tool que permite desenhar polgonos e estrelas.Essa mudana pode ser feita atravs do boto Options na barra de

    propriedades.

  • 5/21/2018 Apostila Completa Flash Cs5

    15/70

    15

    A ferramenta lpis permite desenhar linhas em sua rea de desenho ao

    selecionar a ferramenta linha na caixa de opes abrem-se as opes de

    linhas: Acertar, Suavizar e Tinta.

  • 5/21/2018 Apostila Completa Flash Cs5

    16/70

    16

    A ferramenta pincel que permite traos com de preenchimentos, na caixa

    de opes abre-se s possibilidades de preenchimento, tipos de pinceis e

    dimetros de pinceis.

    As opes dessa ferramenta so:

    Paint Normal: Pinta o objeto por onde o pincel for passado;

    Paint Fills: Pinta somente preenchimentos;

    Paint Behind: Pinta somente fora do objeto;

    Paint Selection: Pinta somente o que est selecionado;

    Paint Inside: Permite pintar somente dentro.

    Abaixo dessas opes temos o tamanho do pincel e abaixo dele a forma do

    pincel.

    Para quem utiliza uma Tablet ao selecionar a ferramenta pincel ele

    habilita mais uma opo que a configurao de presso do pincel.

    Deco Tool

    Mas na janela de propriedades temos o efeito de desenho (Drawing Effect),

    abaixo temos as opes de utilizar ou no smbolos como est marcada a

    opo Default Shape o boto Edit esta desabilitado podemos mudar as cores

    do efeito

    Nas opes avanadas podemos mudar o ngulo e o escalamento do padro

    de preenchimento.

    Podemos tambm definir se o efeito ser esttico ou podemos animar o

    padro.

  • 5/21/2018 Apostila Completa Flash Cs5

    17/70

    17

    Ferramenta Bon Tool e a ferramenta Blind Tool , como so duas

    ferramentas que para serem utilizadas precisa-se entender sobre smbolos e

    animao, veremos seu funcionamento posteriormente.

    A prxima ferramenta trata de preenchimentos e contornos.

    Abaixo temos a ferramenta Tinteiro que permite pintar a cor de contorno

    dos objetos. Basta selecion-la e aplicar a cor desejada diretamente na linha

    de contorno de seus objetos.

    Ao lado dela temos a ferramenta Balde de Tinta que permite modificar a

    cor de preenchimento dos objetos O Flash possui para preenchimento as cores

    da paleta WEBSAFE e tambm alguns gradientes existentes. Na caixa de

    opes tambm podemos definir como deve ser aplicado o preenchimento, em

    todo o objeto, ou com lacunas.

    Ao clicar na cor atual ele abre a opo de escolha de cores.

  • 5/21/2018 Apostila Completa Flash Cs5

    18/70

    18

    Para trabalharmos com cores gradientes, nvel de alpha da cor necessrio

    clicar no menu Window>Color

    Na paleta Color a opo padro inicial Solid onde podemos definir as cores

    de contorno e preenchimento pela escolha da cor, cdigos RGB e

    Hexadecimal. A opo Alpha define o grau de transparncia da cor. Na opo

    TYPE temos como padro SOLID, ao clicar nessa opo pode-se mudar para

    linear que aplicar ao objeto selecionado

    Ao escolher opo SOLID, ser mostrado na opo COLOR a barra de cores

    gradiente.

  • 5/21/2018 Apostila Completa Flash Cs5

    19/70

    19

    Voc pode observar que temos na opo gradiente duas alas de cores, para

    alterar a cor de qualquer uma das alas de gradiente, basta clicar sobre ela e

    escolher a cor desejada. Podemos acrescentar uma ala de gradiente a nossa

    paleta de cores basta clicar entre uma delas, ele vai criar as outras alas de

    cores.

    Para retirar uma das alas basta apenas clicar sobre a ala, manter o mouse

    pressionado e arrastar para fora da linha.

    Ao clicar na ferramenta Gradient Transform Tool , permite alterar a

    posio do gradiente dentro de nosso objeto. Ao selecionar o objeto com o

    gradiente e clicar na ferramenta ele vai mostrar uma ala quadrada e uma

    redonda em volta do gradiente.

  • 5/21/2018 Apostila Completa Flash Cs5

    20/70

    20

    A ala quadrada permite aproximar / afastar as cores gradientes, a ala em

    crculo permite rotacionar o gradiente.

    Podemos tambm escolher a opo RADIAL, ao escolher opo RADIAL

    podemos aplicar as mesmas opes do gradiente LINEAR. Podemos tambm

    definir a opo de gradiente e preencher nosso objeto com o balde de tinta.

    A ultima opo chama-se Bitmap, que permite com o conta-gotas capturar o

    bitmap. Caso no exista uma imagem dentro do Flash, ao escolher a opo

    Bitmap ele vai solicitar que se escolha a imagem para servir como

    preenchimento.

    A ferramenta conta-gotas permite capturar a cor de um objeto e aplicar

    dentro de outro, por exemplo, se voc importar um bitmap para dentro do flash

  • 5/21/2018 Apostila Completa Flash Cs5

    21/70

    21

    e depois desejar aplicar este bitmap como preenchimento de um objeto clique

    sobre o bitmap com o conta gotas, a ferramenta modifica-se imediatamente

    para o balde de tinta e voc pode preencher onde desejar.

    A ferramenta apagador funciona como uma borracha, o cuidado como

    apagar necessrio utilizar as opes desta ferramenta. Ao selecionar essa

    ferramenta ele abre algumas opes de utilizao.

    A primeira opo permite que se escolha o que deve ser apagado.

    Erase NormalApaga como uma borracha mesmo, onde for passado o cursor

    ele apaga.

    Erase FillsApaga somente preenchimentos.Erase LinesApaga apenas linhas.

    Erase Selected FillsApaga somente preenchimentos selecionados.

    Erase InsideApaga somente de dentro para fora do objeto selecionado.

    A opo Faucet (cone em forma de uma torneira) apaga todo o objeto que

    esteja com as mesmas propriedades.

    A ltima opo permite modificar o formato da borracha.

    A ferramenta Hand permite arrastar a tela. A tecla de atalho o H, mas

    voc pode utilizar ela sem mudar de ferramenta pressionando a barra de

    espaos.

    A ferramenta lupa permite aumentar e diminuir o Zoom de rea de

    desenho. Ao selecionar essa ferramenta ela habilita as duas opes. As teclas

    de atalho para ela so CTRL++ no teclado de caracteres e CTRL+-, tambm

    no teclado de caracteres.

  • 5/21/2018 Apostila Completa Flash Cs5

    22/70

    22

    A ultima opo permite alternar entre as cores de preenchimento e

    contorno e definir as cores padro.

    Manipulando ObjetosAo desenhar no Flash, podemos manipular nossos objetos, tanto na forma,

    como contorno e preenchimentos.

    Ao desenharmos linhas, polgonos, retngulos e elipses, podemos alterar a sua

    forma facilmente com a ferramenta seta.

    Por exemplo, se clicarmos diretamente na linha a mesma ser selecionada,

    mas se aproximarmos o cursor da linha o mesmo se transformar em uma

    curva, ao pressionarmos o boto do mouse e arrastarmos transformaremosnossa linha em uma curva, o mesmo vale para todos os objetos. Em retngulos

    ao aproximarmos de suas extremidades ele tambm apresentar um vrtice

    permitindo que se crie pontas.

    Ao manipular textos necessrio um processo um pouco mais detalhado, os

    textos no so criados como vetores, e para que se possam alterar as formas

    dos textos necessrio primeiro transform-los em vetores. Aps criar o seu

    texto, basta selecion-lo com a ferramenta seta e desmembr-lo (MenuModificar, Desmembrar ou CTRL+B). A primeira vez que se desmembrar um

    texto ele vai quebrar em letras, retira o processo de desmembrar para ele se

    transformar em Vetor.

  • 5/21/2018 Apostila Completa Flash Cs5

    23/70

    23

    Ao desmembrar o texto apenas uma vez, ele quebra em letras, para

    colocar cada letra em uma layer separada, com todas as letras

    selecionadas, clique com o boto direto sobre uma delas e escolha

    Distribute to Layers.

    Essa dica no valida somente para textos, basta apenas ter dois ou mais

    elementos em seu palco selecionados para que isso possa ser utilizado.

    O seu texto passou a ser um vetor ento podemos acrescentar gradientes, e

    alterar a sua forma.

    Importante: Depois de convertido em vetor no mais possvel alter-lo como

    texto.Outra opo de manipulao muito importante a manipulao de alinhamento

    de objetos (Menu Window, Align ou Menu Modify Align), pois quando iniciarmos

    o nosso trabalho com animaes existe um cuidado muito grande com posio

    de nossos objetos.

    A opo To Stage da paleta Align permite alinhar e / ou distribuir os

  • 5/21/2018 Apostila Completa Flash Cs5

    24/70

    24

    elementos de acordo com o palco.

    Trabalhando com objetos externos

    No Flash alm de criar seus prprios objetos podemos tambm inserir novosobjetos dentro de nossos filmes.

    O Flash importa quase todos os formatos grficos, tendo como destaque o

    PNG, o PSD (Photoshop), AI Adobe Illustrator formatos de bitmaps (BMP, GIF,

    JPG, etc.) arquivos de udio como WAV, MP3, AU, formato de vdeo AVI,

    MOV, MPEG, FLV.

    Ao importar um objeto o mesmo ser colocado na biblioteca de smbolos do

    programa.

    Importando bitmapsO processo de importao simples, basta clicar no menu File Import, as sub

    opes desse menu so:

    To stageImporta para o palco

    To LibraryImporta o objeto diretamente para a biblioteca

    To External LibraryImporta a biblioteca de outro arquivo FLA.

    VdeoImporta um vdeo.Escolha a primeira opo e adicione uma imagem ao seu filme

    Ao ser importado o objeto ele fica na palco e mantm uma instncia dele na

    biblioteca.

  • 5/21/2018 Apostila Completa Flash Cs5

    25/70

    25

    Caso voc precise alterar sua imagem em algum programa de edio

    de imagens e depois atualizar no Flash, basta apenas pela biblioteca

    clique com o boto direito na imagem e escolher Update. Caso voc

    queira substituir a imagem, clique com o boto direito, depois escolha

    Properties, dentro da janela que se abre escolha Import e faa a substituio.

  • 5/21/2018 Apostila Completa Flash Cs5

    26/70

    26

    Importando um arquivo de udioNo Flash, possvel utilizar os sons de vrias maneiras. Voc pode criar sons

    reproduzidos continuamente, independentemente da Linha de Tempo, ou pode

    sincronizar a animao com uma trilha sonora. Voc pode anexar sons a

    botes para torn-los mais interativos e faz-los aumentar e diminuir para obter

    uma trilha sonora apurada.

    possvel usar sons em bibliotecas compartilhadas para vincular um som de

    uma biblioteca a vrios filmes. Tambm possvel usar sons em objetos de

    som para controlar sua reproduo com o ActionScript.

    O Flash armazena os sons na Biblioteca juntamente com os bitmaps e

    smbolos. Como nos smbolos, basta uma cpia de um arquivo de som para

  • 5/21/2018 Apostila Completa Flash Cs5

    27/70

    27

    utiliz-lo de vrias maneiras no filme.

    Para adicionar o som ao seu filme aps importar ele para dentro do FLASH,

    arraste ele para o quadro onde ele dever ser iniciado.

    Ao adicionar um som a sua linha do tempo, podemos controlar a sua execuo

    pela barra de propriedades. Clique no quadro onde foi inserido o udio.

    Observe que ele mostrar o arquivo de udio que est sendo carregado, caso

    tenha mais de um arquivo de udio em sua biblioteca voc poder alterar o

    arquivo por essa opo.

  • 5/21/2018 Apostila Completa Flash Cs5

    28/70

    28

    Podemos tambm aplicar efeitos em nosso som

    A opo None no aplica quaisquer efeitos ao arquivo de som. Escolha essa

    opo para remover os efeitos aplicados anteriormente.

    A opo Left Channel/Right Channel reproduz o som somente no canal

    esquerdo ou direito.

    A opo Fade Left to Right/Fade Right to Left desloca o som do canal

    esquerdo para o direito e do direito para o esquerdo.

    A opo Fade-in aumenta gradualmente a amplitude de um som pela sua

    durao.

    A opo Fade-out diminui gradualmente a amplitude de um som pela sua

    durao.

    A opo Custom permite que voc crie seus prprios pontos de entrada e de

    sada do som usando Editar Envelope.

    Escolha uma opo de sincronizao no menu pop-up Sinc:

    A opo Event sincroniza o som com a ocorrncia de um evento. Um evento

    de som reproduzido totalmente quando o respectivo quadro-chave inicial

    exibido pela primeira vez, independentemente da Linha de Tempo, mesmo se o

    filme parar. Os sons de evento so misturados quando voc reproduz o filmepublicado. Um exemplo de evento de som um som reproduzido quando um

    usurio clica em um boto.

    A opo Start idntica Event, exceto pelo fato de que, se o som j estiver

    em reproduo, ser iniciada uma nova instncia desse som.

    A opo Stop silencia o som especificado.

    A opo Stream sincroniza o som, ao se importar um vdeo e precisar incluir a

    trilha sonora, deixar essa opo marcada.Embora se torne fcil conseguir sons na Internet e em CDS

    multimdia hoje em dia, muitas vezes voc precisar editar o seu

    prprio som, por exemplo, uma frase, a ser dita ao clicar sobre um

    boto, ou uma parte de uma msica para introduo de seu site,

    aconselhvel para isso o uso de programas externos, deixando para o Flash o

    som j pronto para ser utilizado.

  • 5/21/2018 Apostila Completa Flash Cs5

    29/70

    29

    Importando vdeosPorm para poder exibir um vdeo dentro do padro de Flash Vdeo ser

    necessrio converter ele para FLV

    Use o Adobe Media Encoder para convert-lo antes de importar no Flash.

    Depois de convertido decida como o mesmo dever ser importado

  • 5/21/2018 Apostila Completa Flash Cs5

    30/70

    30

    Defina o formato do Skin

  • 5/21/2018 Apostila Completa Flash Cs5

    31/70

    31

    Na prxima tela clique em Next e depois em Finish.

    Smbolo s

    Para podermos trabalhar com animaes no FLASH necessrio que quase

    todos os elementos sejam convertidos para smbolos, pois atravs de

    smbolos que podemos definir qual o comportamento do smbolo:

    Os trs smbolos do FLASH so Grficos , Botes e Clipes de Filme .

    Voc pode criar o objeto e depois convert-lo em Smbolo ou atravs do menu

  • 5/21/2018 Apostila Completa Flash Cs5

    32/70

    32

    Insert Convert to Symbol cri-lo e depois adicionar ao filme. Ao criar um

    smbolo ele vai automaticamente para a Biblioteca de Smbolos.

    Para converter um objeto existente em smbolo basta apenas apertar a tecla de

    funo F8.

    Os tipos de Smbolos:Grfico: Este o tipo mais bsico de smbolo, pois ele praticamente esttico,

    embora possa receber aes para ele, muito utilizado tambm dentro dosoutros smbolos.

    Boto: Este smbolo pode receber valores diferentes para estado do boto,

    normal, ao rolar sobre, pressionado e oculto, muito utilizado para chamar

    aes.

    Clipe de Filme: Este tipo de smbolo permite que se crie um filme dentro do

    smbolo com a vantagem de que ele carrega todo o clipe de filme primeiro e

    mostra o mesmo no filme todo de uma vez.

  • 5/21/2018 Apostila Completa Flash Cs5

    33/70

    33

    Ao desenhar seu objeto e pressionar F8, (Menu, Modify Convert to Symbol) ele

    abre a tela acima, onde necessrio dar um nome ao smbolo (ele sempre

    trar um nome genrico, como symbolXX), o nome aconselhvel manter uma

    nomenclatura que facilite a sua identificao. Por exemplo, Grficos colocar

    GRnome, boto BTnome, Clipe de Filme MCnome. No caso do clipe de filme

    usa-se MC (Movie Clip), dessa forma que a comunidade de designers e

    programadores em Flash chama o Clipe de Filme. Abaixo do nome temos a

    escolha do tipo de smbolo. Ao lado do tipo de smbolo temos a posio de seu

    centro de Registro, ao padro no canto superior esquerdo, esse centro de

    registro necessrio, pois a partir dele que seu objeto carregado.

    Ao clicar na opo Advanced, abre-se as opes de exportao de nosso

    objeto para cdigo.

    Mesmo depois de pronto podemos alterar as propriedades de nossos smbolos

    atravs da biblioteca (atalho CTRL+L ou Menu Window Library), ou mesmo ele

    estando dentro do filme principal, em ambos os casos basta apenas clicar

    sobre o smbolo com o boto direito do mouse e depois escolher editar para

    ambos os casos, e estando o smbolo no filme podemos edit-lo tambm no

    local e em uma nova janela.Ao criar um smbolo, podemos manipul-lo pela barra de propriedades.

  • 5/21/2018 Apostila Completa Flash Cs5

    34/70

    34

    Na barra de propriedades podemos definir a posio X e Y de nosso objeto, a

    sua largura (W) e altura (H), o comportamento do objeto. Onde est InstanceName, um campo utilizado para dar nome de instncia ao objeto, esse

    campo ser utilizado em actionscript. A opo SWAP permite substituir o

    smbolo na rea de edio por outro existente na biblioteca.

    A opo 3D Position and View um recurso que veio com a verso CS4, e

    permite voc trabalhar os eixos X, Y e Z do objeto. Permite trabalhar o ngulo

    de perspectiva.

    A opo Color Effect permite modificar as propriedades de cor e transparnciado smbolo. As opo so:

    Brightness Brilho, o brilho natural do objeto 0%, ao colocar em -

    100% ele retira todo o brilho (preto) e 100% ele adiciona todo o brilho

    (100%).

    TintPreenchimento, permite preencher o seu objeto com qualquer cor

    com grau de transparncia.

    Alpha

    Permite acrescentar transparncia aos smbolos.

  • 5/21/2018 Apostila Completa Flash Cs5

    35/70

    35

    AdvancedPermite trabalhar as cores RGBA do smbolo.

    A opo Display Blending permite aplicar mistura de objetos. necessrio

    que cada objeto esteja em sua camada.

    Use Runtime Bitmap Caching, permite criar um bitmap de seu objeto em

    tempo de execuo.

    FiltrosA partir da verso 8, o Flash trouxe uma inovao esperada h muito tempo

    que so filtros para serem aplicados aos smbolos. Uma nica observao, os

    filtros s podem ser aplicados a Clipes de Filme e Textos.

    Para aplicar um filtro, selecione seu smbolo e clique no boto Add Filter.

    As opes so:

    Drop Shadow Aplica uma sombra ao seu objeto. Permite alterar

    diversas propriedades do efeito como desfoque, cor, qualidade, etc.

    A opo Blur permite trabalhar o sombreamento do smbolo, o cadeado

    fechado faz com que ao alterar-se uma das opes mudam-se as duas. Ao

    clicar no cadeado, o mesmo ficar aberto e assim ser possvel alterar o

  • 5/21/2018 Apostila Completa Flash Cs5

    36/70

    36

    Blur de forma independente. A opo Strenght trabalha a disperso da

    sombra. Podemos alterar a qualidade da sombra em Quality, podemos

    alterar a cor, o ngulo e a distncia da sombra. A opo Knockout trabalha

    a mscara do smbolo. Inner Shadow aplica a sombra Interna e a opo

    Hide Object, oculta o smbolo deixando somente o filtro sendo mostrado.

    BlurPermite desfocar seu smbolo, podemos alterar as propriedades

    de desfoque e qualidade do mesmo.

    GlowPermite aplicar brilho ao seu smbolo.

    BevelAtravs dessa opo podemos aplica chanfros e entalhes em

    nosso smbolo. Na opo Type, podemos definir ele como Inner, Outer e

    Full.

    Gradiente GlowPermite aplicar um brilho gradiente aos smbolos.

    Gradiente BevelPermite aplicar Chanfros Gradiente aos smbolos.

    Adjust Color Permite trabalhar os ajustes de cores do smbolos

    como Brilho, Contraste, Saturao e Matiz (Hue).

    A terceira guia Parameters, ser utilizada com componentes.

    Linha do TempoA Linha do tempo utilizada na criao de animaes. Atravs dela podemos

    definir qual ser a mudana e/ou caminho a ser especificado pelo objeto do

    filme. Podemos travs de a linha tempo utilizar camadas para melhor

    agrupamento e movimento dos objetos.

    Temos as opes de visualizao de camadas: mostrar / ocultar, bloquear /

    desbloquear e visualizar somente traos: .

    Abaixo temos as camadas criadas: .

    Ao lado de cada camada temos os quadros de nossa animao, quando um

    quadro possui um objeto observe que o mesmo apresenta uma bolinha

  • 5/21/2018 Apostila Completa Flash Cs5

    37/70

    37

    preenchida, quando o mesmo apresentar uma bolinha vazada um quadro

    vazio e quando o mesmo apresentar um a significa que nesse quadro temos

    aes (aes so blocos de cdigos dentro de nossa animao).

    No final do empilhamento de camadas temos os botes que nos permitem criar

    as camadas do Flash. Criar uma camada normal, criar uma pasta (permite

    armazenar camadas dentro delas e no final da linha excluir uma camada.

    A barra da linha do tempo exibe os quadros da animao onde esto cursor

    vermelho na barra indica o quadro selecionado, possvel clicar sobre oquadro para selecionar o mesmo. No canto direito da barra temos o boto onde

    podemos definir a aparncia da barra da Timeline.

    Na parte de baixo temos as opes de Onion Skin (veremos mais a frente) o

    nmero do frame selecionado, a velocidade de nosso filme (12fps), 12 Frames

    per second (Quadros por segundo). Significa que nosso filme apresenta 12

    quadros de animao por segundo.

    Animao

    Animao Quadro a QuadroA animao quadro a quadro funciona de maneira semelhante a um desenho

    animado, ou seja, para cada movimento do objeto dever ser colocado o

    mesmo dentro de quadro.

    Para entendermos melhor este processo crie uma circunferncia na sua rea

    de desenho. Observe que ao desenhar o objeto no filme do Flash, no primeiro

    quadro aparece uma bolinha preta, mostrando que no quadro existe um objeto.

    Para inserir uma instncia deste mesmo objeto no prximo quadro, clique com

    o boto direito do mouse no prximo quadro e escolha Inserir Quadro Chave

    (tecla de atalho F6). Ele repete o mesmo smbolo.

  • 5/21/2018 Apostila Completa Flash Cs5

    38/70

    38

    Modifique a cor de seu smbolo. Repita este processo at o quadro 12,

    alterando a cor de seu objeto a cada quadro. Isto far com que sua animao

    possua 1 segundo. Para testar aperte as teclas CTRL+ENTER, isso testa o seu

    filme e gera um arquivo com a extenso SWF.

    O arquivo de projeto do Flash possui a extenso FLA, ou seja, ao

    salvar seu arquivo ele ser salvo com essa extenso. Para poder

    incluir seu arquivo em uma pgina HTML ser necessrio transform-

    lo para o formato SWF, isso pode ser feito atravs do teste de seu filme

    (CTRL+ENTER). Caso voc utilize o Dreamweaver ele possui um recurso de

    insero do SWF na pgina que vai gerar todo o cdigo necessrio para a

    exibio do SWF. Podemos tambm gerar todo o HTML pelo prprio Flash

    atravs do recurso de publicao que veremos mais adiante.

    Quando se trabalhar com animao quadro a quadro no se converte os

    objetos em smbolos.

    Animao com Interpolao de MovimentoA animao quadro a quadro perfeita, pois voc tem um total controle sobre o

    filme, mas ao mesmo tempo ela demorada, pois muitas vezes sua animao

    ter 200 quadros ou mais ento isso se tornaria demorado e com mais

    possibilidades de erro, embora em muitos filmes seja necessrio que as

    animaes sejam feitas quadro a quadro.

    Uma forma de se automatizar este processo atravs da animao com

    Interpolao, ou seja, podemos definir a posio inicial e afinal de nosso objeto

    e depois podemos fazer a animao.

    Comece um novo filme e cria uma circunferncia com preenchimento ao seu

    gosto e transforme-a em um smbolo.

    Crie um novo quadro no quadro 12.

  • 5/21/2018 Apostila Completa Flash Cs5

    39/70

    39

    Para podermos criar a interpolao de movimento podemos clicar com o boto

    direito no quadro 1 e escolher Create Classic Tween.

    Observe na timeline que ele preenche os quadros com uma cor lils. Ele

  • 5/21/2018 Apostila Completa Flash Cs5

    40/70

    40

    tambm apresenta como quadros preenchidos somente o primeiro e o ltimo

    quadro de sua animao. Clique no ltimo quadro e mude seu smbolo de

    posio na rea de desenho. Se voc arrastar o cursor vermelho pela

    animao voc poder ver como est sua animao. Estando no primeiro

    quadro e pressionando ENTER ele tambm apresenta sua animao. Para ver

    a animao em looping pressione CTRL+ENTER. Para poder andar quadro a

    quadro de sua animao, voc pode pressionar as teclas com sinal de maior

    (>) e menor (

  • 5/21/2018 Apostila Completa Flash Cs5

    41/70

    41

    das duas pontas da linha.

    J com a ferramenta de seleo, voc pode ao aproximar da linha deixar ela

    em curva, e ao selecionar ela mover toda a animao.

    Motion EditorQuando trabalhamos com Motion Tween, podemos manipular a nossa

    animao atravs do Motion editor, aba que fica ao lado da Timeline.

    Esse recurso muito semelhante forma como o Adobe After Effects trabalha,

    atravs do Motion editor podemos trabalhar com posio x e y, rotao z.

    Transformao em Skew.

    Podemos aplicar transformaes de cores como Alpha, Tint, etc., Podemos

    aplicar filtros, opes de Easy (suavizao da animao).

    Voc pode ampliar ou reduzir a sua timeline posicionando o mouse

    na extremidade direita da animao e ao cursor mudar para um

  • 5/21/2018 Apostila Completa Flash Cs5

    42/70

    42

    cursos de flecha de duas pontas pressionar e arrastar. Voc pode tambm

    acrescentar quadros chaves intermedirios, bastando para isso clicar com o

    boto direito na quadro desejado e escolhendo Insert Keyframe e definindo o

    que quer mudar, ou ento pressionando F6.

    Onion SkinQuando se cria uma animao muitas vezes temos a necessidade de ficar indo

    e vindo atravs dos quadros para termos uma idia melhor de como est

    ficando a animao, o que causa uma grande perca de tempo. mas para

    facilitar todo este processo o FLASH possui um processo chamado Onion Skin.

    Com ele podemos editar o quadro atual enquanto observamos o quadro que

    est logo abaixo dele ou at mesmo editar diversos quadros simultaneamente.

    O quadro atual aparece com as cores normais, enquanto os quadros anteriores

    aparecem com as cores apagadas, como se estivssemos sendo vistos atravs

    de uma folha de papel vegetal. Somente o quadro atual pode ser modificado,

    os quadros apagados no podem ser alterados.

    Para utilizar o efeito basta clicar sobre o boto Papel de Transferncia.

    Propriedades da barra de ferramentas do quadroAo selecionar um quadro chave, podemos definir suas propriedades pela barra

    de ferramentas.

    A barra de ferramentas de quadro mostra alguns contedos diferentes de

    acordo com o tipo de Tween que utilizamos.

  • 5/21/2018 Apostila Completa Flash Cs5

    43/70

    43

    Quando o Tween atravs Motion, ele trabalha as propriedades da animao.

    Quando Classic ele trabalha as propriedades do Frame.

    Camadas

    As camadas funcionam no Flash para que possamos trabalhar o empilhamento

    de objetos dentro de nossa animao.

    Atravs das camadas podemos animar nossos objetos de forma independente.

    No podemos ter di objetos animados na mesma camada.

    Para criar uma nova Camada, na janela de Timeline clique no boto New Layer

    no rodap da janela , ou ento pelo menu Insert, Timeline Layer.

    Ao criar uma layer ela automaticamente posicionada acima da Layer

    selecionada. Ns podemos renomear nossas layer, bastando para isso dar um

    duplo clique em seu nome.

  • 5/21/2018 Apostila Completa Flash Cs5

    44/70

    44

    Ao lado da Layer aparecem trs botes . O primeiro deles permite

    ocultar a Layer, o segundo permite travar a layer e o terceiro permite ver a layer

    em forma Outline.

    Ainda sobre a paleta de layers no rodap ao lado do boto de New Layer

    temos mais dois botes, um permite criar uma pasta, esse um recurso til em

    animaes que utilizem muitas layers em situaes distintas, pois permite

    separar elas dentro destas pastas, o terceiro boto permite excluir uma layer

    existente.

    Observe acima que na animao temos duas circunferncias e a vermelha

    aparece sobre a verde devido ordem de empilhamento.

    Camadas GuiaUm dos grandes atrativos da animao com Interpolao possibilidade de

    criar caminhos para a animao do objeto este processo chamado Linha

    Guia.

    Para especificar este caminho existem dois cuidados importantes, quando voc

    cria um smbolo voc pode observar que na parte central do smbolo aparece

    um sinal de mais (+) este sinal deve coincidir com a linha guia.

  • 5/21/2018 Apostila Completa Flash Cs5

    45/70

    45

    O segundo cuidado que a linha dever ser criada na camada da linha guia

    para no ocorrer defeitos na animao.

    Para criar uma camada guia proceda da seguinte forma.

    Crie seu smbolo que dever seguir a guia

    Renomeie a camada caso queira.

    E crie uma nova, ela automaticamente ficar acima.

    Clique na camada de cima com o boto direito e escolha Properties

  • 5/21/2018 Apostila Completa Flash Cs5

    46/70

    46

    Essa janela mostra as propriedades da camada, atravs dela vamos criar

    mascars, podemos definir uma cor diferente para o outline das camadas,

    podemos bloquear a camada e em nosso caso vamos marcar a opo Guide.

    Observe que o cone da guia teve uma mudana, com isso definimos que ela

    uma guia, precisamos agora definir que a camada de baixo ser uma camada

    guiada.

    Arraste a camada de baixo para cima da camada guia puxando um pouco para

    a direita e observe que vai aparecer uma barrinha com uma bolinha na ponta,

    pode soltar o mouse

    Observe que agora o cone da camada guia tambm mudou de forma.

    Clique agora no primeiro frame da camada guia e com o lpis ou com a

    ferramenta linha crie a sua guia.

    Depois crie sua animao tipo Classic Tween. Na camada guia apena

    preencha os frames (F5), no necessrio criar quadros chaves.

    Reforando o que foi dito anteriormente necessrio que os centros

    de seu objeto estejam em cima da linha guia nos quadros chaves de

    sua animao para que ele possa seguir a linha.

    Acima observe a posio do smbolo no primeiro e no ltimo quadro chave.

  • 5/21/2018 Apostila Completa Flash Cs5

    47/70

    47

    MscarasCriar mscaras uma maneira simples de revelar seletivamente partes da

    camada acima ou abaixo da cena. Isso requer marcar uma camada como

    camada de mscara e as camadas abaixo como camadas mascaradas.

    Para criar a sua mscara desenhe ou importe algum objeto para seu palco.

    Crie uma nova camada e desenhe o objeto que vai mascarar o objeto da

    camada de baixo.

    Na camada de cima clique com o boto direito do mouse e escolha MASK.

  • 5/21/2018 Apostila Completa Flash Cs5

    48/70

    48

    Observe que ele deixa visvel somente onde os objetos se interceptam. Veja

    abaixo a rea de edio natural e depois com a mscara aplicada.

  • 5/21/2018 Apostila Completa Flash Cs5

    49/70

    49

    Ao aplicar a mscara as suas camadas so bloqueadas e a camada de baixo

    faz um recuo.

    Essa camada recuada chamada de camada Mascarada (MASKED).

    Caso voc precise alterar algo em sua mscara, ou no objeto que

    est mascarando, necessrio desbloquear a mscara, clicando no

    cone em forma de cadeado.

    Caso voc queira voltar s camadas ao estado normal, necessrio clicarcomo boto direito do mouse na camada e escolher a opo Properties

  • 5/21/2018 Apostila Completa Flash Cs5

    50/70

    50

    Interpolao de FormaA interpolao de forma uma tcnica usada nos efeitos de morfismo que

    podem ser feitos usando-se transformaes de instncias, como rotao,

    redimensionamento ou distoro. Preenchimento, contorno, gradientes e alfa

    so todos atributos que podem ser aplicados na Interpolao de forma.

    Como exemplo bsico inicial, crie um retngulo no palco de seu filme, depois

    crie um quadro chave no quadro 24 e apague o retngulo e desenhe uma

    circunferncia.

    Clique no quadro 1 de sua linha do tempo. Na caixa de propriedades abaixo da

    tela, no campo interpolao onde est none escolha SHAPE, observe que

    na linha do tempo ao invs de aparecer uma cor lils aparece uma core verde-

    claro, isso identifica uma interpolao de forma.

    A interpolao de forma ao contrrio da Interpolao de movimento,

    os objetos no devem ser convertidos em smbolos. Imagens

    vetoriais importadas como, por exemplo, clip-arts em wmf, devem ser

    desmembrados e imagens bitmaps, devem ser traadas.

  • 5/21/2018 Apostila Completa Flash Cs5

    51/70

    51

    Botes

    Na verdade, os botes so clipes de filme interativos compostos por quatro

    quadros. Quando voc seleciona o comportamento de boto para um smbolo,

    o Flash cria uma Linha de Tempo com quatro quadros. Os primeiros trs

    exibem os trs estados possveis do boto, enquanto o quarto defina sua rea

    ativa. Na realidade, a Linha de Tempo no reproduzida, simplesmente reage

    ao movimento do ponteiro s aes, passando para o quadro apropriado.

    Para tornar um boto interativo em um filme, coloque uma instncia do smbolo

    do boto no Palco e atribua aes instncia. Voc pode adicionar aes aos

    botes diretamente no smbolo, ou na linha do tempo, sendo que nesse caso

    necessrio dar um nome de instncia ao smbolo de boto.Cada quadro na Linha de Tempo de um smbolo de boto tem uma funo

    especfica:

    O primeiro quadro o estado UP (Para cima), representa o boto que se r

    visvel ao abrir o filme do flash.

    O segundo quadro o estado OVER (Sobre), representa a aparncia do boto

    quando o ponteiro esta sobre ele.

    O terceiro quadro o estado DOWN (Para baixo), que representa a aparncia

    do boto ao ser clicado.

    O quarto quadro o estado HIT (rea), que defina a rea que responder ao

    clique com o mouse. Essa rea invisvel no filme.

    Ao transformar um texto em boto essa rea devera sempre ser preenchida

    com um objeto como, por exemplo, um retngulo cobrindo o texto para que

    todo o texto fique clicvel.

    CLIPES DE FILME

    Clipes de Filme mais conhecidos como Movie Clips ou somente MC so

    pequenos trechos de animao que funcionam independentes da linha do

    tempo do filme principal. Podem conter sons, controles interativos, instncias

    de outros MCS. Podem ser controlados atravs de botes, por aes de

  • 5/21/2018 Apostila Completa Flash Cs5

    52/70

    52

    quadros, ou por outros MCS, podem ainda ser utilizados na criao de botes

    animados.

    Uma das grandes vantagens dos MCS voc pode edit-los separadamente

    do filme principal, facilitando a organizao da animao, alm de que o MC

    carregado por completo no filme.

    Atualmente embora o Flash possa criar smbolos do tipo grfico, botes e

    clipes de filme, os clipes de filme esto substituindo os demais smbolos em

    sua utilizao.

    Como criar um clipe de filme.

    Desenhe um crculo. Imaginemos que esse circulo venha a ser roda de um

    veculo. Podemos conforme o veiculo se movimentar com a roda gire. Imagine

    agora se isso fosse ser aplicado a um caminho com seis eixos, seriam seis

    crculos sendo animados. Se formos pensar em fazer isso diretamente na

    Timeline, alm do tempo de criao, o filme ficar bem pesado.

    Ento com sua roda desenhada.

    Selecione todos os elementos e converta em Movie Clip. Com isso temos um

    smbolo a ser animado. Se fossemos animar ele na Timeline, bastaria criar os

    quadros chaves e fazer a animao. Como vamos fazer com que eles fiquem

    rodando independente da quantidade de quadros. D um duplo clique no seu

    clipe de filme, selecione tudo novamente e transforme em um novo clipe de

  • 5/21/2018 Apostila Completa Flash Cs5

    53/70

    53

    filme.

    No caso eu nomeei os filmes para pai e filho

    Na minha Timeline criei uma animao de Classic Tween e defini uma rotao

    no sentido horrio de uma volta em 24 frames (1 segundo). Isso dentro do

    Clipe de Filme Pai

    Na Timeline principal temos apenas uma camada com nosso objeto.

    Pressione CTRL+ENTER e veja a animao.

    Cin emtica Inver sa

    Com toda a certeza uma das ferramentas mais esperadas nessa nova verso

    do Flash foi ferramenta de Bones . Ela permite se possa criar um

    esqueleto em seu objeto para que se possa animar seu objeto de forma

  • 5/21/2018 Apostila Completa Flash Cs5

    54/70

    54

    independente. Essa uma ferramenta muito comum em softwares de

    animao tridimensional.

    Para as verses anteriores do Flash existia um PLUG-IN que permitia essa

    conexo.

    Para vermos o funcionamento da ferramenta, desenhe um importe um objeto

    para dentro do Flash. Se o objeto a ser importado for muito complexo, no ser

    possvel criar a cinemtica inversa.

    Crie ento seu desenho

    Selecione a ferramenta Bone Tool e clique onde ser criado o primeiro eixo de

    seu esqueleto.

  • 5/21/2018 Apostila Completa Flash Cs5

    55/70

    55

    Repita o processo para criar as outras partes o esqueleto de seu desenho.

    Crie seu quadro chave mais a frente e pelos ns de sua armadura mude a

    forma de seu desenho, a animao ser criada automaticamente.

  • 5/21/2018 Apostila Completa Flash Cs5

    56/70

    56

    Ao criar sua cinemtica inversa, o Flash vai criar uma camada chamadaarmature, ao clicar no quadro chave dessa layer abre-se as propriedades

    dessa layer.

    Em Easy temos as opes de suavizao dos movimentos da armadura, em

    Option podemos definir em Style se queremos ver os ns de nosso esqueleto

    em forma de wireframe, slido ou somente linhas.

    Motion Presets e spray brush tool

    Motion PresetsOutra grande novidade na verso CS4 do Flash so os Motion Presets, que

    so esquemas de animao prontos.

    O objetivo desses presets so facilitar ao usurio a criao de algumas

    animaes.

  • 5/21/2018 Apostila Completa Flash Cs5

    57/70

    57

    Para que voc possa ter acesso a esses esquemas de animao, clique no

    menu Window, Motion Presets.

    Para que voc possa aplicar o efeito em seu objeto, basta apenas desenhar

    seu objeto ou import-lo, escolher o efeito na janela de efeitos e clicar em

    Apply.

    Automaticamente sero criados os quadros chaves de sua animao.

    Spray Brush ToolA ferramenta Spray Brush Tool funciona de forma semelhante ferramenta

    Deco Tool, mas ao invs de ser utilizada como um lpis ela permite que se

    espalhe um pincel em sua tela.

    A ferramenta est no mesmo grupo da ferramenta Brush.

    Vamos a um exemplo de utilizao da ferramenta

    Crie um movie clip qualquer, no caso foi criado um estrela com uma animao

    de Classic Tween.

  • 5/21/2018 Apostila Completa Flash Cs5

    58/70

    58

    Volte cena principal e clique na ferramenta Spray Brush Tool .

    Na aba de propriedades podemos definir qual ser o smbolo a ser utilizado

    como spray clicando no boto Edit

  • 5/21/2018 Apostila Completa Flash Cs5

    59/70

    59

    Voc pode tambm a largura e altura de seu pince em Scale width e Scale

    heigth.

    Voc pode tambm escalar e rotacionar de forma randmica se u brush.

    Aps definir a forma de seu Brush, basta apenas espalhar o spray em sua tela.

  • 5/21/2018 Apostila Completa Flash Cs5

    60/70

    60

    Aes

    O Flash vem atravs de suas verses se aprimorando cada vez mais como

    ferramenta de criao e desenvolvimento para web e aplicaes ricas. A

    verso CS3 trouxe junto com ela um amadurecimento de sua linguagem de

    programao o ACTIONSCRIPT para a verso 3 que est estruturada como

    uma linguagem madura e utilizando recursos que somente eram comuns a

    linguagens como JAVA, C E C#.

    Um cuidado que se deve ter aqui o tipo de projeto a ser criado, pois

    bem comum, iniciar um projeto de forma errada. Caso voc queira

    um projeto AS2 e tenha iniciado um projeto AS3, clique no meu

    File>Publish Settings>aba Flash e mude na opo ActionScript version.

    O painel AesPara podermos aplicar os cdigos action Script em nosso projeto necessrio

    utilizarmos o painel actions. Voc pode chamar o painel actions atravs do

    menu, window actions, ou atravs da tecla de atalho F9opo recomendada.

    Utilizando o Script AssistPara quem est iniciando no Flash a forma recomendvel para se adaptar a

    utilizao do S atravs do Script Assistance.

    Desenhe um objeto em sua tela e converta-o em smbolo do tipo boto.

    Aps ter convertido seu objeto para smbolo do tipo boto, clique sobre ele e

  • 5/21/2018 Apostila Completa Flash Cs5

    61/70

    61

    pressione F9

    Na janela de actions clique no boto com o sinal de mais (+), depois navegue

    por Global Functions, Timeline Control, goto, clique na opo goto

    No painel de aes vai aparecer na tela de bloco de aes:

    on (release){

    gotoAndPlay(1);

    }

    Explicando o que est escrito

    on (release) o evento que executa a ao, no caso seria ao soltar.

  • 5/21/2018 Apostila Completa Flash Cs5

    62/70

    62

    gotoAndPlay(1)Ao ser executada, no caso v ao quadro 1 e inicie

    Quando se usa o Script Assistance na parte superior abre-se algumas opes

    de mudana em suas actions.

    Estando com a ao gotoAndPlay(1) selecionada as opes na janela so:

    Go to and playV ao um determinado local e inicie;

    Go to and stopV ao um determinado quadro e pare;SceneQual a cena em que deve ocorrer a ao;

    FramePara qual quadro deve ocorrer ao.

    Ao clicar no evento on (release), as opes superiores sero as seguintes:

    Os principais eventos a serem adicionados a botes e Movie Clips so:

    PressAo pressionar;

    ReleaseAo soltar;

    releaseOutsidepressionado sobre o boto e solto fora dele;rollOverrolar sobre;

    rollOutrolar fora;

    dragOverArrastar para cima do boto;

    dragOutArrastar para fora do boto;

    keyPressAlguma tecla pressionada.

    importante lembrar que as opes que foram mostradas acima so

    referentes s aes de Timeline goto.

  • 5/21/2018 Apostila Completa Flash Cs5

    63/70

    63

    Aes bsic as do F lash

    play() Instrui o SWF a reproduzir o filme a partir do ponto onde ele se

    encontra;

    stop()Instrui o SWF a parar o filme;

    gotoAndPlaye gotoAndStop()Instruem o Flash para ir a um determinado

    frame ou cena e continuar (gotoAndPlay) ou parar (gotoAndStop).

    getURLSemelhante funo de link do HTML, como o nome diz, pegue a

    URL, sua sintaxe simples: getURL(http://www.adobe.com.br, _blank);

    importante sempre definir o tipo de janela a ser aberto na action, no

    exemplo a mesma estava _blank, que far o link abrir em uma nova

    janela, caso voc queira que o link abra na mesma janela, ser

    necessrio apenas abrir e fechar aspas.

    As aes que foram apresentadas acima podem ser aplicadas diretamente a

    botes e em quadros em sua Timeline.

    Exemplo de utilizao de actions

    Vamos criar um exemplo simples onde teremos um boto animado do quadro 1ao quadro 30, no quadro 30 ele para, se ele for clicado ele anda at o quadro

    60 e para novamente, se ele for clicado no quadro 60, ele abre o site da adobe.

    Ento crie um objeto qualquer e converta-o em boto.

    Depois crie uma animao de Classic Tween entre os quadros 1 e 30 e 30 e

    60.

    Crie uma nova camada acima de sua camada atua e renomeie ela para AS

    http://www.adobe.com.br/http://www.adobe.com.br/http://www.adobe.com.br/http://www.adobe.com.br/
  • 5/21/2018 Apostila Completa Flash Cs5

    64/70

    64

    Se pressionarmos CTRL+ENTER para ver nossa animao, a objeto ser

    animado conforme foi definido na Timeline, mas precisamos que ele pare nos

    quadros 30 e 60.

    Ento clique no quadro 30 da camada AS e pressione F6 para criar um quadro

    chave

    Clique nesse quadro e pressione F9 para abrir o painel de actions

    Na esquerda do painel de actions, abra a opo Timeline Control e d um

    duplo clique na opo stop.

    Isso far com que ao chegar ao quadro 30 a animao pare. Repita o processo

    no quadro 60.Observe que ao colocarmos aes em quadros os mesmos apresentam junto

    ao quadro um pequeno a, indicando que no frame existem aes.

    Vamos agora acrescentar aes ao nosso boto.

    V at o quadro 30 e clique no seu boto.

  • 5/21/2018 Apostila Completa Flash Cs5

    65/70

    65

    Chame o painel de actions (F9) e d um duplo clique na opo play, isso far

    com que a animao continue.

    V agora ao frame 60 e selecione novamente o boto.

    Na esquerda da tela agora abra a opo Browser/Network, depois de um

    duplo clique na opo GETURL

    Na parte superior da janela de actions, ser necessrio preencher o endereo

    do que deve ser aberto e tipo de janela.

    Vamos fazer tambm com que o boto ao ser clicado nesse quadro inicie

  • 5/21/2018 Apostila Completa Flash Cs5

    66/70

    66

    novamente a animao.

    Clique no bloco de aes na linha de getURL para selecion-la, depois d um

    duplo clique na opo goto na esquerda da janela, automaticamente ser

    acrescentada a nova linha abaixo de getURL.

    Teste a sua animao.

    CENAS

    Podem ser entendidas como partes de uma animao. Cada cena pode conter

    seus prprios objetos/ personagens, e automaticamente se colocam em ordem

    uma aps outras, podem tambm ser chamadas atravs de botes ou atravs

    de aes colocadas diretamente nos quadros.

    Depois de criada a cena podemos nomear as cenas de forma que ela possa

    identificar sua funo dentro da animao. Para criar uma nova cena clique no

    Menu Insert Scene, e para alterar o nome de uma cena Menu Modify, Scene.

    Para um entendimento maior das cenas ser necessrio trabalhar tambm com

    aes.

    Atualmente o uso das cenas tem sido mais restritos a animaes

    Flash para multimdias em CDs, HD, etc., para swfs a serem

    apresentados na WEB, elas vo consumir muito espao, ento ela

    tem sido substituda por aes de carregamentos de filme, por este motivo no

    ser dada uma nfase maior sobre este elemento do Flash.

  • 5/21/2018 Apostila Completa Flash Cs5

    67/70

    67

    PUBL ICA O DO FILME

    A publicao resultado final de seu trabalho no Flash, para publicar o seu

    trabalho, basta apenas clicar no Menu File Publish. O resultado ser um

    documento HTML com o cdigo de insero do para o arquivo swf do Flash.

    Para podermos definir quais as propriedades de nossa publicao, clique no

    Menu File, Publish Settings.

    A primeira guia trs a possibilidade dos formatos a serem definido como projeto

    final de seu trabalho:

  • 5/21/2018 Apostila Completa Flash Cs5

    68/70

    68

    Flash (swf) Este o formato do arquivo de filme como resultado final;

    HTML: Gera o documento HTML de seu filme ;

    GIF: este formato permite gerar de seu filme gifs estticos e gifs animados do

    mesmo, sendo que quando estticos podemos definir qual ser o looping e a

    qualidade final.

    JPG: Permite que seja gerado de sua animao uma imagem em JPG, e

    qualidade de exportao.

    PNG: Permite exportar o filme neste formato que embora seja menos utilizado

    pode ser utilizado para imagens em seu cdigo HTML , o formato padro do

    Fireworks.

    Windows Projector: Aqui podemos gerar um arquivo executvel de seu filme o

    que dispensa a necessidade de plug-ins e do Flash para se visualizar a

    animao , este projetor somente para Windows.

    Macintosh Projector: Funciona da mesma maneira que para o Windows , s

    que para a plataforma MAC.

    A guia Flash permite definir a verso do Flash Player para seu filme, ordem de

    carregamento do filme, verso de actionScript. Em Images and Sounds

    podemos definir a qualidade de sada das imagens e dos arquivos de udio.A terceira opo permite definir as propriedades de seu SWF como

    compresso, incluso de camadas ocultas, incluir metadados, etc.

    Em Advanced podemos gerar um relatrio de publicao, proteger o swf contra

    importao,etc.

  • 5/21/2018 Apostila Completa Flash Cs5

    69/70

    69

    A terceira guia HTML, permite definir para qual sada Flash ser o filme,

    permite detectar a verso do Flash. Dimenses do filme, definir a exibio filme

    (playback), qualidade do filme, modo de janela (Window modo), alinhamento,

    escala do swf no HTML.

  • 5/21/2018 Apostila Completa Flash Cs5

    70/70

    70

    Conc lu so

    Aqui finalizamos o estudo com o Flash CS5. certo que podemos fazer muito

    mais com esta espetacular ferramenta.

    Multibrasil Download -www.multibrasil.net