Macromedia Flash 8




Coordenação de Ensino - Duque de Caxias
Introdução

O Flash 8 é uma ferramenta profissional para
criação elementos para a web.
Dentro dele você pode criar controles de
navegação(menus), logotipos animados e etc
no site. Também é possível criar figuras de
alta qualidade a partir do zero, possibilitando a
aplicação de animações e interações
complexas sem programação de scripts
complicados.


               Coordenação de Ensino - Duque de Caxias
Iniciando o Flash 8





    Para o iniciar, posicione o mouse sobre o botão iniciar e
    clique com o botão esquerdo do mouse. No menu iniciar
    clique em todos os programas, em seguida, posicione o
    curso do mouse sobre a pasta Macromedia e clique no
    ícone do Macromedia Flash 8.




                       Coordenação de Ensino - Duque de Caxias
Área de trabalho do Flash

    Na tela do Flash, teremos a disposição da : Barra
    de Títulos, de Menu, de Ferramentas, de
    Propriedades, de Rolagem, Palco, Linha de
    Tempo e Painéis




                    Coordenação de Ensino - Duque de Caxias
Barra de Título

    Aqui aparecerá o título do Flash e o nome do arquivo que
    está sendo editado. O nome e o número do documento que
    aparecem ao lado equivalem ao número de documentos
    abertos. Observe a figura acima: título do Flash, nome e
    número – Untitled 1.




                      Coordenação de Ensino - Duque de Caxias
Barra de Menu

    A barra de menu é a principal ferramenta,
    pois nela teremos vários menus disponíveis




                 Coordenação de Ensino - Duque de Caxias
Barra de Ferramentas (tools)

    A Barra de
    ferramentas contém
    os principais itens do
    Flash, pois possui
    todas as ferramentas
    necessárias para
    trabalhar com o
    aplicativo. Obs.: é
    importante mantê-la
    visível.




                    Coordenação de Ensino - Duque de Caxias
Linha do Tempo (timeline)

    Barra onde os quadros ficarão dispostos em
    sequência.




                 Coordenação de Ensino - Duque de Caxias
Palco (stage)

    Onde a animação ou imagem é editada.




                 Coordenação de Ensino - Duque de Caxias
Painéis

    Estes painéis auxiliam no trabalho e atribuem certos
    comandos ou efeitos em objetos, documentos ou no palco.

    Para acessar as ferramentas de cada painel, posicione o
    mouse sobre o nome do painel e clique com o botão esquerdo
    do mouse.




                      Coordenação de Ensino - Duque de Caxias
