23
12º Ano 12º Ano Um projecto Um projecto multimédia multimédia Aplicações Informáticas B Macromedia Flash

12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

Embed Size (px)

Citation preview

Page 1: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

12º Ano 12º Ano

Um projecto Um projecto multimédiamultimédiaAplicações Informáticas B

Macromedia Flash

Page 2: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicaçõ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

Page 3: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 4: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 5: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 6: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 7: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 8: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 9: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 10: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 11: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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)

Page 12: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 13: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 14: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

Painéis lateraisPainéis laterais Para abrir os diversos painéis deve utilizar-se o menu Window.Window.

Nome do painel

Teclas de atalho

Page 15: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 16: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 17: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 18: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 19: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 20: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 21: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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

Page 22: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

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.

Page 23: 12º Ano Um projecto multimédia Aplicações Informáticas B Aplicações Informáticas B Macromedia Flash

FIM