Recriando Space Invaders no Construct - Parte 1

Nesta série de artigos vamos recriar o clássico Space Invaders.

Publicado em

Nesta série de matérias, será apresentado como recriar o Game Space Invaders, o Game será bem simples, pois o intuito aqui é apresentar a ferramenta e os caminhos para se alcançar o resultado final de um Game.

Para quem não conhece, Space Invaders é um Game lançado em 1978 pela Taito Corporation, do gênero de tiro, com o objetivo de destruir inimigos alienígenas através de uma nave. Como você já deve imaginar, naquela época os gráficos não era bons, comparado com o que temos hoje, mas é claro que para quem jogava, adorava e não reclamava.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Para este game será utilizado a versão Free do Construct 2, um pacote de imagens, você deve fazer Download das imagens no botão abaixo e descompactar em um lugar de fácil acesso, pois todos os arquivos serão utilizados em nosso game.

Para começar, abra o Cosntruct 2, clique em File (arquivo) em seguida em New (novo), ou se preferir, pressione CTRL+N.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Por padrão a opção New empty project vem selecionada, caso isto não ocorra basta clicar na primeira opção em seguida no botão Open, com isto será criado um novo projeto vazio.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Como escolhemos a opção de criar um novo projeto vazio, nosso palco apresenta apenas um quadro branco com outro quadro marcado por linhas, com isto basta iniciar nosso projeto.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Todo bom desenvolvedor de Game, não começa direto desenvolvendo o Layout, Sonorização, Programação e tudo que compõe um jogo, mas sim por protótipos.

Não vamos quebrar esta regra, na imagem abaixo esta o protótipo de como será construído nosso jogo, Note que nele apresenta a pontuação, colisões, Player, inimigos, projétil e especificações do controle.

As explicações para cada parte será vista posteriormente em sua própria aplicação.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

 

Vamos especificar o tamanho do nosso Game, para isto clique em qualquer parte em Branco do palco e na paleta Layout Properties defina Layout Size como 1000, 600, ou seja, 1000PX de largura e 600PX de altura, altere também a propriedade name para cenario1, apenas para estruturar nosso projeto.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Agora devemos alterar algumas informações sobre nosso projeto, para isto na paleta Projects clique sobre a pasta com o nome de New Project*, presente na paleta Projects.

Nesta paleta deverão aparecer todos os objetos que forem utilizados em nosso game, como áudio, folhas de estilos, imagem e tudo mais.

 

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Agora volte a paleta Properties, a mesma apresenta informações a respeito do nosso projeto, você deve fazer as alterações abaixo.

Name: altere para Space Invaders.
Window Size: 1000, 600, este é o campo de visão.
Fullscreen in Browser: Off, esta opção vai remover o ajuste do game na tela, o mesmo permanecerá ao centro com uma borda clara ajustado pelo tamanho definido.
 

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Feito isto, basta começarmos a inserir nossos objetos em cena, mas antes disso vamos entender para que serve a aba Layer na paleta Projects.

Na teoria, Layer são camadas, Imagine uma pilha de papel, o que esta na superfície sobrepõe a visão dos que estão na parte inferior, resumindo, você poderá inserir objetos em cima de outros usando apenas a Layers, assim fica fácil de acessar o objeto de trás.

Note que há vários ícones nesta aba, começando a explicação da esquerda para a direita, temos:
Sinal de mais: Ele incrementa uma nova Layer ao projeto, na versão Free são limitados para cinco, já nas versões pagas são ilimitadas.
Olho: Oculta uma Layer do projeto, muito útil quando precisamos ter total visão a objetos que estão por trás de outra Layer.
Cadeado: Permite bloquear uma Layer, isto nos ajuda quando temos muitos objetos em cena e não queremos selecionar acidentalmente um objeto de outra Layer.
Lápis: Podemos renomear a Layer, por padrão vem Layer 0, Layer X..., útil para organização do nosso Game.
Lixeira: Exclui uma Layer que esta selecionada.
Seta Cima: Move uma Layer selecionada para cima, isto no caso se houver uma Layer a cima.
Seta baixo: Move uma Layer selecionada para baixo, isto no caso se houver uma Layer abaixo.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Agora que você aprendeu cada parte da aba Layers, renome a Layer 0 para fundo.

De um duplo clique no palco, abrirá uma janela chamada Insert New Object, é nesta janela que contém todos os componentes que poderão ser utilizados em um Game, neste nosso projeto não vamos usar nem a metade, na verdade apenas alguns.

De um duplo clique em TiledBackground, isto ira inserir um componente em tela que serve para fixarmos uma imagem de fundo.

 

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

No palco deverá aparecer um quadro Azul, dando um duplo clique no mesmo é aberta a janela de edição, mas assim que você insere o componente TiledBackground esta janela já é aberta, clique no ícone de uma pasta, é o segundo da lista, ele permite abrir uma imagem. Na pasta que você fez o Download e descompactou, há uma imagem chamada background, você deve carregar a mesma, em seguida fechar a janela.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Você verá agora que a imagem já aparece no palco, porém temos que fazer alguns ajustes.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Agora com o Tiledbackground selecionado, vá até a paleta Properties e faça as seguintes alterações:

Name: Background.
Size: 1000,600. Para ocupar o todo o espaço do nosso projeto.
Position: 0, 0. Corresponde a posição X e Y, começando de 0 par ambos.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Com isto já temos o Background do nosso Game em Cena, agora vamos salvar nosso projeto, para isto vá até File em seguida clique sobre Save As Project, você deverá escolher a pasta onde quer salvar e por último clicar em OK.

Recriando Space Invaders no Construct - Parte 1
Recriando Space Invaders no Construct - Parte 1

Para não ficar muito grande o artigo, vamos ficando por aqui.

Até a próxima, se houverem dúvidas, deixe nos comentários.

Gunnar Correa
Gunnar Correa

Autodidata, Graduado em Desenvolvimento Web, Especialista em Tecnologias na Educação e Pós-graduando em Segurança da Informação. Começou seus estudos na área de programação quando era criança, e atualmente, está estudando desenvolvimento de jogos. Fundador da SatellaSoft, criado em 2009 com o intuito de compartilhar conhecimento de forma gratuita e inédita.

Todos os nossos cursos em promoção
Todos os nossos cursos em promoção

Webstories

Todos os nossos cursos em promoção


Deixe um comentário
Aguarde...
Todos os nossos cursos em promoção