Propriedades

    Este painel exibe as propriedades dos elementos selecionados e das
    ferramentas.




    
     Obs.: Para ativar ou desativar as Barras de ferramentas
    (proprierties), Linha do tempo(timeline e Ferramentas
    (tools), na barra de menu clique em Window e nas opções
    para ocultar ou exibir os painéis




                        Coordenação de Ensino - Duque de Caxias
Criando um novo documento

    Para criar um novo
    documento, clique no
    novo documento, clique
    no menu File e , em
    seguida, escolha a
    opção New ou
    pressione Ctrl+N




                   Coordenação de Ensino - Duque de Caxias
Conhecendo a tela

    Depois de escolhida a opção New, uma janela será aberta,
    onde será possível abrir um arquivo novo

    Ou um modelo através da guia Templates.

    Escolha o tipo de documento que deseja criar e clique no botão.




                        Coordenação de Ensino - Duque de Caxias
Propriedades do documento

    Antes de começar algum projeto no flash,
    primeiramente configure o tamanho do palco. Para
    configurar o palco para trabalhar na Web, a
    configuração será sempre em pixels.




                   Coordenação de Ensino - Duque de Caxias
Propriedades do documento

    Define o tamanho do palco

    Define a cor de fundo do palco

    Define quantos quadros irão passar
    por segundo no filme

    Publica seu filme ou imagem em
    diversos formatos:exe(executável em
    qualquer computador, mesmo que este
    não possua o Flash), gif,mpeg, etc.




                      Coordenação de Ensino - Duque de Caxias
Salvando o documento

    Para salvar o documento, na Barra de Menu clique na opção
    File e em seguida, em Save as... ou pressione Ctrl+Shift+S.

    Obs1: Para salvar as alterações feitas em arquivos já salvos,
    Basta clicar no menu File e, em seguida, na opção Save ou
    Ctrl+S




                       Coordenação de Ensino - Duque de Caxias
Salvando o documento

    Obs 2: A página inicial que
    deverá ser aberta
    primeiramente no seu site,
    deverá ser salva com o
    nome de Index

    Abrirá a seguinte janela:

    Especifique o local onde o
    filme ou imagem será salvo
    e, em seguida, clique no
    botão Salvar.




                       Coordenação de Ensino - Duque de Caxias
Abrindo um documento

    Para abrir um
    documento, basta
    posicionar o mouse
    sobre o menu File e,
    em seguida,
    escolher a opção
    Open ou pressionar
    Ctrl+O.




                  Coordenação de Ensino - Duque de Caxias
Abrindo um documento

                       
                           Depois de escolhida
                           a opção Open, uma
                           janela será aberta.
                           Nela, localize o
                           arquivo, selecione-o
                           e clique no botão
                           Abrir




     Coordenação de Ensino - Duque de Caxias
Ferramentas de Visualização

    No Flash 8 é possível ampliar ou reduzir a
    visualização de um objeto que esteja no palco

    Para isso, será preciso usar ferramentas de
    visualização




                    Coordenação de Ensino - Duque de Caxias
Ferramentas de Visualização

       Confira a função de cada ferramenta

    Hand Tool: Esta ferramenta é usada para mover o palco à
    esquerda, à direita, para cima e para baixo

    Zoom Tool: Esta ferramenta é usada para ampliar e reduzir a
    visualização de um objeto que esteja no palco

    Após a seleção desta opção, observe a seção Options (abaixo na
    barra de ferramentas).




                    Coordenação de Ensino - Duque de Caxias
Ferramentas de Visualização

    Confira a função de cada ferramenta:

       Enlarge: Amplia a visualização. Para utilizá-la, após fazer a
    seleção, posicione o mouse ondo desejar ampliar e clique quantas
    vezes forem necessárias.

       Reduce: Reduz a visualização. Para utilizá-la, após fazer a
    seleção posicione o mouse onde deseja fazer a redução e clique
    quantas vezes forem necessárias




                     Coordenação de Ensino - Duque de Caxias
Ferramentas de Visualização

    Zoom-Pré: Você poderá definir a porcentagem do zoom
    através de uma caixa encontra no canto superior direito
    da tela





    Escolha um valor pré-determinado ou digite o valor
    desejado, sendo que o valor máximo é de 2000%. Após
    digitar ou selecionar o valor, pressione a tecla Enter.




                    Coordenação de Ensino - Duque de Caxias
Ferramentas de Seleção

    O flash 8 possui três ferramentas de seleção, cada
    uma com sua característica.

    Arrow tool:

    Esta ferramenta é utilizada para selecionar
    objetos e deslocá-los sobre o palco.




                    Coordenação de Ensino - Duque de Caxias
Ferramentas de Seleção

    Subselection tool:

    Esta ferramenta permite modificar os objetos através de pontos.
    Esses Pontos de Controle.

    Para modificar um objeto, selecione o contorno de uma ovalcom a
    ferramenta Subselection.

    Lasso Tool:

    É utilizado para selecionar objetos com formas irregulares com essa
    opção, clique em uma posição inicial de seleção e contorne o objeto a
    ser selecionado.




                         Coordenação de Ensino - Duque de Caxias
Retângulos e ovais

    Oval tool: Essa ferramenta é utilizada para desenhar oval.

    Para utilizar essa ferramenta, selecione-a e clique sobre o botão da
    ferramenta encontrado na Barra de Ferramentas.

    Antes de desenhar algo com a ferramenta oval, primeiro configure
    como será o contorno, a cor, etc. A configuração poderá ser realizada
    através da janela de propriedades.




                       Coordenação de Ensino - Duque de Caxias
Retângulos e ovais

    A caixa de propriedades possui algumas opções de
    configurações.

    Confira abaixo algumas delas:

    Defina com estas ferramentas, a cor do contorno, espessura
    e o estilo.




                       Coordenação de Ensino - Duque de Caxias
Retângulos e ovais

    Define a cor da linha.

    Define a cor de preenchimento.

    Define a espessura da linha.

    Define o tipo da linha

    Cria uma linha com estilo e espessura
    personalizada




                    Coordenação de Ensino - Duque de Caxias
Retângulos e ovais

    Rectangle tool: Esta ferramenta é utilizada para
    desenhar oval.

    Para utilizar essa ferramenta, selecione-a e clique sobre
    o botão da ferramenta encontrado na Barra de
    Ferramentas.

    Antes de desenhar o retângulo, primeiro configure como
    será o contorno, a cor, etc. O retângulo poderá ser
    configurado através da janela de propriedades




                    Coordenação de Ensino - Duque de Caxias
Retângulos e ovais

    PolyStar tool: Essa ferramenta é usada para desenhar polígonos e
    estrelas.

    Para utilizar essa ferramenta, selecione-a, clique sobre o botão da
    ferramenta Rectangle (mantenha pressionado) e escolha a opção
    PolyStar tool

    Confira a figura:




                        Coordenação de Ensino - Duque de Caxias
Linhas e Curvas

    Line tool: É uma das ferramentas mais básicas do Flash que desenha
    segmentos retos. Para desenhar, basta clicar no palco, manter clicado e
    arrastar conforme o tamanho desejado da linha.




    Pen Tool: Desenha caminhos retos e suaves curvas através de pontos.




                        Coordenação de Ensino - Duque de Caxias
Linhas e Curvas

    Serve para fazer caminhos Retos e caminhos
    Curvos:

    Figuras




Obs.: para criar uma linha reta aperte a tecla: Shift




                             Coordenação de Ensino - Duque de Caxias
Mão livre

    É possivél fazer desenhos como se estivesse desenhado com as
    próprias mãos. Existem duas ferramentas que possibilitam
    essa ação: Pencil tool, que é o lápis e a Brush tool, que é o
    pincel.

    Pencil Tool: Posicione o mouse no palco, clique e arraste.

    Com a seleção da ferramenta Pencil, a seguinte opção será
    exibida na seção Options, abaixo da barra de ferramentas.




                  Coordenação de Ensino - Duque de Caxias
Mão livre

    Poderá escolher a suavização das linhas que achar mais
    apropriada.

    A opção Straighten desenha linhas quadradas


    A opção Smooth desenha linhas arredondadas.


    A opção link permite o desenho de forma livre.




                       Coordenação de Ensino - Duque de Caxias
Mão livre

    Brusnh tool: Essa ferramenta pode tanto pintar objetos
    como fazer desenhos no palco.

    Com a seleção dessa ferramenta, as seguintes opções serão
    exibidas na seção Options.

    Você poderá escolher a forma que achar mais propriada.




                 Coordenação de Ensino - Duque de Caxias
Mão livre

    Pinta sobre linhas e preechimentos.

    Pinta os preechimentos eu back-ground deixando só a borda.

    Pinta atrás, em áreas vazias deixando as linhas e
    preechimento entactos.

    Quando selecionado, pinta o preenchimento.

    Pintará somente dentro do objeto no qual foi iniciada a
    pintura.




                  Coordenação de Ensino - Duque de Caxias
Transformando objetos

    Com a ferramenta Fill Transform tool           é possível modificar
    o tamanho, a direção ou centro de preenchimento de gradientes ou
    bitmaps inseridos.

    Selecionada clique no objeto preenchido, que ficará com um arco de
    três círculos e um quadrado, cada um tem uma função diferente.




    1- Com este círculo é possível reposicionar o pivô do gradiente,
    podendo mover o ponto de luz do preenchimento por todo o objeto.




                       Coordenação de Ensino - Duque de Caxias
Transformando objetos

    2- Com este quadrado é possível definir a intensidade da luz
    do preenchimento comprimido ou expandido o arco.




    3- Com este círculo é possível definir a intensidade
    da luz como um todo.




                       Coordenação de Ensino - Duque de Caxias
Transformando objetos

    4-Com este círculo é possível rotacionar o gradiente ou
    bitmap


    Já com a ferramenta Free Transform poderemos transformar objetos,
    grupos, instâncias ou blocos de texto livremente. Para isso, crie um
    objeto no palco e, em seguida, clique com o botão direito do mouse sobre
    o mesmo e escolha a opção Free transform e dê um clique.

    Pra alterar a altura ou bitmap ou gradiente, com a ferramenta Free
    Transform, arraste o marcador quadrado para cima ou para baixo da
    figura em destaque.








                         Coordenação de Ensino - Duque de Caxias
Transformando objetos

    Para a alterar altura do bitmap ou gradiente, com a ferramente Free
    transform, arraste o marcador quadrado para cima ou para baixo da
    figura em destaque.

    Para alterar a largura do bitmap ou gradiente, com a ferramenta
    Free Transform, arraste o marcador quadrado ao lado da figura em
    destaque.

    Para girar o bitmap ou gradiente, com a ferramenta Free
    Transform, arraste o marcador imaginário de rotação circular acima
    dos cantos da figura em destaque.




                        Coordenação de Ensino - Duque de Caxias
Alterando cores

    Para alterar a cor, teremos duas ferramentas: a Ink bottle-muda
    a cor das linhas de contorno e a Paint Bucket tool-muda a cor
    de preechimento dos objetos.

    Ink bottle:Pra escolher a cor da linha do contorno de um objeto
    na seção Color, clique na opção Stroke color.

    Paint Buck tool: Para escolher a cor do preenchimento de um
    objeto na seção Color, clique na opção Fill color.




                       Coordenação de Ensino - Duque de Caxias
Cores Pré-definidas
                  
                      O Flash 8 possui um painel de cores
                      pré-definidas. Para utilizá-lo, localize
                      a barra de menu clique na guia
                      Window, em seguida, Designe Panels
                      e finalmente em Color Swatches ou
                      Ctrl+F9
                  
                      Para utilizar qualquer cor, selecione o
                      objeto no palco e selecione a cor
                      desejada, clique na ferramenta Fill
                      Color e clique no objeto que deseja
                      inserir a cor.




    Coordenação de Ensino - Duque de Caxias
Criando cores


    O painel Color Mixer possui várias opções, confira abaixo
    algumas delas:

    Type: Define o tipo do preenchimento.

    Color Value: Define valores para criar (modificar) a
    tonalidade da cor.

    Alpha Value: Define a porcentagem da transparência.

    Esses botões possuem as seguintes funções, respectivamente:




                Coordenação de Ensino - Duque de Caxias
Criando cores,

    Black and White: Selecione preto para o contorno e
    branco para o preenchimento.

     No color: Essa opção fica ativa somente na criação
    de um novo objeto, onde ele é criado sem
    preenchimento e contorno.

    Swap Colors: Faz uma inversão das cores, ou seja,
    o preenchimento passa a ser contorno eu contorno a
    ser preenchimento




              Coordenação de Ensino - Duque de Caxias
Trabalhando com
                preenchimentos

    Pra selecionar
    preenchimentos, use o Painel
    Color Mixer, Que permite
    criar e editar preenchimentos
    de gradientes e outros.

    Adicionando transparência.
    Escolha a porcentagem do
    Alph, que quanto menor,
    maior a transparência.




                      Coordenação de Ensino - Duque de Caxias
Trabalhando com preenchimentos

    Para aplicar um preenchimento de cor sólida usando o
    painel Color Mixer, selecione a opção Solid.




                      Coordenação de Ensino - Duque de Caxias
Obtendo e Apagando cores
 
     O Flash 8 possui duas ferramentas muito úteis: a
     Eraser tool que têm a função de apagar objetos
     encontrados no palco e a ferramenta e a Eyedropper
     Tool que captura um tom de cor. Ela também é
     utilizada para obter a cor, estilo de linha e
     preenchimento de objeto.
 
     Para remover segmentos de traços ou áreas
     preenchidas, utilizamos a ferramente, Torneira, que é
     indicada em options depois de clicar na ferramenta
     Borracha.




            Coordenação de Ensino - Duque de Caxias
Obtendo e Apagando cores
  
      Erase Normal apaga traços e preenchimentos na
      mesma camada
  
      Erase Fills apaga somente preenchimentos. Os traços
      não são afetados.
  
      Erase Lines apaga somente traços. Os preenchimentos
      não são afetados.
  
      Erase Select Fills apaga somente os preenchimentos
      selecionados no momento e, não afeta os traços
      selecionados ou não
  
      Erase Inside apaga somente o preenchimento na qual
      inicia o traço da   borracha.




              Coordenação de Ensino - Duque de Caxias
Inserindo texto

    Se utilizar texto nos filmes do Flash, poderá definir o tamanho, a
    fonte, o espaçamento, a cor e o alinhamento. É possível criar textos
    na vertical e horizontal através da ferramenta texto.

    O padrão do programa é na horizontal . Para alterna essa opção,
    clique no botão da ferramenta Texto e, em seguida, no botão
    Change Orientation of text no Inspetor de Propriedades.




                       Coordenação de Ensino - Duque de Caxias
Inserindo texto

    Horizontal- Texto normal, na horizontal da
    esquerda para direita.




    Vertical, Left to Right- Texto na vertical, da
    esquerda para a direita.




                    Coordenação de Ensino - Duque de Caxias
Inserindo texto

    Vertical, Right to Left- Texto na vertical, direita para a esquerda.




    A ferramenta Texto também é utilizada para colocar blocos de texto no
    palco em uma linha que se expande durante a digitação.

    Para configurar o tamanho, fonte, espaçamento dos caracteres e etc,
    através do Inspetor de propriedades




                        Coordenação de Ensino - Duque de Caxias
Importando arquivos

    É possível importa para o flash arquivos diversos como
    Imagens, Vídeos e outros. Para importar um arquivo na
    barra de menu, clique na guia File e, em seguida, em
    Import. Teremos três opções:

    Import Stage- Importa os arquivos para o palco.

    Import to Library- Importa os arquivos para a biblioteca
    do flash.

    Open External Library- Importa arquivos existentes em
    outra biblioteca.

    Import Video- Importa arquivo de vídeo




                      Coordenação de Ensino - Duque de Caxias
Importando arquivos

    Figura:




                   Coordenação de Ensino - Duque de Caxias
Convertendo Bitmap para Gráfico
               vetorial

    Fazendo essa conversão, da imagem ela irá ficar com o contorno
    bem diferenciado do preenchimento, tornando-se mais nítida e com
    uma melhor aparência. Para fazer essa conversão, selecione o
    bitmap e clique no menu Modify, a seguir, clique em Bitmap e
    escolha a opção Trace Bitmap.

    Abrirá a seguinte janela:




                       Coordenação de Ensino - Duque de Caxias
Convertendo Bitmap para Gráfico
               vetorial

    Color Thereshold ( limite de cor): Ao comparar dois pixels à
    medida que aumentar o valor limite, o número de cores diminuíra.
    O valor pode variar de 1 a 1500.

    Minimum area ( Limite de Área ): Define os pixels ao redor a
    serem considerados na atribuição de cores a um pixel.

    Obs. O valor pode variar de 1 a 1000 pixels.

    Curve Fit ( Ajuste de Curva ): Determina a suavidade dos
    contornos do desenho

    Corner Threshold ( Limite de Ângulo ): Não altera ou suaviza
    os ângulos agudos.




                      Coordenação de Ensino - Duque de Caxias
Réguas

    O Flash 8 possui réguas que auxiliam na hora de desenhar e alinhar
    precisamente os objetos. Para ativá-las, posicione o mouse sobre o menu
    View, dê um clique e, em seguida, sobre a opção Rulers.


    Ao clicar na opção Rulers as réguas

    aparecerão ao redor do palco.




                         Coordenação de Ensino - Duque de Caxias
Réguas

    Para configurar a unidade de medida da régua, clique no menu
    Modify e, em seguida, escolha a opção Document.

    Ao clicar na opção Document uma caixa de diálogo será aberta.
    Nela, configure a unidade através da opção Rulers Units




                       Coordenação de Ensino - Duque de Caxias
Grade
                
                    Com as grades suas
                    animações podem ser
                    editadas com maior
                    precisão. Para ativá-las,
                    posicione o curso do mouse
                    sobre o menu View. dê um
                    clique, em seguida, clique
                    em Grid e escolha a opção
                    Show Grid. Elas poderão
                    ser visualizadas no palco.




Coordenação de Ensino - Duque de Caxias
Alinhando objetos pelas grades
                                  
                                      Para maior precisão dos
                                      desenhos é possível alinhá-
                                      los com as linhas da grade.
                                      Para isso, posicione o curso
                                      do mouse sobre o menu
                                      View e dê um um clique,
                                      em seguida, clique em
                                      Snapping e escolha a
                                      opção Snap to Grid




          Coordenação de Ensino - Duque de Caxias
Alinhando objetos pelas grades

    Com a opção Snap to Grid selecionada é possível alinhar e criar os
    objetos através das grades.




    FREQUÊNCIA DA GRADE: é o tamanho de cada “quadrado” da
    grade. Para mudar essas medidas, clique no menu View, depois
    em Grid e escolha a opção Edit Grid.




                     Coordenação de Ensino - Duque de Caxias
Alinhando objetos pelas grades
                               
                                   Nessa janela você poderá
                                   escolher a cor (Color), a
                                   exibição (Show Grid), o
                                   alinhamento dos objetos
                                   (Snap to Grid), e a
                                   largura/altura da grade (em
                                   destaque).
                               
                                   Ao terminar clique no botão
                                   OK




          Coordenação de Ensino - Duque de Caxias
Alinhamento
                 
                     É possível alinhar as
                     posições dos objetos de
                     diferentes maneiras.
                 
                     Para alinhar objetos,
                     selecione o objeto,
                     posicione o mouse
                     sobre o menu Window
                     e dê um clique em
                     Align




 Coordenação de Ensino - Duque de Caxias
Alinhamento
                   
                       Na janela que abrir, escolha a
                       posição desejada. Isso só será
                       possível se o botão estiver
                       selecionado
                   
                       Cada uma exerce uma função:
                   
                        Esta ferramenta alinha o objeto à
                       esquerda do palco
                   
                        Esta ferramenta alinha o objeto no
                       centro do palco
                   
                         Esta ferramenta alinha o objeto à
                       direita do palco.




 Coordenação de Ensino - Duque de Caxias
Agrupando
                     
                         Para manipular
                         elementos como um único
                         objeto é necessário
                         agrupá-los.
                     
                         1-Selecione os objetos do
                         Palco que deseja agrupar.
                     
                         2- Clique no menu
                         Modify e, em seguida, na
                         opção Group.




Coordenação de Ensino - Duque de Caxias
Desagrupando
                  
                      Desagrupe objetos
                      agrupados. Para
                      desagrupar na barra de
                      menu clique na guia
                      Modify e, em seguida, em
                      Ungroup.
                  
                      Obs.: Para a edição de
                      algum elemento do grupo,
                      dê um duplo clique sobre o
                      objeto.




  Coordenação de Ensino - Duque de Caxias
Camadas (layers)
          
              Para editar uma camada ela deverá estar
              ativa, ou seja, selecionada.
          
              CRIANDO CAMADAS: Para inserir uma
              nova camada, clique no botão Insert
              Layer.

          
              RENOMEANDO CAMADAS: Para
              renomear, dê um clique duplo em cima do
              nome da camada.


           APAGANDO CAMADAS: Para apagar
             uma camada, clique no botão
             delete layer com a camada
             selecionada.

   Coordenação de Ensino - Duque de Caxias
Camadas (layers)
                                                 
                                                     ORGANIZANDO CAMADAS:
                                                     Para melhor organização das
                                                     camadas use uma Pasta de
                                                     maneira que as camadas sejam
                                                     exibidas em forma de cascata.
                                                     Para criar uma pasta clique no
                                                     botão Insert folder
                                                 
                                                     Para inserir uma camada
                         Camada dentro da pasta      dentro da pasta, clique no Layer
                                                     a ser inserido e arraste para
                                                     cima da pasta.



Camada fora da pasta



                           Coordenação de Ensino - Duque de Caxias
Camadas (layers)
                                    
                                        OCULTANDO CAMADAS:
                                        Ao ocultar uma camada os
                                        seus elementos não serão
                                        exibidos. Para ocultar/exibir
                                        todas as camadas, clique no
                                        botão Show/ Hide all
 Obs.: Todas camadas ocultas.           layers e para fazer só em
                                        uma camada, clique sobre o
                                        círculo preto em baixo do
                                        botão Show/ hide all
                                        layers da camada
                                        respectiva.



Obs.: Apenas a camada 2 está
oculta.

                    Coordenação de Ensino - Duque de Caxias
Camadas (layers)
                                       
                                           TRAVANDO CAMADAS: Ao travar
                                           uma camada seus objetos não
                                           poderão ser editados e não será
                                           possível inserir um novo objeto.
                                           Para travar/destravar uma
                                           camada, clique na Bola em baixo do
                                           botão Lock/Unlock all layers da
Todas as camadas estão travadas.
                                           camada respectiva.
                                       
                                           Obs.: Ao travar uma pasta, todas as
                                           camadas existentes nele serão
                                           travadas. Para travar apenas uma,
                                           faça o procedimento acima



 Apenas a camada 2 está travada.



                        Coordenação de Ensino - Duque de Caxias
Cenas
                
                    Para organizar um filme de
                    forma temática é possível
                    usar cenas. Ela é utilizada
                    para organizar o filme
                    tematicamente. Para
                    controlar as cenas
                    existentes no seu filme,
                    clique no menu Window,
                    em seguida, em Other
                    Panels e depois na opção
                    Scene




Coordenação de Ensino - Duque de Caxias
Cenas
                                 
                                     Depois de clicar em Scene abrirá
                                     a seguinte janela (nela estará a
                                     relação das cenas existentes no
                                     filme):
                                 
                                     BOTÕES DE CONTROLE DAS
                                     CENAS: As cenas são exibidas no
                                     filme de acordo com a sequência
Duplica uma cena
                                     da lista Scene.

Adiciona uma cena em branco


Apaga uma cena
selecionada




                   Coordenação de Ensino - Duque de Caxias
Definição de Animação

    Uma animação é uma série de quadros, nde ocorre uma
    mudança entre eles ao longo do tempo. No Flash 8, a
    animação ocorre com as mudanças de quadros sucessivos
    em uma Timeline (linha de tempo), como na figura
    abaixo. Temos dois tipos de animações: a animação quadro
    a quadro e interpolada.




                      Coordenação de Ensino - Duque de Caxias
Animações quadro a quadro

    Essa é a forma básica de animação, onde em cada quadro uma
    nova imagem é criada. É a mais utilizada em animações
    complexas, onde as mudanças de cada quadro devem ser sutis. É
    criada a animação adicionando-se quadros-chaves (keyframes).
    Para adiciona-lo selecione o quadro na linha do tempo onde desejar
    fazer a inserção, em seguida clique no emnu Insert, Timeline e
    escolha a opção Keyframe (pressione) a tecla f6).

    Para visualizar sua animação pressione Ctrl+ Enter.




                     Coordenação de Ensino - Duque de Caxias
