Iniciando com o Stencyl

Bem-vindo! Este artigo projetado para ajudar voc a comear a trabalhar com a ferramenta Stencyl, onde em minutos voc vai criar seu primeiro game. Antes de comear falaremos um pouco mais sobre o Stencyl e conheceremos sua interface.

O que Stencyl? A plataforma Stencyl consiste de trs partes Stencyl (the toolset), StencylForge e Stencyl.com. Cada um desempenha um papel para ajudar voc a montar seu game, a partir da concepo do jogo at a sua publicao.

Passo 1: Download Stencyl Agora que voc sabe o que o Stencyl e suas vrias partes, vamos comear. Inicie pelo download do Stencyl e o instale.

Passo 2: V at o Crash Course Depois do download, recomendamos que acesse o Crash Course. Se voc est utilizando o Stencyl pela primeira vez, ser direcionado automaticamente para o Crash Course. Se no, clique no boto help e procure por essa opo.

Se completar o Crash Course voc ter produzido seu primeiro jogo.

Passo 3: V at a Stencylpedia Depois de voc ter feito seu primeiro jogo usando o Crash Course altamente recomendvel que leia os primeiros captulos da Stencylpedia (at o final do captulo 4). Stencylpedia ir ensinar a voc os fundamentos de criao de game atravs do Stencyl, utilizando vrios exemplos prontos.

Passo 4: Crie um game a partir de um kit Depois de ter visitado a Stencylpedia, voc deve criar seu primeiro game real, baseado em um kit. Kits so templates para criao de determinados tipos de jogos como os de Plataforma, de tiro e os de ao.

Se nenhum dos kits for do seu gosto, voc pode tambm selecionar um Blank Game para criar um game a partir do zero. De qualquer maneira possvel reunir grficos e sons para a construo de um game, montando cenas e testando-o, podendo por fim public-lo, sendo tudo isso muito fcil.

Passo 5: Examine outros exemplos Sua cpia do Stencyl vem com exemplos simples de games que ensinam a voc mais sobre a plataforma. Voc pode buscar mais games de exemplos em StencylForge.

Passo final: Crie seu prprio game Agora que voc esta familiarizado com Stencyl, est pronto para fazer os games de sua preferncia. O cu o limite e praticamente qualquer coisa pode ser feita com Stencyl, especialmente se fizer pleno uso do poderoso e intuitivo designer de comportamento (Design Mode) ou o editor de cdigo.

Como obter ajuda Em algum momento voc ter dificuldade e precisar fazer perguntas. Por onde deve comear?

1:Inicie com a Stencylpedia Se voc esta comeando, Stencylpedia o primeiro lugar a consultar, pois as principais informaes sobre desenvolvimento de games esto l. Se voc novo no Stencyl trabalhe os captulos 2, 3 e 4 e ao final do captulo 4 ter plenas condies de desenvolver games.

2: Pergunte nos fruns Os fruns so timos quando voc tem uma questo especfica para perguntar. Na maioria dos casos, voc vai ter uma resposta rpida, muitas vezes no mesmo dia.

3: Converse com outros usurios Stencyl

A sala de Chat tima para procurar ajuda em tempo real, pois pode-se encontrar vrios membros da comunidade que podem nos ajudar.

Vamos fazer um jogo? Descompacte o arquivo como "Kit Crash Course" e coloque o seu contedo dentro da pasta "Games". Voc pode encontrar a pasta "Games" clicando em "View Games Folder", boto localizado na barra inferior, logo aps a abertura Stencyl.

Criando um novo Game Quando voc carregar o Stencyl, ver uma tela parecida com esta:

Este o welcome center. Aqui voc pode criar um novo game, abrir um game existente, ou procurar games de outras pessoas tenham criado.

Criando um novo jogo 1) Clique no quadrado pontilhado rotulado: Click here to create new Game

2) Clique no Kit Crash Course, e em seguida, no boto Next na parte inferior da caixa de dilogo.

O que so kits? Frequentemente quando voc cria um jogo em Stencyl, ter a necessidade de iniciar com um kit, um template de game que vem com amostras de recursos e configuraes lgicas do game j efetuadas. O kit que voc est comeando aqui tem todos os recursos que voc precisa para o Crash Course.

3) Em seguida voc ver uma caixa de dilogo pop up (figura abaixo) onde poder configurar o tamanho da janela do game em pixel e o nome do seu game. Vamos nome-lo Crash Course jogo, mas pode utilizar outro nome de sua escolha. Ao definir a dimenso de largura e altura na seo Screen Size voc estar determinando o tamanho da janela/visualizao que o jogador ver quando jogar seu game. Neste caso colocaremos uma largura 640 e uma altura de 480.

Agora voc vai visualizar o painel, uma rea central onde voc pode ver os recursos do seu jogo (grficos, sons, lgica do game, etc) e configuraes.

Recursos do Game A partir do painel ns podemos criar novos recursos ou importar recursos existentes. Para o Crash Course, sero includos os recursos que voc precisa para comear. Ator jogador

