Criando seu Primeiro Jogo no MMF2

Introdução:
Na aula passada, vimos o básico acerca do MMF2. Nesta aula, criaremos algo mais parecido com um jogo. Aprofundaremos o que vimos na aula passada, veremos alguns assuntos simples, e, agora, usaremos gráficos de verdade.

Capítulo 1 - Materiais necessários
Antes de começar, você precisará, obviamente, do Multimedia Fusion 2. Não o disponibilizamos aqui; procure em outros sites, busque por torrents... enfim, dê seu jeito. Não apoio a pirataria.

Além disso, você precisará também instalar algumas Libs no seu Multimedia Fusion 2. Libs são bibliotecas gráficas de MMF2, arquivos que contém gráficos pré-definidos e prontos para utilizar-se em jogos feitos neste programa. Você pode ler um tutorial de como instalá-las AQUI, e baixar algumas delas AQUI. Vale ressaltar que, no MMF2, você também pode utilizar libs de seus antecessores: TGF, MFX e MMF1.5.

Antes de começarmos, um conselho: quando estiver criando um jogo (aliás, qualquer coisa), salve o projeto periodicamente.

Capítulo 2 - Menu
Nosso jogo terá três frames: menu, jogo e parabéns. O primeiro, naturalmente, será o do menu. Algo como "Pressione enter para jogar". O segundo, será o jogo em si, um personagem atrás de determinado objeto que deve encontrar. E, o terceiro, será a tela de parabéns: "Você achou a Moeda Mágica Perdida do Rei Escobar Xavier Pedro da Silva II! Pressione ESC para sair ou F2 para jogar novamente". Naturalmente, já fizemos a mesma coisa na aula passada. Mas vamos repetir a dose.

Antes de mais nada, crie os três frames. Para isto, basta clicar no número ao lado do texto "More...", no Storyboard Editor.


Uma vez que os três frames estejam criados, vamos editar o do menu. Dê um duplo clique sobre ele, ou simplesmente clique sobre o número ao seu lado para irmos ao Frame Editor.

Aqui, vamos definir um fundo preto. Na Workspace Toolbar (aquela lateral que serve para gerenciar o projeto), clique uma vez sobre o Frame do menu, selecionando-o. Então, suas propriedades aparecerão na Properties Toolbar. Caso uma delas, ou as duas, não estejam aparecendo, vá respectivamente em View > Toolbars > Workspace Toolbar (ou aperte CTRL+W) ou em View > Toolbars > Properties Toolbar (ou aperte CTRL+D).

Agora, na Properties Toolbar, selecione a Background color (cor de fundo) preta.


Muito bem. Vamos inserir agora, na tela, um objeto. Existem vários tipos de objetos no MMF2, e eles vão desde textos (que é o que vamos inserir agora) até objetos invisíveis que têm como finalidade adicionar mais funções à programação do MMF2. Este segundo grupo de objetos são chamados de extensões, e, como eu já disse, expandem as capacidades do programa, podendo deixá-lo ainda mais poderoso. Você pode aprender a instalar extensões AQUI, e baixar algumas AQUI.

Voltando ao assunto, vamos inserir um objeto de texto - uma String. Para adicionar um objeto no Frame, dê um duplo clique sobre uma área vazia qualquer da tela, com o botão esquerdo do mouse, conforme já expliquei na aula passada. Uma vez que abra a janela de inserir objeto, procure pelo objeto "String", selecione-o, e clique em OK. Então, selecione o lugar onde a String vai ficar.


Ela já deve ser criada selecionada. Então, vamos mudar algumas de suas propriedades. Vá na aba Text Options (aquela com um A desenhado), e clique no que está ao lado de Font. Aqui, mudaremos a fonte da String. Coloque Comic Sans MS, em negrito, tamanho 26. Depois, em Color, mude para branco.


Então, enquanto a string estiver selecionada, clique novamente sobre ela, para mudar seu tamanho. Redimensione de uma forma que o texto possa aparecer por inteiro (procure aumentar mais do que o necessário na largura).


Agora, dê um duplo clique sobre a String, e escreva "Meu Primeiro Jogo" (sem aspas). Se preferir, volte à aba Settings, e mude o texto ao lado de Paragraph 1. Dá no mesmo. Depois, posicione a String desta forma (basta arrastá-la):


Ótimo. Agora, adicione outra String. Mas, desta vez, deixe Arial, tamanho 16, e cor amarela. Escreva nesta string "Pressione Enter para jogar" (sem aspas), e posicione-a abaixo de "Meu Primeiro Jogo".


Bem, por aqui está pronto. Vamos aos eventos. Clique no botão do Event Editor , ou simplesmente aperte CTRL+E. Você deve ter ido para o Event Editor.

Como já foi ensinando na aula anterior, aqui é onde programamos os eventos do Frame. Faremos algo simples... se o jogador pressionar Enter, irá para o próximo frame. Ou seja, o jogo.

Clique em New Condition, e dê um duplo clique sobre as funções de teclado e mouse. Vá em The keyboard > Upon pressing a key.


Uma janela deve ter sido aberta. Ela quer saber qual tecla o jogador deve pressionar para que a ação aconteça. No caso, Enter. Ou seja... você tem de pressionar enter nessa janela =P.

