Este documento fornece instruções passo-a-passo para criar um site simples no Flash, incluindo: 1) criar camadas e layout básico; 2) adicionar conteúdo aos frames usando Movie Clips; 3) adicionar botões na camada menu para navegar entre os frames.

1. Flash
Criando meu 1º site
Isaac Batista

2. Passo 1 - Criando o Layout e as camadas principais
– Abra um novo arquivo no Flash com o tamanho do palco de
550x400;
– Renomeie a camada layer 1 para layout;
– Na camada Layout, crie um retângulo (sem borda e com
preenchimento) de 118x400, nas posições x=0 e y=0;
– Na mesma camada, faça outro retângulo de 432.9x51
pixels, nas posições x=118 e y=0;
– Crie agora uma nova camada e renomeie-a para título,
clique no frame 1e escreva um título para o site;
– Crie, na sequência, as seguintes camadas posteriores:
• Menu
• Conteúdo
• Ações
– Veja o resultado até aqui no próximo slide

3. Passo 1 - Criando o Layout e as camadas principais:
Resultado

4. Passo 1 - Explicação
Até aqui você fez o layout da página, organizou
as camadas e fez as configurações iniciais. Nos
passos a seguir, veremos como adicionar
conteúdo e a fazer as configurações finais.

5. Passo 2- Configurações das camadas e dos Movie Clips
– Bloqueie as camadas layout, título, menu e ações;
– Clique no frame 1 da camada conteúdo e insira um retângulo com
as seguintes dimensões: 433x350 pixels, nas posicões: x=118.1 e
y=50.3;
– Clique também no frame2, tecle F6, selecione o quadrado e troque
sua cor;
– Faça isso também com os frames 3 e 4;
– Volta agora até o frame 1 e o converta em Movie Clip;
– Selecione-o e dê 2 cliques nele;
– Dentro deste Movie Clip, renomeie a camada Layer1 para fundo, a
bloqueie; crie mais uma com o nome de título-conteúdo e mais
outra com o nome de conteúdo, pois será aí que iremos inserir os
textos;
– Após ter criado o primeiro movie clip, volte para o palco inicial e
repita o processo de criação dos movie clips nos frames 2,3 e 4,
colocando neles os seguintes nomes: conteúdo 2, conteúdo 3 e
conteúdo 4.

6. Passo 2 - Configurações nas camadas e dos Movie
Clips: Resultado das etapas 1 a 4
1. Visualização das Camadas
– Visualização do Painel Library

7. Passo 3 - Configurações Finais e Ações das Camadas
– Prolongue as camadas fundo, menu, título e ações até o
frame 4;
– Selecione o primeiro frame da camada ações, vá até o
painel Actions>Global Functions>Time Line Control>stop.
– O filme do Flash ficará parado no Frame 1 de todas as
camada
– Bloqueie agora as camadas ações, conteúdo, título e fundo,
como mostrado abaixo.
– Passe para o próximo passo.

8. Passo 4 - Criação dos Botões
Criando o botão
– Clicar no primeiro frame da camada menu;
– Criar um retângulo de 110x40 pixels, nas posições com a
ferramenta Retangle Tool;
– Selecionar o quadrado>Botão direito do mouse>Convert To Symbol;
– Colocar um nome e escolher o tipo button;
– Clicar duas vezes no símbolo que acabamos de converter.
– Agora, depois de estar-mos dentro do botão, aparecerá uma
camada nova e os estados do botão: Up, Over, Down e Hit.
• Renomeie esta camada para efeitos;
• Vá até o segundo frame e troque a cor do retângulo;
• Vá também ao terceiro frame e toque a cor do retângulo;
– Agora crie uma camada e a renomeie para texto, e
– Clique no primeiro frame e escreva um texto sobre o
retângulo.
– Teste o filme.
–

9. Passo 4 - Criação dos Botões
Duplicando o botão
– Abrir o painel Library (Menu Window > Library)
– Selecionar o botão criado;
– Clicar com o botão direito e:
• escolher a opção duplicate,
• colocar o nome do segundo botão,
• deixar marcado a opção button, e
• Clicar em OK.
– Pronto. Arraste o novo botão para o palco, clique duas
vezes nele e troque o texto do botão.
– Teste o filme.

10. Passo 5 - Ações nos Botões
Adicionando Ações
– Selecione o primeiro botão da camada menu;
– Vá até o painel Actions e digite as seguintes linhas de códigos:
– Ou Vá até o Painel Actions>Botão Script Assist>TimeLine
Control>Goto

11. Passo 5 - Ações nos Botões
Adicionando Ações
4 . Selecione a opção Go To And Stop e a Opção Frame 1. Pois
quando se clicar no botão vai disparar a ação de ir (Go To) e parar
(Stop) no frame 1, exibindo seu conteúdo, onde estão os Movie Clips
com as cores diferentes.
5. Pronto. Agora basta clicar nos outros botões e colocar a ação acima, para
exibir os conteúdos dos frames 2, 3 e 4.