Adicionando quadros (frames)

    Para inserir um novo quadro, selecione a posição dele na
    linha do tempo, clique no menu Insert, Timeline e escolha
    a opção Frame (ou pressione a tecla F5).

    Para apagar,, clique com o botão direito do mouse em cima
    do Frame a ser removido e clique na opção Remove
    Frames.




                      Coordenação de Ensino - Duque de Caxias
Limpando quadro-chave
                            
                                Quadro-Chaves são utilizados
                                para editar uma nova posição
                                para o objeto e também para
                                editar a troca de um objeto por
                                outro. Para limpar um Quadro-
                                Chave selecione o quadro a ser
                                excluído, clique no menu
                                Modify, Timeline e, em
                                seguida, clique na opção Clear
                                Keyframe.
                            
                                Logo após, a sua timiline será
                                totalmente zerada




      Coordenação de Ensino - Duque de Caxias
Definições de símbolos

    Símbolos são elementos reutilizáveis que podem ser usados com o
    documento, Após atribuir um objeto como símbolo, ele ficas
    armazenado na biblioteca. A utilização dos símbolos é vantajosa, pois
    não é preciso criar várias vezes o objeto que se repete na animação,
    sendo possível modificar o símbolo inserido sem alterar o original. O
    Flash 8 possui três tipos de símbolos:

    GRAPHIC (símbolos gráficos): São utilizados em imagens estáticas e
    nas peças reutilizáveis de animação, ligadas a linha do tempo.

    BUTTON (símbolos de botões): São utilizados para criar botões
    interativos (em um filme) que responderão a qualquer ação do mouse.




                        Coordenação de Ensino - Duque de Caxias
