Aula CEV.pdf

6
 Aula 01 - Criando um Game de Tir o  INTRODUÇÃO Neste curso bordaremos os conceitos básicos de download da versão de av aliação gratuita do  Adobe Flash CS3, e as noções básicas de usar o Flash como uma ferramenta de desenvolvimento de de jogos. O objetivo é orientar os desenvolvedores de jogos aspirantes, que não tem conhecimento do  Adobe flash e nenhum conhecimento de programação. Vamos construir um simples side- scrolling shooter (jogo de tiro com movimentação vertical. Aqueles que concluírem as aulas terão as habilidades básicas necessárias para começar a desenvolver os seus próprios jogos em flash simples. Usaremos o Adobe Flash CS3 e ActionScript 2.0 Caso você não tenha o Adobe Flash precisará baixá-lo para isso acesse o link abaixo e baixe a versão Trial. http://www.adobe.com/products /flash.html  será necessário criar uma conta na Adobe, baixar o aplicativo e instalá-lo em sua maquina. Feito isso seguimos. Depois instalado o flash, você verá algo semelhante a isto:  A partir das novas opções, selecione Arquivo Flash (ActionScript 2.0). Isto irá criar um novo arquivo Flash. Arquivos Flash tem uma extensão fla. Este é o arquivo no qual você vai desenhar gráficos, criar animações de linha de tempo, e publicar um jogo no final deste curso. O arquivo do jogo que você publica do fla terá uma extensão swf.

Transcript of Aula CEV.pdf

Page 1: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 1/6

 Aula 01 - Criando um Game de Tiro 

INTRODUÇÃO

Neste curso bordaremos os conceitos básicos de download da versão de avaliação gratuita do Adobe Flash CS3, e as noções básicas de usar o Flash como uma ferramenta de

desenvolvimento de de jogos.

O objetivo é orientar os desenvolvedores de jogos aspirantes, que não tem conhecimento do Adobe flash e nenhum conhecimento de programação. Vamos construir um simples side-scrolling shooter (jogo de tiro com movimentação vertical. Aqueles que concluírem as aulasterão as habilidades básicas necessárias para começar a desenvolver os seus próprios jogosem flash simples.

Usaremos o Adobe Flash CS3 e ActionScript 2.0

Caso você não tenha o Adobe Flash precisará baixá-lo para isso acesse o link abaixo e baixe aversão Trial.http://www.adobe.com/products/flash.html  será necessário criar uma conta na Adobe, baixar o

aplicativo e instalá-lo em sua maquina. Feito isso seguimos.

Depois instalado o flash, você verá algo semelhante a isto:

 A partir das novas opções, selecione Arquivo Flash (ActionScript 2.0). Isto irá criar um novo

arquivo Flash. Arquivos Flash tem uma extensão fla. Este é o arquivo no qual você vaidesenhar gráficos, criar animações de linha de tempo, e publicar um jogo no final deste curso.O arquivo do jogo que você publica do fla terá uma extensão swf.

Page 2: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 2/6

 Um arquivo fla tem vários Componentes UI:

Vamos discutir cada componente em detalhe.

O palco é o principal espaço de trabalho do fla. Você pode importar gráficos para o palco,desenhar gráficos vetoriais no palco usando as ferramentas de desenho e organizar fotos etexto. O tamanho da fase irá determinar o tamanho do SWF que publica. Você pode definir otamanho do palco no painel de propriedades, logo abaixo do palco.

O tamanho default de novos projetos é 550X400 pixels. Se vier a publicar um swf agora, nósteríamos um swf em branco que é de 550 pixels de largura e 400 pixels de altura.

Vamos testar o menu do aplicativo acima da linha do tempo, selecione:

Control> Test Movie (CTRL + ENTER)

Page 3: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 3/6

 

Isto irá publicar nosso fla e criar um swf. O swf vai aparecer frente e no centro. É apenas umswf branco que não faz nada. Mas com um pouco de arte e um pouco de código, você podetransformar este swf branco em um jogo Flash.

Sempre que você quiser ver como ficará o seu projeto do Flash na sua forma final, apenasteste seu filme usando Control> Test Movie. Você também pode escolher a partir do menu Arquivo> Publicar ou File> Publish Preview para criar um swf do seu fla.

A TIMELINE

O que é realmente surpreendente sobre programas como o Flash é sua capacidade derepresentar o tempo como um objeto gráfico, algo que pode ser manipulado com o clique deum mouse. A seção de linha de tempo da janela do projeto exibe cada quadro do seu projeto

como um quadrado colorido codificado dentro de uma grade numerada. (veja a ilustraçãoabaixo). fla.

Molduras e Quadros-chaveQuadros contem conteúdo que o público vai ver na animação. Cada quadro representa ummomento de tempo em uma animação.

Os retângulos da esquerda são exemplo de quadros. Toda quinta moldura aparece cinza,tornando-os fáceis de contar num ápice. O quadrado vermelho é a sua cabeça. Arrastando-ocom o mouse permite que você "movimente" através de seu projeto, visualizando-o como vocêtrabalha, simulando o processo de animação.

Um quadro-chave representa um ponto na linha do tempo, onde uma mudança ocorre naanimação. (a mudança pode ser adicionar conteúdo, subtrair conteúdo, mudança de posiçãode um objeto, etc)

Page 4: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 4/6

 Estes são exemplos de quadros-chave.

Os quadros-chave na camada superior são pontos pretos sólidos, dizendo que eles contêmobjetos. O quadro-chave na camada inferior é um ponto branco, o que significa que ele está embranco.

O quadro-chave à esquerda na camada superior é um quadro de comprimento, enquanto o dadireita na camada superior é de oito quadros de comprimento.

Para trabalhar com o conteúdo de um determinado quadro-chave, clique em seu primeiroquadro (aquele com o ponto preto). Ele agora está selecionado e seu conteúdo aparecerá nopalco.

Para adicionar um quadro-chave em branco: 

1. Clique em uma seção da linha do tempo.2. Pressione F7 ou escolha Inserir> Linha do tempo> Quadro-chave embranco.

Para estender um quadro-chave: 

1. Selecione um quadro-chave, um ponto preto de um ou um ponto branco um,clicando sobre ela,

2. Arraste o mouse esquerda e direita para fazer o quadro-chave mais longoou mais curto.

3. Um longo quadro-chave pode ser dividido em keyframes menores com

conteúdo idêntico. O corte pode ocorrer em qualquer quadro dentro do quadro-chave.Para dividir um quadro-chave: 

1. Decida qual quadro-chave que você deseja dividir.

2. Escolha no quadro em que deseja dividir, movendo a cabeça dereprodução. Este será o primeiro quadro do segundo quadro-chave.

3. Pressione F6 ou escolha Inserir> Linha do tempo> Quadro-chave

 Arrastando e reorganizando keyframes: 

1. Mova o cursor do mouse sobre um quadro-chave completo; o ponteiro terá

um retângulo arrastando-o.2. Clique com o mouse e arraste o quadro para onde você quiser. Ele podemover para a esquerda e para a direita, e entre as camadas.

O PAINEL BIBLIOTECA

Page 5: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 5/6

 

Símbolos e InstânciasUm símbolo é um objeto auto-contido dentro de uma animação em Flash que pode ser usadovárias vezes. Isto é muito útil para fazer alterações em toda a animação. Digamos que vocêestá animando a imagem de um foguete, e o mesmo foguete aparece em 30 quadrosdiferentes.

Se você decidir mais tarde que o seu foguete precisa ser azul em vez de vermelho, ou quetenham as palavras "Vai Brasil" estampada na lateral, imagine o que você deve fazer se cadafoguete é uma coleção de linhas e preenchimentos. 30 quadros devem ser alteradosindividualmente e perfeitamente! Você pode muito bem desistir e começar de novo, a menos

que seu foguete é um símbolo! Através da criação de uma imagem como um símbolo, você criauma "cópia master", que fica na biblioteca do seu projeto. Fazer alterações para o símbolomestre afetará todas as suas instâncias todo o seu projeto Flash.

Para criar um símbolo a partir de uma imagem que você já elaborado: 

1. Selecione todos os elementos da imagem que você deseja fazer parte desua instância. Utilize o letreiro retangular, o laço, ou clique em elementos, mantendopressionada a tecla SHIFT.

2. Escolha Modificar> Converter em símbolo da barra de menu.

3. Dê o seu símbolo um nome e selecione seu tipo (símbolos gráficos são osmais básicos). Para uma descrição dos tipos de símbolos, clique aqui.

4. O novo símbolo agora deve residir em sua Biblioteca.

Para criar um novo símbolo a partir do zero: 

1. Escolha Inserir> Novo símbolo na barra de menu.

2. Dê o seu símbolo um nome e selecione seu tipo.

Tipos Símbolo: 

Símbolos vêm em três variedades:

Clipe de filme: Os clipes de filme são geralmente utilizados por usuários avançados do Flash para criaranimações que podem iniciar e parar de forma interativa. Um clipe de filme de animação vai

Page 6: Aula CEV.pdf

7/25/2019 Aula CEV.pdf

http://slidepdf.com/reader/full/aula-cevpdf 6/6

 jogar de forma contínua, mesmo se ele é colocado em um projeto apenas um quadro decomprimento.

Gráfico: Este é o seu símbolo básico Flash. Sua animação é dependente de cronograma do projeto.

Isto significa que se um símbolo gráfico é de 35 quadros de comprimento, e é colocado em um

projeto apenas 24 quadros por muito tempo, a animação do símbolo irá reiniciar no quadro 24.

Button: Os botões são usados para fornecer interatividade. Eles são símbolos com quatro quadros,

um para cada estado do botão - Up, Over, Down e Hit que correspondem ao uso do mouse.

Próxima aula falaremos sobre as ferramentas do Adobe Flash, ferramentas estas que nosauxiliarão no desenvolvimento de nosso game.

 Até a próxima aula.