Vamos comear por localizar o ator, que servir como o nosso personagem o qual faremos interaes. Definio: Em Stencyl, qualquer coisa que pode se mover ou que pode interagir considerado um Ator. Isto inclui personagens, inimigos, elementos de interface com o usurio etc. Um Actor Type um template para atores, enquanto ator geralmente representa uma instancia particular. s vezes, usamos o nmero 2 alternadamente para manter a nossa linguagem simples.

1) Primeiro, clique em Actor Type na barra lateral esquerda do painel

Nota: Voc ver um pequeno nmero "2" ao lado do boto. Esse nmero indica o nmero total de atores em seu jogo. Da mesma forma, os nmeros ao lado dos outros recursos indicam o nmero dos tipos de recursos existentes.

2) Aparece ento a lista de tipos de atores. Como esperado, voc ver dois tipos de Atores, um chamado Mambo, outro chamado Pronger. Mambo vai ser o ator do nosso jogador.

3) Se voc der um duplo clique no cone do mambo, o Stencyl abrir o editor do ator.

Definio: O Editor Ator um dos vrios editores de recursos dentro Stencyl. Ele permite que voc personalize completamente a aparncia de um ator, comportamento e propriedades fsicas. Voltaremos a este editor em breve, mas por agora, vamos ver o restante dos recursos que estar usando.

O segundo ator. 1) Clique sobre a aba Dashboard. 2) Agora abra Pronger, o ator que usaremos como nosso inimigo.

Dica: Prefere abrir as coisas usando o teclado? Digite Ctrl + O (ou Command-S no Mac). Isso abrir uma caixa de dilogo na qual voc pode digitar o nome de qualquer recurso. Use as setas do teclado para ajustar sua seleo e pressione Enter / Return para confirmar sua seleo.

Tilesets Agora vamos falar do Tileset. Definio: Um Tileset uma coleo de peas retangulares que podem ser usadas para construir os nveis do jogo (conhecido como cenas em Stencyl-speak).

1) Clique na aba Dashboard e em seguira clique na categoria Tilesets

2) Abra o Grass Land Tileset.

3) Um editor aparece em uma nova aba. Desta vez, o Editor Tileset

Sons Vamos conhecer os recursos de sons. Clique no boto da aba Dashboard.Voc ver que dois sons j esto l, Stomp e Jump.

Sinta-se livre para abrir um dos sons.

Comportamentos Por ltimo, mas no menos importante, vamos olhar para os comportamentos. Mostrado abaixo os comportamentos que estaremos usando no Crash Course.

Nota: Comportamentos controlam toda a lgica do jogo e interao do jogador

Vamos ver um desses comportamentos. D um duplo clique em Walking para abri-lo dentro do Editor Behavior.

H muita coisa acontecendo aqui, e ns vamos falar sobre isso mais tarde. O Editor do comportamento uma ferramenta poderosa que faz o projeto lgico e complexo de maneira bastante simples. Temos um tutorial inteiro dedicado a ajud-lo a aprender o funcionamento deste editor, embora, no vamos v-lo no momento.

Nota: Prefere codificao em vez disso? Ns oferecemos duas maneiras de adicionar cdigo para os seus jogos, uma um editor de cdigo especfico (ou ligado para usar seu editor de texto favorito) e o outro so blocos de cdigo especial que permite a insero do cdigo no Editor de Comportamento.

Salvando Quando voc est trabalhando em seu jogo, uma boa ideia salvar com frequncia o que est fazendo. Basta clicar no boto Save Game na barra principal de ferramentas, ou digite Ctrl-S (ou Command-S no Mac).

Personalizando Atores J temos importados alguns Atores para o nosso jogo, mas eles no so muito interessantes ainda, sem Comportamentos, onde esses atores realmente ainda no pode fazer muita coisa. Para dar um pouco de vida ao Mambo e ao nosso inimigo, Pronger, vamos dar uma segunda olhada no Editor de Actor e adicionar os comportamentos inclusos no Kit Crash Course.

Customizando Mambo Se voc ainda no fechou o Ator "Mambo", clique na guia para selecion-lo. Caso contrrio, navegue para o Dashboard e clique duas vezes no Ator Mambo na Biblioteca Actor Types.

1) Ser aberta a pgina do editor do personagem com o item Appearance selecionado em azul na parte superior do editor, selecione o item Properties neste menu.

2) Verifique se Mambo um membro do Grupo de Players. Isto ir assegurar que o Stencyl vai lidar com colises, como pretendemos.

Definio: Grupos permitem categorizar Atores para dizer ao Stencyl que tipos de atores devem colidir com outro. Os grupos tambm podem deix-lo tratar diferentes classes de atores de forma independente.

3) Sinta-se livre para dar uma olhada nas guias de coliso e fsica tambm. Eles contm as configuraes adicionais que permitem personalizao, como o motor de fsica do Stencyl, tratamento do ator, mas para o nosso exemplo, as configuraes padro vo funcionar bem.