Definições de símbolos


    MOVIE CLIP (símbolos de clipe de filme): São
    utilizados para criar animações reutilizáveis.
    Esses clipes de filmes possuem sua própria linha
    do tempo do filme principal.




                    Coordenação de Ensino - Duque de Caxias
Criando símbolos
 Abrirá a seginte janela:

                                      
                                          É possível criar símbolos a partir de
                                          objetos selecionados ou símbolos
                                          vazios e importa ou gerar o conteúdo
                                          no modo de edição de símbolos. Eles
                                          podem ter todas as funçoes do Flash
                                          8.
                                      
                                          Convertendo objetos em
                                          símbolos: Para criar um novo
                                          símbolo a partir de um ou mais
                                          objetos, selecione-o, clique no menu
Nela é possível escolher o                Modify e escolha a opção Convert to
 nome e tipo do símbolo                   Symbol ou F8




                     Coordenação de Ensino - Duque de Caxias
Criando símbolos

    Name: Dê um nome para o símbolo pois assim
    ajudará na localização do mesmo na biblioteca.

    Behavior: Selecione o tipo de símbolo

    Para criar símbolos em branco, certifique-se de
    que nada está selecionado. Na barra de menu,
    clique no menu Insert e em seguida clique em
    New Symbol.




                    Coordenação de Ensino - Duque de Caxias
Interpolação de movimento

    A interpolação é utilizada para animar símbolos, sendo aplicada em
    Movie Clips e Gráficos. Move um objeto de um lugar para o outro,
    dimensona, gira, inclina ou muda as definições de cor ou opacidade
    dos objetos.





    Obs: Essa propriedade só será exibida com a camada (layer)
    selecionada.

    Tween: Define o tipo de interpolação.

    Ease: Define a velocidade do movimento giratório.

    Rotate: Define a direção do movimento giratório.



                       Coordenação de Ensino - Duque de Caxias
Layers Guide (camadas guia)

    Usa-se a camada guia para força um símbolo a percorrer um caminho,
    utilizando o caminho na camada guia.

    A camada guia deve estar posicionada acima do objeto a ser guiado pelo
    caminho, que é indicada por um ícone ao lado do nome da camada.

    Para criar o movimento a partir de uma camada guia, crie uma interpolação de
    movimento e uma camada guia através da opção Add Motion Guide.




    Com o Pencil Tool (lápis) ou Pen Tool(caneta) faça o caminho desejado na
    camada Guia.




                           Coordenação de Ensino - Duque de Caxias
Layers Guide (camadas guia)

    Depois de feito o caminho, no primeiro quadro (frame)
    coloque a interpolação no início do caminho. Já no último
    quadro, coloque no final do caminho a ser seguido.




                       Coordenação de Ensino - Duque de Caxias
Camada máscara

    É possível usar máscara para efeitos de luminosidade, transições e
    também criar uma espécie de buraco onde camadas abaixo de uma
    única camada para criar efeitos mais avançados.

    Para inserir uma máscara, posicione o curso do mouse sobre a
    camada em que a oval foi criada, em seguida, clique com o botão
    direito para que um menu seja aberto e depois escolha a opção Mask.

    Obs: A máscara foi criada e para visualizá-la pressione as teclas
    Ctrl+ Enter.

    Quando uma oval passar pelo texto ele será exibido.




                        Coordenação de Ensino - Duque de Caxias
Tweening shape

    Cria efeito de transformação de um objeto em outro, mudança de
    posição, cor, tamanho com a interpolação de formas.

    Para criar uma animação de mudança de Shape, desenhe ou
    insira um objeto no primeiro quadro da animação.




                      Coordenação de Ensino - Duque de Caxias
Criando botões

    Para criar um botão desenhe o objeto, o selecione, clique sobre ele
    com o botão direito do mouse e escolha a opção Convert to
    symbol.

    Feito isso, uma caixa de diálogo será aberta. Nela, selecione a
    opção Button, dê um nome e clique no botão OK para confirma a
    conversão.

    Clique duas vezes sobre o símbolo criado. O modo de exibição
    passará a ser o de símbolos. A linha do tempo exibirá quatros
    quadros consecutivos:Up, Over, Down e Hit. Cada quadro possui
    uma função específica e distinta:




                        Coordenação de Ensino - Duque de Caxias
Criando botões

    Up: Representa quando o mouse não está sobre ele

    Over: Representa quando o mouse está sobre ele.

    Down: Representa o botão ao ser clicado.

    Hit: Área de clique do botão. Essa área não aparecerá no filme.

    AÇÕES: Para inserir ações em botões, com o botão selecionado clique
    em Actions Button, logo acima do Inspetor de propriedades




                        Coordenação de Ensino - Duque de Caxias
Criando botões

    Ao clicar, a janela Actions será aberta:




                         Coordenação de Ensino - Duque de Caxias
Adicionando som ao filme

    Para inserir um som ao
    filme, primeiro importe o
    arquivo Mp3 ou Wav, na
    barra de menu, na guia
    File, clique na opção
    Import e, em seguida,
    Impot to Stage,
    especifique o arquivo e
    clique em Abrir.




                    Coordenação de Ensino - Duque de Caxias
Adicionando som ao filme

    Selecione o quadro que deseja inserir o som. No Inspetor de propriedades
    localize o botão Sound e selecione o arquivo de som a ser utilizado.
    Quando o quadro que foi o arquivo de som for executado, a música
    também será executada





    Effect: Cria efeitos de som como trocas de canais, grades e etc, sendo
    possível personalizar esses efeitos na opção Custom.

    Edit: Um painel de edição do efeito selecionado é aberto.

    Sync: Sincroniza um som à um determinado período.

    Loop: Cria repetições para os sons.




                         Coordenação de Ensino - Duque de Caxias
Adicionando Ações em Quadros
           (frame)

    Para inserir uma ação em quadros, selecione-o(s) e clique em Actions
    frame, logo acima do Inspetor de propriedades.




                        Coordenação de Ensino - Duque de Caxias
Representações na Linha do tempo

    A interpolação Motion possui fundo azul claro


    A interpolação Shape possui fundo verde.


    A linha tracejada indica que não há um quadro (frame) no final


    O quadro (frame) chave é indicado por um ponto preto. Os quadros
    (frames) cinza claro que ficam após o quadro chave.




                       Coordenação de Ensino - Duque de Caxias
Representações na Linha do tempo

    O “a” indica que foi atribuída uma ação ao quadro
    com painel ações


    A bandeira vermelha indica que foi atribuído um
    rótulo ou um comentário (frame label)




                    Coordenação de Ensino - Duque de Caxias
Comentários em quadros

    Para adicionar um comentário a um ou mais
    quadros, selecione-o(s) no Inspetor de
    propriedades e digite o comentário na opção
    Frame Label.




                   Coordenação de Ensino - Duque de Caxias
