12º Ano 12º Ano
Um projecto Um projecto multimédiamultimédiaAplicações Informáticas B
Macromedia Flash
Apresentação do programaApresentação do programa O Macromedia Flash é uma poderosa ferramenta na criação de materiais multimédia, interactivos e animados. O Flash permite construir desde simples animações, como banners publicitários, até complexas aplicações. Desde sítios para a Web até aplicações interactivas para publicação em CD ou DVD-ROM.
Sítio Sítio WebWeb AnimaçãoAnimação
BannerBanner
Janela de aberturaJanela de abertura Sempre que se inicia o programa aparece uma janela de Boas-vindas que permite várias opções para o início da sessão de trabalho.
Projectos recentesProjectos recentesNovos projectosNovos projectos
Utilizando modelosUtilizando modelos
PublicidadePublicidade
Slide ShowsSlide Shows
QuizQuiz
Barra de menusBarra de menusToolboxToolbox – Barra de Ferramentas de desenho e pinturaTimelineTimeline – Linha de tempoToolbar Main – Toolbar Main – Barra de Ferramentas PadrãoPainéisPainéis – Actions (Acções), Help (Ajuda), Properties (Propriedades)StageStage – Palco PainéisPainéis – Project, Components, Behaviors, Library, etc.
O ambiente de trabalho e seus elementosO ambiente de trabalho e seus elementos
2
Os principais elementos do ambiente de trabalho são:
7
6
1
4
5
3
Noções básicasNoções básicas O Flash produz animações que normalmente se designam de ‘filmes’.
A construção de um filme em Flash subentende o domínio de 5 noções básicas:
FramesFrames (Quadros) – (Quadros) – Comparáveis aos fotogramas de uma película, são instâncias na linha de tempo onde podem ser inseridas imagens, texto, sons, vídeo, etc.
Frame rateFrame rate (Velocidade de visualização) – (Velocidade de visualização) – É a velocidade ou cadência com que os fotogramas, que no Flash são denominados de frames, nos são apresentados.
TimelineTimeline (Linha de tempo) – (Linha de tempo) – Espaço temporal onde se desenrola a animação. Em Flash, a linha de tempo caracteriza-se pela quantidade de frames e pela velocidade de visualização da animação, definindo-se assim a duração do filme.
LayersLayers (Camadas) (Camadas) –– No Flash utilizam-se como que várias películas de filme em simultâneo, que se designam de layers. Cada layer é composta por inúmeros frames com os quais se constrói o filme.
StageStage (Palco) – (Palco) – Espaço físico onde tudo se constrói e conjuga.
TimelineTimeline (Linha de tempo)(Linha de tempo) A Timeline é caracterizada por duas áreas principais:
LayersLayers – – Estão organizadas na vertical e a visualização efectua-se de cima para baixo, de modo a que os objectos se sobreponham uns aos outros consoante a localização da Layer em relação às restantes.
Movimentação –Movimentação – O movimento de um filme efectua-se sempre da esquerda para a direita.
FramesFrames – – Cada quadrícula corresponde a um frame.
Layers (Camadas) O Flash utiliza layers (camadas), compostas por frames, nos quais se pode inserir todo o tipo de objectos, desde imagem a texto, som, vídeo, etc.
As Layers são transparentes, possibilitando a visualização de todos os elementos das layers inferiores. Desta forma permitem o trabalho em cada elemento do filme, facilitando a manipulação de objectos bem como a construção da própria animação.
Esquema do desenho
Um
a la
yer p
or o
bjec
to
Organização das layers na timeline Desenho final
Frames (Quadros) Para cada tipo de utilização aplicada, os frames adoptam uma representação
gráfica diferente que nos permite diferenciá-los.
FramesFrames vazios vazios
FramesFrames estáticos estáticos
KeyframeKeyframe – – (quadro-chave)(quadro-chave)
KeyframeKeyframe vazio vazio
Quadro que permite conter informações / programação.
Graficamente distinguem-se da seguinte forma:
KeyframeKeyframe com com objectos inseridosobjectos inseridos
KeyframeKeyframe com com programaçãoprogramação
Apresentam sempre uma cor de fundo cinzenta e os objectos nunca se alteram. Círculo
preenchidoAparece a letra a
ToolbarToolbar ( (Caixa de ferramentasCaixa de ferramentas))Na Barra de ferramentas podem activar-se diversas ferramentas que nos permitem
desenhar e transformar objectos.
Ferramentas de selecção e manipulação de formas vectoriais.
Ferramentas de desenho.
Ferramentas de configuração da área de visualização.
Ferramentas de configuração dos objectos.
Área de opções/configuração das ferramentas.
No Painel Properties, para cada ferramenta activada, são exibidas opções de configuração.
PainéisPainéis O Flash disponibiliza diversos painéis de tarefas. Os dois principais painéis estão localizados na parte inferior do palco.
Painel Properties (Propriedades)Painel Properties (Propriedades) – Para a maioria das ferramentas da Barra de ferramentas Tools (ferramentas de desenho), o painel disponibiliza opções de configuração.
Painel Painel ActionsActions (Acções) (Acções) – Local onde se define todo o tipo de interactividade num filme, pela inserção de programação. O Flash utiliza uma linguagem própria de programação que se designa de ActionScript.
Painel Painel PropertiesPropertiesO Painel Properties (propriedades) permite configurar a ferramenta activa e
alterar os atributos dos objectos criados. Botão que permite abrir a janela de configuração inicial do filme.A informação que apresenta, indica o tamanho de cada um dos quadros do filme a produzir.
Botão que permite seleccionar a cor de fundo do palco (filme).
Frequência (cadência) de visualização do filme.
Nome atribuído ao novo documento.
Botão que permite aceder ás configurações de exportação final do filme.
Elementos definidos por defeito para o filme. Este filme está a utilizar: Para a visualização – Flash Player 7 Para a programação – ActionScript 2 O profile (perfil) – Default (por defeito/padrão)
Painel Actions O painel Action (Acções) possibilita a inserção de programação.
Janela Actions ToolboxJanela Actions Toolbox (Caixa de acções)
Disponibiliza acções a inserir na programação.As acções estão organizadas por categorias e podem ser inseridas fazendo duplo clique sobre a acção ou arrastando-a para a janela de Script.
1 Botão Botão Show code hintShow code hint Apresenta informações de auxílio sobre a acção em utilização na programação.
9
Janela de ScriptJanela de Script
Espaço onde se inserem as acções que definem a programação.
3
Janela Script NavigatorJanela Script Navigator (navegador de Script)
Permite visualizar todos os objectos, símbolos, Cenas do filme. Pode ser utilizado como forma rápida de aceder à programação de um determinado objecto.
2
Botão Add Action Add Action Adicionar uma acção.
4
Botões Find e ReplaceFind e Replace Permite procurar e Substituir palavras no actionscript.
5
Botão Insert a Target Insert a Target PathPath (inserir um caminho para um alvo) Permite definir a acção para uma determinada instância.
6
Botão Check SyntaxCheck Syntax (verificação da sintaxe).Permite verificar se a programação definida não possui erros de ‘escrita’.
7
Botão Botão Autoformat (auto-(auto-formatação )formatação )Permite formatar o texto do actionscript bem como preencher palavras em falta na programação).
8
Painéis Painéis lateraislaterais Do lado
direito do ambiente de trabalho localizam-se os restantes painéis do Flash.
Botão ExpandirExpandir(▼) / RecolherRecolher(►)
Permitem abrir e fechar o painel.
Neste exemplo, ambos os painéis estão abertos.
1 Opções de gestão Opções de gestão de cor.de cor.
Permite configurar a aplicação de cor a linhas de contorno e ao preenchimento dos objectos.
3
Janela de Janela de pré-visualização do pré-visualização do painel Librarypainel Library
Permite visualizar os objectos inseridos na biblioteca. Caso sejam animações, disponibiliza um botão de Play para activar a animação.
4
SímbolosSímbolos
Para cada tipo de símbolo – gráfico, botão ou animação – o programa atribui um ícone diferente.
5
AnimaçãoAnimação6Folder (pasta) Folder (pasta) 7Imagens do tipo Imagens do tipo Mapa de bitsMapa de bits8Botão (component)Botão (component)9Símbolo gráficoSímbolo gráfico10Trilha de SomTrilha de Som11VídeoVídeo12 Duplicate Duplicate (duplicar)
13
New Folder New Folder (Inserir nova pasta)
14 Properties Properties (propriedades do objecto seleccionado).
15 Delete Delete (Apagar o objecto seleccionado).
16
Nome do painelNome do painel
2
Painéis lateraisPainéis laterais Para abrir os diversos painéis deve utilizar-se o menu Window.Window.
Nome do painel
Teclas de atalho
Iniciar um novo projectoIniciar um novo projectoPara iniciar um novo filme deve proceder-se das seguinte forma:
Escolher, na janela de boas-vindas, o tipo de documento a criar.
Se seleccionarmos Flash Document, o documento padrão que será aberto apresenta um palco com 500 x 400 pixéis.
Utilizando o painel Properties, podem alterar-se as configurações do documento.
Para alterar as configurações do documento deve clicar-se em SizeSize, e abrir-se-á a janela Document Properties
Iniciar um novo projecto - Iniciar um novo projecto - Janela Janela Document PropertiesDocument Properties
Na janela Document Properties podem realizar-se várias configurações.Em qualquer momento se podem alterar as configurações do filme em produção.
Fazer coincidir o tamanho do filme com:- Printer – Papel definido na impressora- Content – Mínimo necessário para conter todos os objectos nele inseridos- Default – Tamanho predefinido (pelo programa ou pelo utilizador)
Cor de fundo do filme
Frequência de visualização de frames por segundo (fps)
A unidade de medida utilizada
Tamanho do filme a produzir (por defeito, em pixéis)
As alterações de configuração do documento para configuração predefinida do programa
Símbolos em FlashSímbolos em FlashO Flash permite atribuir aos objectos a animar uma configuração com características técnicas específicas que designa de Symbols (símbolos).
Um objecto pode ser identificado por três tipos de símbolos diferentes, que irão definir o seu comportamento:
> Movie Clips (filmes / animações) > Buttons (botões) > Graphics (gráficos)
Ao converter um objecto em símbolo, ele é arquivado na biblioteca de arquivo do filme.
Vantagens e características dos símbolos:Vantagens e características dos símbolos:
Sempre que se insere em palco um símbolo em arquivo na biblioteca, insere-se apenas uma instância desse símbolo. Desta forma, permite-se utilizar inúmeras instancias do mesmo símbolo, sendo que apenas existe um ficheiro em arquivo, tornando o documento final muito mais leve.
A utilização de símbolos permite, ainda, a realização de animações e a integração desses símbolos em programação.
AnimaçãoAnimaçãoO Flash permite utilizar duas técnicas de animação.
Tweening MotionTweening Motion Interpolação de movimentoInterpolação de movimento
Tweening ShapeTweening Shape Interpolação de formasInterpolação de formas
É um movimento desenvolvido na layer, com a deslocação de objectos entre dois Keyframes
É um movimento desenvolvido na layer com a transformação de um objecto entre dois Keyframes
Interpolação com problemasQuando aparecer a indicação de animação entre key-frames, representada por uma linha a tracejado em vez da habitual seta, é sinal de que existe um problema com a interpolação.
O movimento é assinalado pela seta que une os dois O movimento é assinalado pela seta que une os dois keyframeskeyframes
AnimaçãoAnimação
*Este tipo de animação utiliza o conceito Tween ou Tweening que deriva da palavra em inglês Between que em
português significa ‘entre’ ou ‘no meio de (dois)’
1 – 1 – Motion TweenMotion Tween* – Animação Interpolada* – Animação Interpolada
O Motion Tween é um movimento que ocorre no meio de dois pontos. Estes pontos são: o ponto de início do movimento e o ponto em que objecto termina o movimento ou em que se lhe adiciona informação que altere o movimento inicial.
Keyframe de fim do movimento
Keyframe de início do movimento
Duração do movimento
Posição inicial do objecto
Posição final do objecto
Animação2 – 2 – Tween ShapeTween Shape – Animação de formas – Animação de formas
O Motion Shape permite transformar um objecto tanto em cor como em forma, mesmo que o objecto não mude de posição no palco.
Keyframe de início do movimento
Keyframe de fim do movimento
Forma e posição inicial do objecto
Forma e posição final do objecto
Duração do movimento
AnimaçãoAnimação3 – 3 – Motion Tween GuideMotion Tween Guide – Guias de animação Interpolada – Guias de animação Interpolada O Motion Tween Guide é um movimento que permite que sejamos nós a definir a
trajectória que o objecto irá descrever.
Para criar um Motion Guide deve-se criar uma layer especial utilizando o menu auxiliar e a opção – Add Motion Guide.
Trajectória desenhada na layer guia
Layer guia
Guardar e Publicar um filmeGuardar e Publicar um filmeO Flash possui uma extensão própria e única (*.fla) para o arquivo de documentos:
Tendo sido concluído o trabalho...
Os documentos guardados com a extensão de gravação (*.fla), permitem guardar todas as definições dos objectos bem como as configurações das animações.
O programa permite que o filme seja publicado, ou seja, que sejam criados os ficheiros necessários para a divulgação do filme por diversos meios
Para publicar um filme deve-se utilizar o menu File e a opção Publish.
FIM