4) Vamos passar para a aba Behaviors, onde a verdadeira personalizao comea. Comece clicando no boto Behaviors (ao lado do boto Appearance). A seguinte tela ser exibida:

5) Clique no retngulo pontilhado. Quando a caixa de dialogo aparecer selecione a opo walking e clique no boto Choose;

6) Quando voltamos para o Editor do Ator, observamos a adio do comportamento Walking na lista esquerda, bem como todos os seus atributos na janela principal.

7) Vamos comear a personalizar esses atributos. Alguns dos atributos tm valores padro que podemos usar, como velocidade, enquanto outros teremos que estabelecer. Primeiro, mude os controles Move Right Key e Move Left Key para Right e Left, respectivamente.

8) Em seguida, escolha as animaes desejadas clicando no boto "Choose an Animation" e selecionar as sequncias de animao que voc deseja.

Isso tudo para o primeiro Comportamento!

Vamos adicionar um comportamento e personaliz-los de uma maneira similar. Para adicionar mais Behaviors, clique no boto Add Behavior no canto inferior esquerdo do editor.

Jumping: Faa as seguintes modificaes para os valores padro:

Agora adicione o comportamento: Stomp on Enemies (Pisar em Inimigos)

Faa as seguintes configuraes:

Personalizando Pronger Pronger vai ser mais simples de configurar do que Mambo. Vamos passar para o seu guia (ou abri-lo a partir do painel, se necessrio).

1) Clique no boto Properties como fizemos com Mambo e encontre o Group;

2) Mude o Group para Enemies; 3) Tudo o que resta a fazer com Pronger adicionar um nico comportamento. Clique no boto Behaviors e adicione o comportamento Stompable. Personalize os dois seguintes atributos e deixar os outros como eles so:

Criando uma cena Agora que temos os nosso recurso e nosso ator configurado, ns podemos criar uma cena. Definio: Cenas so nveis do game que so preenchidos com as peas e Atores que criamos. Voc pode at mesmo anexar comportamentos em cenas, apesar de no fazermos isso neste tutorial.

Criando um novo cenrio 1) Na aba Dashboard clique no item Scenes, e em seguida no retngulo tracejado que surgiu no centro do Stencyl.

2) Ser mostrada a caixa de dilogo como na figura abaixo:

Coloque um nome de sua escolha.

3) Vamos fazer o Stencyl gerar um fundo imitando o cu, clicando no item Color e selecionando a opo vertical gradiente. Escolha duas cores clicando nas caixas brancas ao lado do item Color e escolher a cor desejada.

Note que a caixa a esquerda seleciona a cor do inicio do gradiente j a da direita a cor de trmino.

4) Quando terminar as configuraes clique em create. 5) O Designer da cena ser aberto com uma interface de programa de desenho com intuito de facilitar a utilizao.

Colocar Tiles Vamos adicionar Tiles em nossa cena. Eles formam o piso em que os personagens vo se deslocar.

1) Selecione a ferramenta pencil na barra de ferramenta do lado esquerdo do Stencyl:

2) Clique na parte superior esquerda na paleta titles (localizada no lado direito do Stencyl).

3) Coloque-o no canto inferior esquerdo da cena, clicando neste local.

4) Selecione o quadro do meio na linha superior da Paleta

5) Com o boto esquerdo do mouse pressionado, clique e arraste para preencher a linha, deixando apenas um nico ponto no canto.

6) Selecione o tile mais a esquerda na paleta

7) Coloque-o no espao vazio restante da linha de fundo da cena.

Dica: Quando voc seleciona um tile para colocar voc pode escolher um conjunto de blocos ao invs de apena um e coloca-los em sua cena. Para isso clique o boto esquerdo do mouse + a tecla shift e arraste o ponteiro para criar o bloco.

Colocando Atores Agora vamos adicionar Mambo e Pronger na cena.

1) Clique na aba actor na Palette e selecione o Mambo

Se voc passar o mouse sobre a cena, vai perceber que Mambo segue o cursor. Clique o boto esquerdo perto do cho para coloca-lo na cena.

Dica: Se voc segurar o boto Shift, voc pode encaixar o ator de acordo com uma grade.

2) Selecione agora Pronger e coloque um pouco deles na cena tambm. Sua cena final poderia ter essa aparncia:

Adicionando Gravidade Clique o boto Physics na parte superior da tela, e na seo Vertical Gravity e digite "85" para simular a gravidade do mundo real.

Teste seu game Clique no boto Test Game na barra de ferramenta no topo do Stencyl:

Voc pode caminhar usando a seta direita e esquerda e saltar usando o espao. Tente empurrar os atores Pronger e pulando sobre eles. Se voc cair fora da tela, a cena vai recarregar.

Nota: Voc pode tambm testar seu game em um navegador web usando o item de menu mostrado abaixo, ou o atalho Ctrl+Shift+Enter :