Criamos nossa condição. Agora, devemos criar a ação para irmos ao próximo Frame. Em Storyboard Controls, selecione Next Frame, na linha correspondente à ação de pressionar a tecla (que, aliás, é a única linha).


Terminamos o menu. Vamos ao jogo.

Capítulo 3 - O Jogo
Volte ao Storyboard Editor, e dê um duplo clique sobre o Frame do jogo para editá-lo. Mais uma vez, selecione o Frame na Workspace Toolbar, para mudarmos suas propriedades. Mude a cor para um azul claro. Em seguida, do lado de Size, vamos mudar as dimensões. As dimensões estão no formato LarguraxAltura. Isso significa que 640 corresponde à largura, e 480 à altura. Mude a largura para 1000px. No final, deve ter ficado assim:

Frame configurado.

Vamos, agora, montar o Frame. Use a abuse das Libs que você baixou e instalou! Para adicionar um objeto da Lib no Frame, basta arrastá-lo da Library Toolbar para o frame, e colocá-lo na posição desejada. Se sua Library Toolbar estiver desativada, vá em View > Toolbars > Library Window, ou simplesmente pressione CTRL+R. Adicione o seguinte: um personagem; chão/plataformas; buracos; objetos coletáveis; objeto que fará o jogador passar de fase.

Só uma observação... o personagem deve ser um Active Object. Então, verifique nas propriedades dele (basta selecioná-lo que elas aparecerão na Properties Toolbar), na aba Movement, se do lado de Type está selecionado o movimento Platform (plataforma).


E também não esqueça de verificar, nas propriedades das plataformas e obstáculos, se na aba Runtime Options, o Obstacle Type está como Obstacle!


Aqui está como ficou meu Frame:


Uma vez que seu Frame esteja montado, vamos aos eventos!

--//--

O primeiro evento será para tocar uma musiquinha ao iniciar o frame. Vou representar as condições e ações de uma forma diferente agora. Naturalmente, como vocês estão apenas começando, indicarei entre parênteses onde acham essas funções. As condições ficarão em azul, e as ações em vermelho.

(Storyboard Controls) Start of Frame
(Sounds) Music > Play music > From a file > Browse

Este evento é para tocar uma musiquinha assim que começar o Frame ;).

(Personagem) Collisions > Backdrop
(Personagem) Movement > Bounce

Este aqui, faz com que o personagem detecte uma colisão. Ou seja, pare quando encontrar um chão ou um obstáculo.

(Special) Always
(Storyboard Controls) Scrollings > Center window position in frame (vai abrir uma janelinha, clique em "Relative to", selecione o personagem, e em X e em Y, coloque 0)


Este evento faz com que a tela siga o personagem.

(Personagem) Position > Test position of "Personagem" (aqui, vai abrir uma janelinha, você seleciona todas as setinhas para fora e dá OK)
(Storyboard Controls) Restart the current frame


Este evento faz com que o personagem morra se cair num buraco.

(Personagem) Collisions > Another Object (selecione o coletável e dê OK)
(Player 1) Score > Add to Score (digite 10 e dê OK)
(Coletável) Destroy


Este evento adiciona 10 scores quando o personagem pegar um coletável.

(Personagem) Collisions > Another Object (selecione o passador-de-fases e dê OK)
(Storyboard Controls) Next Frame

Finalmente... faz com que o personagem passe de nível ao coletar a Moeda Mágica do Rei Escobar Xavier Pedro da Silva II.

E terminamos por aqui! Um pouco de inglês ajuda nesse capítulo... quem entende da língua e traduziu as condições e ações, sabe porque cada evento faz o que eu disse que faz. E é bom que você tenha um mínimo conhecimento de inglês pra usar esse programa =P.

Capítulo 4 - Parabéns
Tela de parabéns, finalmente! Volte ao Storyboard Editor e entre no Frame de parabéns. Aqui, deixaremos em branco mesmo. Então, adicione três strings na tela. Uma, em negrito, tamanho 26, escrito "Parabéns". A segunda, tamanho 11, normal, escrito algo como "Você finalizou o jogo!". E, a terceira, não altere nada da fonte, posicione um pouco mais embaixo e escreva: "Pressione ESC para sair ou F2 para jogar novamente".


Vamos ao Event Editor.

(The mouse pointer and keyboard) Keyboard > Upon pressing a key (pressione ESC)
(Storyboard Controls) End of Application

E pronto! Tela de parabéns feita ;).

Capítulo 5 - Notas Finais
Agora sim, você fez algo que podemos chamar um pouco mais de "jogo". Mais ainda falta um longo caminho a trilhar, jovem aprendiz! Isso é só o começo, não se empolgue!

Como pode perceber, o jogo contém alguns bugs na movimentação, não tem inimigos etc. Não expliquei como fazer um jogo perfeitamente porque isso deixaria a matéria demasiada extensa, e incompreensível. Além disso, para fazer um jogão desses requer experiência, e conhecimento com o programa. Por ora, contente-se com esse joguinho cheio de erros e sem emoção. Mas não desanime, todos começam assim ;).

Se quiser dar uma olhada em como ficou o meu jogo, clique AQUI.

--//--

Bom, acho que é só. Espero que tenham entendido o que foi feito aqui, e aprendido ;).

Flw.