BIBLIOTECA

     Ao criar um símbolo, importa uma imagem ou som, esses
    objetos são armazenados na biblioteca. Para ativá-la clique
    sobre Window e escolha a opção Library.

    Opções da biblioteca:

    New Symbol- Cria um símbolo novo.

    New Folder- Cria uma pasta onde é possível organizar os
    símbolos.

    Properties- Mostra as propriedades do símbolo selecionado.

    Delete- Debilita um símbolo selecionado na biblioteca




                        Coordenação de Ensino - Duque de Caxias
Publicando (Arquivo Executável)

    Para publicar um arquivo antes é necessário sálva-lo; depois
    clicar sobre menu File e, em seguida, escolher a opção
    Publish Settings




                       Coordenação de Ensino - Duque de Caxias
Publicando (Arquivo Executável)

    Escolha os formatos, se necessário, altere o(s) nome(s) do(s)
    arquivo(s) e clique em Plublish.

    Os arquivos serão salvos na mesma pasta em que 1° arquivo
    (.swf) foi salvo.

    Ícone de um arquivo de extensão. gif.

    Ícone de um arquivo de extensão .jpeg.

    Ícone de um arquivo de extensão .png.

    Ícone de um arquivo de extensão .exe.

    Ícone de um arquivo de extensão .swf.

    Ícone de um arquivo de extensão .html.




                         Coordenação de Ensino - Duque de Caxias

