Novos programas de TIC Flash/Dreamweaver. Conceitos e 1º acesso ao FLASH Conceitos e 1º acesso ao DREAMWEAVER Instalação.

Apresentação em tema: "Novos programas de TIC Flash/Dreamweaver. Conceitos e 1º acesso ao FLASH Conceitos e 1º acesso ao DREAMWEAVER Instalação."— Transcrição da apresentação:

1 Novos programas de TIC Flash/Dreamweaver

2 Conceitos e 1º acesso ao FLASH Conceitos e 1º acesso ao DREAMWEAVER Instalação

3 Bibliografia/Webibliografia Flash 4 FCA FLASH MX & 5 FCA “Bíblias” de FLASH MX SAMS/McGraw/… Treinamento DREAMWEAVER MX Básico- Unicamp Macromedia Flash - PUCMinas www.flashkit.com www.criarweb.com Livros de TIC 10º - Planeta das TIC/A. Azul/TICO/… Tutorial de FLASH MX - Macromedia

4 Instalação do STUDIOMX

5 Criação de Páginas Web – Flash Projectos multimédia Animações simples e complexas Conceitos básicos O Flash MX é uma ferramenta de criação de interfaces de navegação para a Web. Integra, interliga e compatibiliza ferramentas para criação e edição de imagens, técnicas de animação, componentes de interface e interactividade. Criação de Web sites com grande riqueza visual, com vídeos, logótipos animados, animações sincronizadas com sons, etc.

6 Objectivos Reconhecer as potencialidades do programa para realização de projectos multimédia. Descrever as principais características do programa. Utilizar adequadamente as ferramentas de desenho. Manipular imagens. Aplicar elementos de animação simples e complexa. Proceder à publicação do site num servidor Web. Criação de Páginas Web – Flash

7 Como Iniciar o programa Flash MX  Clicar sobre o botão Iniciar.    Seleccionar a opção Todos os programas e, em seguida, Macromedia. Seleccionar Macromedia Flash MX 2004.

8 Criação de Páginas Web – Flash Começar a trabalhar Seleccionar Create New e, em seguida, Flash Document.

9 Criação de Páginas Web – Flash Ambiente de trabalho Barra de desenho Níveis Barra do tempo Área de painéis Área de trabalho (palco) Lista de componentes Área de propriedades              

10 Criação de Páginas Web – Flash Barra de Ferramentas Padrão Encaixar objectos (íman) Suavizar linhas e contornos Endireitar linhas e contornos Rodar objectos Redimensionar objectos Alinhar objectos            

11 Criação de Páginas Web – Flash Barra de Ferramentas de Desenho           Seleccionar, mover e redimensionar objectos Seleccionar objectos Desenhar linhas rectas ou curvas com grande precisão, manipulando os ângulos associados Modificar a cor, espessura e estilo dos contornos Colorir áreas vazias ou delimitadas Mão que permite movimentar objectos na área de trabalho Área de opções Transformar objectos (orientação, forma, etc.) Alterar o gradiente de um objecto Controlo das cores dos contornos e preenchimentos          

12 Criação de Páginas Web – Flash Área de opções das várias ferramentas

13 Criação de Páginas Web – Flash Cores Para alterar as cores dos fundos ou linhas utiliza-se o painel Color Mixer, que se encontra na parte superior direita da janela. Cor da linha Cor de preenchimento Cor por defeito: linha preta e preenchimento branco Definir linha ou preenchimento transparente Trocar as cores da linha e do preenchimento Tipo de preenchimento Espectro de cores Definir escala de cores Transparência da cor Controlo de brilho e luminosidade                   

14 Criação de Páginas Web – Flash Tipos de texto Dinâmico Entrada Estático Texto que se mantém inalterável durante todo o filme. Caixa de texto cujo conteúdo sofre alterações ao longo do filme como, por exemplo, a actualização de dados da meteorologia. Texto inserido pelo utilizador, por exemplo, no preenchimento de formulários. Esses formulários são criados com texto de entrada, atribuindo-se a cada caixa de texto um nome.

15 Criação de Páginas Web – Flash Símbolos São uma espécie de minifilmes independentes, que podem conter sons, animações, botões, etc. Têm uma linha de tempo totalmente independente da do filme principal. Qualquer objecto que cries deve ser convertido em símbolo. Posteriormente, podes usá-lo várias vezes no filme para o qual foi criado e também noutros documentos. Imagens estáticas que serão reutilizadas ao longo do filme e que estão em sincronia com a linha de tempo do filme principal. São objectos que reagem aos cliques do rato. Têm uma linha de tempo própria com quatro frames (Up, Over, Down, Hit). Imagens Botões Clips de filme

16 Criação de Páginas Web – Flash Tipos de sons que podemos incorporar nos filmes WAV (.wav) Audio Interchange File Format (.aif) MP3 (.mp3) Sons de evento Sons associados a determinado evento. Sons de fluxo Sons sincronizados com determinados objectos do filme. Pode-se trabalhar com vários formatos de ficheiros de sons. Por exemplo:

17 Criação de Páginas Web – Flash Vídeos Não fazem parte integrante do filme, mas o Flash mantém um apontador para eles. Estes filmes não são visualizados no formato.swf. São publicados no QuickTime. Um vídeo é um dos elementos mais pesados que pode ser incorporado num filme, pois ele próprio contém imagens, sons, texto, animações, etc. Importação de vídeos – Os vídeos podem ser inseridos no Flash de duas formas: Incorporados (embed) Fazem parte integrante do filme. Ligados (link)

18 Criação de Páginas Web – Dreamweaver Macromedia Dreamweaver Planeamento de um Web site Construção de um Web site Conceitos básicos O Dreamweaver permite a criação de páginas Web utilizando o sistema What You See Is What You Get (WYSIWYG). Não é necessário conhecer linguagens de programação para elaborar uma página. O aspecto da página no ambiente de trabalho do Dreamweaver é o aspecto que esta terá no final.

19 Criação de Páginas Web – Dreamweaver Objectivos Criar, abrir e guardar documentos HTML. Utilizar ferramentas de desenho. Identificar os componentes da área de trabalho. Inserir e manipular objectos. Trabalhar com formulários. Manipular e formatar texto e objectos nas páginas. Adicionar hiperligações.

20 Criação de Páginas Web – Dreamweaver Como Iniciar o Dreamweaver Clicar sobre o menu Iniciar.    Seleccionar a opção Todos os programas e, em seguida, Macromedia. Seleccionar Macromedia Dreamweaver MX 2004.   

21 Criação de Páginas Web – Dreamweaver 1º acesso ao Dreamweaver

22 Criação de Páginas Web – Dreamweaver Iniciar o Dreamweaver Seleccionar no menu File a opção New.    Em Category seleccionar a opção Basic Page. Em Basic Page seleccionar a opção HTML. Clicar sobre Create.    

23 Criação de Páginas Web – Dreamweaver Painel de propriedades Painéis Área de trabalho Neste painel pode-se formatar todas as propriedades associadas a um objecto.

24 Criação de Páginas Web – Dreamweaver   Identificação da página aberta   Visualização do código   Visualização do código e do projecto   Visualização do projecto   Título do documento   Depuração e visualização de erros   Gestor de ficheiros   Visualização da página no browser   Actualização da página   Opções de visualização

25 Criação de Páginas Web – Dreamweaver Painéis de Objectos  Inserir hiperligações em texto    Inserir hiperligações para caixas de e-mail Inserir tabelas   Inserir imagens e desenhos   Inserir elementos multimédia   Inserir frames   Inserir formulários   Inserir linhas de formulário   Inserir botões   Inserir e formatar texto