Apresentação de Flash

  • 1.
    Macromedia Flash 8 Coordenaçãode Ensino - Duque de Caxias
  • 2.
    Introdução O Flash 8é uma ferramenta profissional para criação elementos para a web. Dentro dele você pode criar controles de navegação(menus), logotipos animados e etc no site. Também é possível criar figuras de alta qualidade a partir do zero, possibilitando a aplicação de animações e interações complexas sem programação de scripts complicados. Coordenação de Ensino - Duque de Caxias
  • 3.
    Iniciando o Flash8  Para o iniciar, posicione o mouse sobre o botão iniciar e clique com o botão esquerdo do mouse. No menu iniciar clique em todos os programas, em seguida, posicione o curso do mouse sobre a pasta Macromedia e clique no ícone do Macromedia Flash 8. Coordenação de Ensino - Duque de Caxias
  • 4.
    Área de trabalhodo Flash  Na tela do Flash, teremos a disposição da : Barra de Títulos, de Menu, de Ferramentas, de Propriedades, de Rolagem, Palco, Linha de Tempo e Painéis Coordenação de Ensino - Duque de Caxias
  • 5.
    Barra de Título  Aqui aparecerá o título do Flash e o nome do arquivo que está sendo editado. O nome e o número do documento que aparecem ao lado equivalem ao número de documentos abertos. Observe a figura acima: título do Flash, nome e número – Untitled 1. Coordenação de Ensino - Duque de Caxias
  • 6.
    Barra de Menu  A barra de menu é a principal ferramenta, pois nela teremos vários menus disponíveis Coordenação de Ensino - Duque de Caxias
  • 7.
    Barra de Ferramentas(tools)  A Barra de ferramentas contém os principais itens do Flash, pois possui todas as ferramentas necessárias para trabalhar com o aplicativo. Obs.: é importante mantê-la visível. Coordenação de Ensino - Duque de Caxias
  • 8.
    Linha do Tempo(timeline)  Barra onde os quadros ficarão dispostos em sequência. Coordenação de Ensino - Duque de Caxias
  • 9.
    Palco (stage)  Onde a animação ou imagem é editada. Coordenação de Ensino - Duque de Caxias
  • 10.
    Painéis  Estes painéis auxiliam no trabalho e atribuem certos comandos ou efeitos em objetos, documentos ou no palco.  Para acessar as ferramentas de cada painel, posicione o mouse sobre o nome do painel e clique com o botão esquerdo do mouse. Coordenação de Ensino - Duque de Caxias
  • 11.
    Propriedades  Este painel exibe as propriedades dos elementos selecionados e das ferramentas.  Obs.: Para ativar ou desativar as Barras de ferramentas (proprierties), Linha do tempo(timeline e Ferramentas (tools), na barra de menu clique em Window e nas opções para ocultar ou exibir os painéis Coordenação de Ensino - Duque de Caxias
  • 12.
    Criando um novodocumento  Para criar um novo documento, clique no novo documento, clique no menu File e , em seguida, escolha a opção New ou pressione Ctrl+N Coordenação de Ensino - Duque de Caxias
  • 13.
    Conhecendo a tela  Depois de escolhida a opção New, uma janela será aberta, onde será possível abrir um arquivo novo  Ou um modelo através da guia Templates.  Escolha o tipo de documento que deseja criar e clique no botão. Coordenação de Ensino - Duque de Caxias
  • 14.
    Propriedades do documento  Antes de começar algum projeto no flash, primeiramente configure o tamanho do palco. Para configurar o palco para trabalhar na Web, a configuração será sempre em pixels. Coordenação de Ensino - Duque de Caxias
  • 15.
    Propriedades do documento  Define o tamanho do palco  Define a cor de fundo do palco  Define quantos quadros irão passar por segundo no filme  Publica seu filme ou imagem em diversos formatos:exe(executável em qualquer computador, mesmo que este não possua o Flash), gif,mpeg, etc. Coordenação de Ensino - Duque de Caxias
  • 16.
    Salvando o documento  Para salvar o documento, na Barra de Menu clique na opção File e em seguida, em Save as... ou pressione Ctrl+Shift+S.  Obs1: Para salvar as alterações feitas em arquivos já salvos, Basta clicar no menu File e, em seguida, na opção Save ou Ctrl+S Coordenação de Ensino - Duque de Caxias
  • 17.
    Salvando o documento  Obs 2: A página inicial que deverá ser aberta primeiramente no seu site, deverá ser salva com o nome de Index  Abrirá a seguinte janela:  Especifique o local onde o filme ou imagem será salvo e, em seguida, clique no botão Salvar. Coordenação de Ensino - Duque de Caxias
  • 18.
    Abrindo um documento  Para abrir um documento, basta posicionar o mouse sobre o menu File e, em seguida, escolher a opção Open ou pressionar Ctrl+O. Coordenação de Ensino - Duque de Caxias
  • 19.
    Abrindo um documento  Depois de escolhida a opção Open, uma janela será aberta. Nela, localize o arquivo, selecione-o e clique no botão Abrir Coordenação de Ensino - Duque de Caxias
  • 20.
    Ferramentas de Visualização  No Flash 8 é possível ampliar ou reduzir a visualização de um objeto que esteja no palco  Para isso, será preciso usar ferramentas de visualização Coordenação de Ensino - Duque de Caxias
  • 21.
    Ferramentas de Visualização  Confira a função de cada ferramenta  Hand Tool: Esta ferramenta é usada para mover o palco à esquerda, à direita, para cima e para baixo  Zoom Tool: Esta ferramenta é usada para ampliar e reduzir a visualização de um objeto que esteja no palco  Após a seleção desta opção, observe a seção Options (abaixo na barra de ferramentas). Coordenação de Ensino - Duque de Caxias
  • 22.
    Ferramentas de Visualização  Confira a função de cada ferramenta:  Enlarge: Amplia a visualização. Para utilizá-la, após fazer a seleção, posicione o mouse ondo desejar ampliar e clique quantas vezes forem necessárias.  Reduce: Reduz a visualização. Para utilizá-la, após fazer a seleção posicione o mouse onde deseja fazer a redução e clique quantas vezes forem necessárias Coordenação de Ensino - Duque de Caxias
  • 23.
    Ferramentas de Visualização  Zoom-Pré: Você poderá definir a porcentagem do zoom através de uma caixa encontra no canto superior direito da tela  Escolha um valor pré-determinado ou digite o valor desejado, sendo que o valor máximo é de 2000%. Após digitar ou selecionar o valor, pressione a tecla Enter. Coordenação de Ensino - Duque de Caxias
  • 24.
    Ferramentas de Seleção  O flash 8 possui três ferramentas de seleção, cada uma com sua característica.  Arrow tool:  Esta ferramenta é utilizada para selecionar objetos e deslocá-los sobre o palco. Coordenação de Ensino - Duque de Caxias
  • 25.
    Ferramentas de Seleção  Subselection tool:  Esta ferramenta permite modificar os objetos através de pontos. Esses Pontos de Controle.  Para modificar um objeto, selecione o contorno de uma ovalcom a ferramenta Subselection.  Lasso Tool:  É utilizado para selecionar objetos com formas irregulares com essa opção, clique em uma posição inicial de seleção e contorne o objeto a ser selecionado. Coordenação de Ensino - Duque de Caxias
  • 26.
    Retângulos e ovais  Oval tool: Essa ferramenta é utilizada para desenhar oval.  Para utilizar essa ferramenta, selecione-a e clique sobre o botão da ferramenta encontrado na Barra de Ferramentas.  Antes de desenhar algo com a ferramenta oval, primeiro configure como será o contorno, a cor, etc. A configuração poderá ser realizada através da janela de propriedades. Coordenação de Ensino - Duque de Caxias
  • 27.
    Retângulos e ovais  A caixa de propriedades possui algumas opções de configurações.  Confira abaixo algumas delas:  Defina com estas ferramentas, a cor do contorno, espessura e o estilo. Coordenação de Ensino - Duque de Caxias
  • 28.
    Retângulos e ovais  Define a cor da linha.  Define a cor de preenchimento.  Define a espessura da linha.  Define o tipo da linha  Cria uma linha com estilo e espessura personalizada Coordenação de Ensino - Duque de Caxias
  • 29.
    Retângulos e ovais  Rectangle tool: Esta ferramenta é utilizada para desenhar oval.  Para utilizar essa ferramenta, selecione-a e clique sobre o botão da ferramenta encontrado na Barra de Ferramentas.  Antes de desenhar o retângulo, primeiro configure como será o contorno, a cor, etc. O retângulo poderá ser configurado através da janela de propriedades Coordenação de Ensino - Duque de Caxias
  • 30.
    Retângulos e ovais  PolyStar tool: Essa ferramenta é usada para desenhar polígonos e estrelas.  Para utilizar essa ferramenta, selecione-a, clique sobre o botão da ferramenta Rectangle (mantenha pressionado) e escolha a opção PolyStar tool  Confira a figura: Coordenação de Ensino - Duque de Caxias
  • 31.
    Linhas e Curvas  Line tool: É uma das ferramentas mais básicas do Flash que desenha segmentos retos. Para desenhar, basta clicar no palco, manter clicado e arrastar conforme o tamanho desejado da linha.  Pen Tool: Desenha caminhos retos e suaves curvas através de pontos. Coordenação de Ensino - Duque de Caxias
  • 32.
    Linhas e Curvas  Serve para fazer caminhos Retos e caminhos Curvos:  Figuras Obs.: para criar uma linha reta aperte a tecla: Shift Coordenação de Ensino - Duque de Caxias
  • 33.
    Mão livre  É possivél fazer desenhos como se estivesse desenhado com as próprias mãos. Existem duas ferramentas que possibilitam essa ação: Pencil tool, que é o lápis e a Brush tool, que é o pincel.  Pencil Tool: Posicione o mouse no palco, clique e arraste.  Com a seleção da ferramenta Pencil, a seguinte opção será exibida na seção Options, abaixo da barra de ferramentas. Coordenação de Ensino - Duque de Caxias
  • 34.
    Mão livre  Poderá escolher a suavização das linhas que achar mais apropriada.  A opção Straighten desenha linhas quadradas  A opção Smooth desenha linhas arredondadas.  A opção link permite o desenho de forma livre. Coordenação de Ensino - Duque de Caxias
  • 35.
    Mão livre  Brusnh tool: Essa ferramenta pode tanto pintar objetos como fazer desenhos no palco.  Com a seleção dessa ferramenta, as seguintes opções serão exibidas na seção Options.  Você poderá escolher a forma que achar mais propriada. Coordenação de Ensino - Duque de Caxias
  • 36.
    Mão livre  Pinta sobre linhas e preechimentos.  Pinta os preechimentos eu back-ground deixando só a borda.  Pinta atrás, em áreas vazias deixando as linhas e preechimento entactos.  Quando selecionado, pinta o preenchimento.  Pintará somente dentro do objeto no qual foi iniciada a pintura. Coordenação de Ensino - Duque de Caxias
  • 37.
    Transformando objetos  Com a ferramenta Fill Transform tool é possível modificar o tamanho, a direção ou centro de preenchimento de gradientes ou bitmaps inseridos.  Selecionada clique no objeto preenchido, que ficará com um arco de três círculos e um quadrado, cada um tem uma função diferente.  1- Com este círculo é possível reposicionar o pivô do gradiente, podendo mover o ponto de luz do preenchimento por todo o objeto. Coordenação de Ensino - Duque de Caxias
  • 38.
    Transformando objetos  2- Com este quadrado é possível definir a intensidade da luz do preenchimento comprimido ou expandido o arco.  3- Com este círculo é possível definir a intensidade da luz como um todo. Coordenação de Ensino - Duque de Caxias
  • 39.
    Transformando objetos  4-Com este círculo é possível rotacionar o gradiente ou bitmap  Já com a ferramenta Free Transform poderemos transformar objetos, grupos, instâncias ou blocos de texto livremente. Para isso, crie um objeto no palco e, em seguida, clique com o botão direito do mouse sobre o mesmo e escolha a opção Free transform e dê um clique.  Pra alterar a altura ou bitmap ou gradiente, com a ferramenta Free Transform, arraste o marcador quadrado para cima ou para baixo da figura em destaque.  Coordenação de Ensino - Duque de Caxias
  • 40.
    Transformando objetos  Para a alterar altura do bitmap ou gradiente, com a ferramente Free transform, arraste o marcador quadrado para cima ou para baixo da figura em destaque.  Para alterar a largura do bitmap ou gradiente, com a ferramenta Free Transform, arraste o marcador quadrado ao lado da figura em destaque.  Para girar o bitmap ou gradiente, com a ferramenta Free Transform, arraste o marcador imaginário de rotação circular acima dos cantos da figura em destaque. Coordenação de Ensino - Duque de Caxias
  • 41.
    Alterando cores  Para alterar a cor, teremos duas ferramentas: a Ink bottle-muda a cor das linhas de contorno e a Paint Bucket tool-muda a cor de preechimento dos objetos.  Ink bottle:Pra escolher a cor da linha do contorno de um objeto na seção Color, clique na opção Stroke color.  Paint Buck tool: Para escolher a cor do preenchimento de um objeto na seção Color, clique na opção Fill color. Coordenação de Ensino - Duque de Caxias
  • 42.
    Cores Pré-definidas  O Flash 8 possui um painel de cores pré-definidas. Para utilizá-lo, localize a barra de menu clique na guia Window, em seguida, Designe Panels e finalmente em Color Swatches ou Ctrl+F9  Para utilizar qualquer cor, selecione o objeto no palco e selecione a cor desejada, clique na ferramenta Fill Color e clique no objeto que deseja inserir a cor. Coordenação de Ensino - Duque de Caxias
  • 43.
    Criando cores  O painel Color Mixer possui várias opções, confira abaixo algumas delas:  Type: Define o tipo do preenchimento.  Color Value: Define valores para criar (modificar) a tonalidade da cor.  Alpha Value: Define a porcentagem da transparência.  Esses botões possuem as seguintes funções, respectivamente: Coordenação de Ensino - Duque de Caxias
  • 44.
    Criando cores,  Black and White: Selecione preto para o contorno e branco para o preenchimento.  No color: Essa opção fica ativa somente na criação de um novo objeto, onde ele é criado sem preenchimento e contorno.  Swap Colors: Faz uma inversão das cores, ou seja, o preenchimento passa a ser contorno eu contorno a ser preenchimento Coordenação de Ensino - Duque de Caxias
  • 45.
    Trabalhando com preenchimentos  Pra selecionar preenchimentos, use o Painel Color Mixer, Que permite criar e editar preenchimentos de gradientes e outros.  Adicionando transparência. Escolha a porcentagem do Alph, que quanto menor, maior a transparência. Coordenação de Ensino - Duque de Caxias
  • 46.
    Trabalhando com preenchimentos  Para aplicar um preenchimento de cor sólida usando o painel Color Mixer, selecione a opção Solid. Coordenação de Ensino - Duque de Caxias
  • 47.
    Obtendo e Apagandocores  O Flash 8 possui duas ferramentas muito úteis: a Eraser tool que têm a função de apagar objetos encontrados no palco e a ferramenta e a Eyedropper Tool que captura um tom de cor. Ela também é utilizada para obter a cor, estilo de linha e preenchimento de objeto.  Para remover segmentos de traços ou áreas preenchidas, utilizamos a ferramente, Torneira, que é indicada em options depois de clicar na ferramenta Borracha. Coordenação de Ensino - Duque de Caxias
  • 48.
    Obtendo e Apagandocores  Erase Normal apaga traços e preenchimentos na mesma camada  Erase Fills apaga somente preenchimentos. Os traços não são afetados.  Erase Lines apaga somente traços. Os preenchimentos não são afetados.  Erase Select Fills apaga somente os preenchimentos selecionados no momento e, não afeta os traços selecionados ou não  Erase Inside apaga somente o preenchimento na qual inicia o traço da borracha. Coordenação de Ensino - Duque de Caxias
  • 49.
    Inserindo texto  Se utilizar texto nos filmes do Flash, poderá definir o tamanho, a fonte, o espaçamento, a cor e o alinhamento. É possível criar textos na vertical e horizontal através da ferramenta texto.  O padrão do programa é na horizontal . Para alterna essa opção, clique no botão da ferramenta Texto e, em seguida, no botão Change Orientation of text no Inspetor de Propriedades. Coordenação de Ensino - Duque de Caxias
  • 50.
    Inserindo texto  Horizontal- Texto normal, na horizontal da esquerda para direita.  Vertical, Left to Right- Texto na vertical, da esquerda para a direita. Coordenação de Ensino - Duque de Caxias
  • 51.
    Inserindo texto  Vertical, Right to Left- Texto na vertical, direita para a esquerda.  A ferramenta Texto também é utilizada para colocar blocos de texto no palco em uma linha que se expande durante a digitação.  Para configurar o tamanho, fonte, espaçamento dos caracteres e etc, através do Inspetor de propriedades Coordenação de Ensino - Duque de Caxias
  • 52.
    Importando arquivos  É possível importa para o flash arquivos diversos como Imagens, Vídeos e outros. Para importar um arquivo na barra de menu, clique na guia File e, em seguida, em Import. Teremos três opções:  Import Stage- Importa os arquivos para o palco.  Import to Library- Importa os arquivos para a biblioteca do flash.  Open External Library- Importa arquivos existentes em outra biblioteca.  Import Video- Importa arquivo de vídeo Coordenação de Ensino - Duque de Caxias
  • 53.
    Importando arquivos  Figura: Coordenação de Ensino - Duque de Caxias
  • 54.
    Convertendo Bitmap paraGráfico vetorial  Fazendo essa conversão, da imagem ela irá ficar com o contorno bem diferenciado do preenchimento, tornando-se mais nítida e com uma melhor aparência. Para fazer essa conversão, selecione o bitmap e clique no menu Modify, a seguir, clique em Bitmap e escolha a opção Trace Bitmap. Abrirá a seguinte janela: Coordenação de Ensino - Duque de Caxias
  • 55.
    Convertendo Bitmap paraGráfico vetorial  Color Thereshold ( limite de cor): Ao comparar dois pixels à medida que aumentar o valor limite, o número de cores diminuíra. O valor pode variar de 1 a 1500.  Minimum area ( Limite de Área ): Define os pixels ao redor a serem considerados na atribuição de cores a um pixel.  Obs. O valor pode variar de 1 a 1000 pixels.  Curve Fit ( Ajuste de Curva ): Determina a suavidade dos contornos do desenho  Corner Threshold ( Limite de Ângulo ): Não altera ou suaviza os ângulos agudos. Coordenação de Ensino - Duque de Caxias
  • 56.
    Réguas  O Flash 8 possui réguas que auxiliam na hora de desenhar e alinhar precisamente os objetos. Para ativá-las, posicione o mouse sobre o menu View, dê um clique e, em seguida, sobre a opção Rulers.  Ao clicar na opção Rulers as réguas  aparecerão ao redor do palco. Coordenação de Ensino - Duque de Caxias
  • 57.
    Réguas  Para configurar a unidade de medida da régua, clique no menu Modify e, em seguida, escolha a opção Document.  Ao clicar na opção Document uma caixa de diálogo será aberta. Nela, configure a unidade através da opção Rulers Units Coordenação de Ensino - Duque de Caxias
  • 58.
    Grade  Com as grades suas animações podem ser editadas com maior precisão. Para ativá-las, posicione o curso do mouse sobre o menu View. dê um clique, em seguida, clique em Grid e escolha a opção Show Grid. Elas poderão ser visualizadas no palco. Coordenação de Ensino - Duque de Caxias
  • 59.
    Alinhando objetos pelasgrades  Para maior precisão dos desenhos é possível alinhá- los com as linhas da grade. Para isso, posicione o curso do mouse sobre o menu View e dê um um clique, em seguida, clique em Snapping e escolha a opção Snap to Grid Coordenação de Ensino - Duque de Caxias
  • 60.
    Alinhando objetos pelasgrades  Com a opção Snap to Grid selecionada é possível alinhar e criar os objetos através das grades.  FREQUÊNCIA DA GRADE: é o tamanho de cada “quadrado” da grade. Para mudar essas medidas, clique no menu View, depois em Grid e escolha a opção Edit Grid. Coordenação de Ensino - Duque de Caxias
  • 61.
    Alinhando objetos pelasgrades  Nessa janela você poderá escolher a cor (Color), a exibição (Show Grid), o alinhamento dos objetos (Snap to Grid), e a largura/altura da grade (em destaque).  Ao terminar clique no botão OK Coordenação de Ensino - Duque de Caxias
  • 62.
    Alinhamento  É possível alinhar as posições dos objetos de diferentes maneiras.  Para alinhar objetos, selecione o objeto, posicione o mouse sobre o menu Window e dê um clique em Align Coordenação de Ensino - Duque de Caxias
  • 63.
    Alinhamento  Na janela que abrir, escolha a posição desejada. Isso só será possível se o botão estiver selecionado  Cada uma exerce uma função:  Esta ferramenta alinha o objeto à esquerda do palco  Esta ferramenta alinha o objeto no centro do palco  Esta ferramenta alinha o objeto à direita do palco. Coordenação de Ensino - Duque de Caxias
  • 64.
    Agrupando  Para manipular elementos como um único objeto é necessário agrupá-los.  1-Selecione os objetos do Palco que deseja agrupar.  2- Clique no menu Modify e, em seguida, na opção Group. Coordenação de Ensino - Duque de Caxias
  • 65.
    Desagrupando  Desagrupe objetos agrupados. Para desagrupar na barra de menu clique na guia Modify e, em seguida, em Ungroup.  Obs.: Para a edição de algum elemento do grupo, dê um duplo clique sobre o objeto. Coordenação de Ensino - Duque de Caxias
  • 66.
    Camadas (layers)  Para editar uma camada ela deverá estar ativa, ou seja, selecionada.  CRIANDO CAMADAS: Para inserir uma nova camada, clique no botão Insert Layer.  RENOMEANDO CAMADAS: Para renomear, dê um clique duplo em cima do nome da camada. APAGANDO CAMADAS: Para apagar uma camada, clique no botão delete layer com a camada selecionada. Coordenação de Ensino - Duque de Caxias
  • 67.
    Camadas (layers)  ORGANIZANDO CAMADAS: Para melhor organização das camadas use uma Pasta de maneira que as camadas sejam exibidas em forma de cascata. Para criar uma pasta clique no botão Insert folder  Para inserir uma camada Camada dentro da pasta dentro da pasta, clique no Layer a ser inserido e arraste para cima da pasta. Camada fora da pasta Coordenação de Ensino - Duque de Caxias
  • 68.
    Camadas (layers)  OCULTANDO CAMADAS: Ao ocultar uma camada os seus elementos não serão exibidos. Para ocultar/exibir todas as camadas, clique no botão Show/ Hide all Obs.: Todas camadas ocultas. layers e para fazer só em uma camada, clique sobre o círculo preto em baixo do botão Show/ hide all layers da camada respectiva. Obs.: Apenas a camada 2 está oculta. Coordenação de Ensino - Duque de Caxias
  • 69.
    Camadas (layers)  TRAVANDO CAMADAS: Ao travar uma camada seus objetos não poderão ser editados e não será possível inserir um novo objeto. Para travar/destravar uma camada, clique na Bola em baixo do botão Lock/Unlock all layers da Todas as camadas estão travadas. camada respectiva.  Obs.: Ao travar uma pasta, todas as camadas existentes nele serão travadas. Para travar apenas uma, faça o procedimento acima Apenas a camada 2 está travada. Coordenação de Ensino - Duque de Caxias
  • 70.
    Cenas  Para organizar um filme de forma temática é possível usar cenas. Ela é utilizada para organizar o filme tematicamente. Para controlar as cenas existentes no seu filme, clique no menu Window, em seguida, em Other Panels e depois na opção Scene Coordenação de Ensino - Duque de Caxias
  • 71.
    Cenas  Depois de clicar em Scene abrirá a seguinte janela (nela estará a relação das cenas existentes no filme):  BOTÕES DE CONTROLE DAS CENAS: As cenas são exibidas no filme de acordo com a sequência Duplica uma cena da lista Scene. Adiciona uma cena em branco Apaga uma cena selecionada Coordenação de Ensino - Duque de Caxias
  • 72.
    Definição de Animação  Uma animação é uma série de quadros, nde ocorre uma mudança entre eles ao longo do tempo. No Flash 8, a animação ocorre com as mudanças de quadros sucessivos em uma Timeline (linha de tempo), como na figura abaixo. Temos dois tipos de animações: a animação quadro a quadro e interpolada. Coordenação de Ensino - Duque de Caxias
  • 73.
    Animações quadro aquadro  Essa é a forma básica de animação, onde em cada quadro uma nova imagem é criada. É a mais utilizada em animações complexas, onde as mudanças de cada quadro devem ser sutis. É criada a animação adicionando-se quadros-chaves (keyframes). Para adiciona-lo selecione o quadro na linha do tempo onde desejar fazer a inserção, em seguida clique no emnu Insert, Timeline e escolha a opção Keyframe (pressione) a tecla f6).  Para visualizar sua animação pressione Ctrl+ Enter. Coordenação de Ensino - Duque de Caxias
  • 74.
    Adicionando quadros (frames)  Para inserir um novo quadro, selecione a posição dele na linha do tempo, clique no menu Insert, Timeline e escolha a opção Frame (ou pressione a tecla F5).  Para apagar,, clique com o botão direito do mouse em cima do Frame a ser removido e clique na opção Remove Frames. Coordenação de Ensino - Duque de Caxias
  • 75.
    Limpando quadro-chave  Quadro-Chaves são utilizados para editar uma nova posição para o objeto e também para editar a troca de um objeto por outro. Para limpar um Quadro- Chave selecione o quadro a ser excluído, clique no menu Modify, Timeline e, em seguida, clique na opção Clear Keyframe.  Logo após, a sua timiline será totalmente zerada Coordenação de Ensino - Duque de Caxias
  • 76.
    Definições de símbolos  Símbolos são elementos reutilizáveis que podem ser usados com o documento, Após atribuir um objeto como símbolo, ele ficas armazenado na biblioteca. A utilização dos símbolos é vantajosa, pois não é preciso criar várias vezes o objeto que se repete na animação, sendo possível modificar o símbolo inserido sem alterar o original. O Flash 8 possui três tipos de símbolos:  GRAPHIC (símbolos gráficos): São utilizados em imagens estáticas e nas peças reutilizáveis de animação, ligadas a linha do tempo.  BUTTON (símbolos de botões): São utilizados para criar botões interativos (em um filme) que responderão a qualquer ação do mouse. Coordenação de Ensino - Duque de Caxias
  • 77.
    Definições de símbolos  MOVIE CLIP (símbolos de clipe de filme): São utilizados para criar animações reutilizáveis. Esses clipes de filmes possuem sua própria linha do tempo do filme principal. Coordenação de Ensino - Duque de Caxias
  • 78.
    Criando símbolos Abriráa seginte janela:  É possível criar símbolos a partir de objetos selecionados ou símbolos vazios e importa ou gerar o conteúdo no modo de edição de símbolos. Eles podem ter todas as funçoes do Flash 8.  Convertendo objetos em símbolos: Para criar um novo símbolo a partir de um ou mais objetos, selecione-o, clique no menu Nela é possível escolher o Modify e escolha a opção Convert to nome e tipo do símbolo Symbol ou F8 Coordenação de Ensino - Duque de Caxias
  • 79.
    Criando símbolos  Name: Dê um nome para o símbolo pois assim ajudará na localização do mesmo na biblioteca.  Behavior: Selecione o tipo de símbolo  Para criar símbolos em branco, certifique-se de que nada está selecionado. Na barra de menu, clique no menu Insert e em seguida clique em New Symbol. Coordenação de Ensino - Duque de Caxias
  • 80.
    Interpolação de movimento  A interpolação é utilizada para animar símbolos, sendo aplicada em Movie Clips e Gráficos. Move um objeto de um lugar para o outro, dimensona, gira, inclina ou muda as definições de cor ou opacidade dos objetos.  Obs: Essa propriedade só será exibida com a camada (layer) selecionada.  Tween: Define o tipo de interpolação.  Ease: Define a velocidade do movimento giratório.  Rotate: Define a direção do movimento giratório. Coordenação de Ensino - Duque de Caxias
  • 81.
    Layers Guide (camadasguia)  Usa-se a camada guia para força um símbolo a percorrer um caminho, utilizando o caminho na camada guia.  A camada guia deve estar posicionada acima do objeto a ser guiado pelo caminho, que é indicada por um ícone ao lado do nome da camada.  Para criar o movimento a partir de uma camada guia, crie uma interpolação de movimento e uma camada guia através da opção Add Motion Guide.  Com o Pencil Tool (lápis) ou Pen Tool(caneta) faça o caminho desejado na camada Guia. Coordenação de Ensino - Duque de Caxias
  • 82.
    Layers Guide (camadasguia)  Depois de feito o caminho, no primeiro quadro (frame) coloque a interpolação no início do caminho. Já no último quadro, coloque no final do caminho a ser seguido. Coordenação de Ensino - Duque de Caxias
  • 83.
    Camada máscara  É possível usar máscara para efeitos de luminosidade, transições e também criar uma espécie de buraco onde camadas abaixo de uma única camada para criar efeitos mais avançados.  Para inserir uma máscara, posicione o curso do mouse sobre a camada em que a oval foi criada, em seguida, clique com o botão direito para que um menu seja aberto e depois escolha a opção Mask.  Obs: A máscara foi criada e para visualizá-la pressione as teclas Ctrl+ Enter.  Quando uma oval passar pelo texto ele será exibido. Coordenação de Ensino - Duque de Caxias
  • 84.
    Tweening shape  Cria efeito de transformação de um objeto em outro, mudança de posição, cor, tamanho com a interpolação de formas.  Para criar uma animação de mudança de Shape, desenhe ou insira um objeto no primeiro quadro da animação. Coordenação de Ensino - Duque de Caxias
  • 85.
    Criando botões  Para criar um botão desenhe o objeto, o selecione, clique sobre ele com o botão direito do mouse e escolha a opção Convert to symbol.  Feito isso, uma caixa de diálogo será aberta. Nela, selecione a opção Button, dê um nome e clique no botão OK para confirma a conversão.  Clique duas vezes sobre o símbolo criado. O modo de exibição passará a ser o de símbolos. A linha do tempo exibirá quatros quadros consecutivos:Up, Over, Down e Hit. Cada quadro possui uma função específica e distinta: Coordenação de Ensino - Duque de Caxias
  • 86.
    Criando botões  Up: Representa quando o mouse não está sobre ele  Over: Representa quando o mouse está sobre ele.  Down: Representa o botão ao ser clicado.  Hit: Área de clique do botão. Essa área não aparecerá no filme.  AÇÕES: Para inserir ações em botões, com o botão selecionado clique em Actions Button, logo acima do Inspetor de propriedades Coordenação de Ensino - Duque de Caxias
  • 87.
    Criando botões  Ao clicar, a janela Actions será aberta: Coordenação de Ensino - Duque de Caxias
  • 88.
    Adicionando som aofilme  Para inserir um som ao filme, primeiro importe o arquivo Mp3 ou Wav, na barra de menu, na guia File, clique na opção Import e, em seguida, Impot to Stage, especifique o arquivo e clique em Abrir. Coordenação de Ensino - Duque de Caxias
  • 89.
    Adicionando som aofilme  Selecione o quadro que deseja inserir o som. No Inspetor de propriedades localize o botão Sound e selecione o arquivo de som a ser utilizado. Quando o quadro que foi o arquivo de som for executado, a música também será executada  Effect: Cria efeitos de som como trocas de canais, grades e etc, sendo possível personalizar esses efeitos na opção Custom.  Edit: Um painel de edição do efeito selecionado é aberto.  Sync: Sincroniza um som à um determinado período.  Loop: Cria repetições para os sons. Coordenação de Ensino - Duque de Caxias
  • 90.
    Adicionando Ações emQuadros (frame)  Para inserir uma ação em quadros, selecione-o(s) e clique em Actions frame, logo acima do Inspetor de propriedades. Coordenação de Ensino - Duque de Caxias
  • 91.
    Representações na Linhado tempo  A interpolação Motion possui fundo azul claro  A interpolação Shape possui fundo verde.  A linha tracejada indica que não há um quadro (frame) no final  O quadro (frame) chave é indicado por um ponto preto. Os quadros (frames) cinza claro que ficam após o quadro chave. Coordenação de Ensino - Duque de Caxias
  • 92.
    Representações na Linhado tempo  O “a” indica que foi atribuída uma ação ao quadro com painel ações  A bandeira vermelha indica que foi atribuído um rótulo ou um comentário (frame label) Coordenação de Ensino - Duque de Caxias
  • 93.
    Comentários em quadros  Para adicionar um comentário a um ou mais quadros, selecione-o(s) no Inspetor de propriedades e digite o comentário na opção Frame Label. Coordenação de Ensino - Duque de Caxias
  • 94.
    BIBLIOTECA  Ao criar um símbolo, importa uma imagem ou som, esses objetos são armazenados na biblioteca. Para ativá-la clique sobre Window e escolha a opção Library.  Opções da biblioteca:  New Symbol- Cria um símbolo novo.  New Folder- Cria uma pasta onde é possível organizar os símbolos.  Properties- Mostra as propriedades do símbolo selecionado.  Delete- Debilita um símbolo selecionado na biblioteca Coordenação de Ensino - Duque de Caxias
  • 95.
    Publicando (Arquivo Executável)  Para publicar um arquivo antes é necessário sálva-lo; depois clicar sobre menu File e, em seguida, escolher a opção Publish Settings Coordenação de Ensino - Duque de Caxias
  • 96.
    Publicando (Arquivo Executável)  Escolha os formatos, se necessário, altere o(s) nome(s) do(s) arquivo(s) e clique em Plublish.  Os arquivos serão salvos na mesma pasta em que 1° arquivo (.swf) foi salvo.  Ícone de um arquivo de extensão. gif.  Ícone de um arquivo de extensão .jpeg.  Ícone de um arquivo de extensão .png.  Ícone de um arquivo de extensão .exe.  Ícone de um arquivo de extensão .swf.  Ícone de um arquivo de extensão .html. Coordenação de Ensino - Duque de Caxias