Manual do Indie Game Developer - Versão Android e iOS.pdf

Cleuton Sampaio

Manual do Indie Game DeveloperVerso Android e iOS

Manual do Indie Game Developer - Verso Android e iOSCopyrightEditora Cincia Moderna Ltda., 2013

Todos os direitos para a lngua portuguesa reservados pela EDITORA CINCIA MODERNA LTDA.De acordo com a Lei 9.610, de 19/2/1998, nenhuma parte deste livro poder ser reproduzida, transmitida e gravada, por qualquer meio eletrnico, mecnico, por fotocpia e outros, sem a prvia autorizao, por escrito, da Editora.

Editor: Paulo Andr P. MarquesProduo Editorial: Aline Vieira MarquesAssistente Editorial: Amanda Lima da CostaCapa: Carlos Arthur CandalDiagramao: Equipe Cincia Moderna

Vrias Marcas Registradas aparecem no decorrer deste livro. Mais do que simplesmente listar esses nomes e informar quem possui seus direitos de explorao, ou ainda imprimir os logotipos das mesmas, o editor declara estar utilizando tais nomes apenas para fins editoriais, em benefcio exclusivo do dono da Marca Registrada, sem inteno de infringir as regras de sua utilizao. Qualquer semelhana em nomes prprios e acontecimentos ser mera coincidncia.

FICHA CATALOGRFICA

MELO JUNIOR, Cleuton Sampaio de.

Manual do Indie Game Developer - Verso Android e iOS

Rio de Janeiro: Editora Cincia Moderna Ltda., 2013.

1. Informtica 2. Linguagem de Programao 3. Jogo eletrnico

I Ttulo

ISBN: 978-85-399-0460-2 CDD 0001.642 005.133 323.43

Editora Cincia Moderna Ltda.R. Alice Figueiredo, 46 Riachuelo Rio de Janeiro, RJ Brasil CEP: 20.950-150Tel: (21) 2201-6662/ Fax: (21) 2201-6896E-MAIL: [email protected] WWW.LCM.COM.BR 07/13

Dedico este livro minha esposa, Ftima e aos meus filhos:Rafael, Tiago, Lucas e Ceclia.

Escolha uma profisso que voc ame, e nunca ter que trabalhar um s dia em sua vida.

Confcio, filsofo e pensador Chins: (551 a.c 479 a.c)

Sumrio

Captulo 1 - Introduo 1Sobre as plataformas ................................................................................ 1Sobre o cdigo-fonte ................................................................................ 2

Captulo 2 - Reviso de conceitos 3Tipos bsicos de Games ........................................................................... 3

Jogos de ao ..................................................................................... 7Macro funes de um game ..................................................................... 8

Model / View / Controller ................................................................ 10Objetos e elementos tpicos de um Game .............................................. 11

Jogabilidade ..................................................................................... 13Fatores de sucesso de um Game ............................................................ 14

Captulo 3 - Kit de ferramentas para criao de games 17Ferramentas grficas .............................................................................. 17

Imagens ............................................................................................ 17Transparncia e canal alpha ................................................................... 18

Unidades de medida ........................................................................ 20Arquivos de imagem ........................................................................ 21Ferramenta para Sketch ................................................................ 22Ferramentas para desenho Raster .................................................... 23Ferramentas para desenho vetorial .................................................. 24Comparao entre renderizao raster e vetorial ............................. 25

Game engines ......................................................................................... 28HTML 5 + Javascript ....................................................................... 28Nativos ............................................................................................. 28Usar a plataforma nativa .................................................................. 30

Ambientes multiplataforma ................................................................... 30Prototipadores ........................................................................................ 31Bibliotecas auxiliares ............................................................................. 31

Captulo 4 - Prototipao do game 33Usando o Codea ..................................................................................... 34

Um tutorial rpido em Codea .......................................................... 35Criando o prottipo do AsteroidNuts no Codea .......................... 39

Sumrio VII

Usando o Processing .......................................................................... 49Um tutorial rpido no Processing ................................................ 51Criando o prottipo do AsteroidNuts com o Processing .......... 54

Crie vrios prottipos ............................................................................ 64

Captulo 5 - Fsica de games 65Os primrdios ........................................................................................ 66Conceitos bsicos ................................................................................... 66

Acelerao e movimento ................................................................. 68Coliso ............................................................................................. 70Deteo de coliso ........................................................................... 72

Engines de fsica .................................................................................... 76Bullet Physics Library ..................................................................... 76Chipmunk physics engine ................................................................ 77Box2D ............................................................................................. 77

Fsica com Box2D ................................................................................. 78Preparando o laboratrio ................................................................. 79O laboratrio Java ............................................................................ 80Normalizao e ajuste para renderizao ........................................ 85Fundamentos do Box2D .................................................................. 87Fora e atrito .................................................................................... 93Corpos circulares ............................................................................. 97Rotao dos corpos .......................................................................... 98Desenhando corpos como polgonos ............................................. 100Desenhando corpos como imagens ............................................... 102Torque e impulso ........................................................................... 107Deteo de coliso ......................................................................... 110Juntas ou junes ........................................................................... 113

Usando o Box2D em plataformas mveis ........................................... 123Box2D no Android ........................................................................ 123Box2D no iOS ............................................................................... 132

Captulo 6 - Renderizao com OpenGL ES 20 143OpenGL ES .......................................................................................... 144Fundamentos ........................................................................................ 146

Coordenadas dos vrtices e da textura ........................................... 146Buffers ........................................................................................... 150

VIII Manual do Indie ame Developer - Verso Android e iOS Manual do Indie ame Developer - Verso Android e iOS Manual do Indie ame Developer - Verso Android e iOS

Programas de sombreamento ......................................................... 152Matrizes ......................................................................................... 154

Exemplo utilizando Android e projeo perspectiva ........................... 159Entendendo a GLSurfaceView ...................................................... 160A implementao ........................................................................... 163Concluindo .................................................................................... 175

Exemplo utilizando iOS e projeo perspectiva .................................. 176Entendendo o GLKit ...................................................................... 176Criando uma aplicao OpenGL ES .............................................. 178A implementao ........................................................................... 179

Achatando as coisas ............................................................................. 190Implementao em Android .......................................................... 190Implementao em iOS ................................................................. 193

Captulo 7 - Framework de Fsica e Renderizao 195Um framework bsico .......................................................................... 196

O esquema XML do arquivo de modelo de game ......................... 197Proporcionalidade dos GameObjects ............................................ 200Coordenadas e VBOs ..................................................................... 201Movimento e rotao de objetos .................................................... 204Atualizao do mundo Box2D ...................................................... 205Renderizao do modelo ............................................................... 206Mipmaps ........................................................................................ 207

Uso do Framework .............................................................................. 209Concluso ............................................................................................ 212

Captulo 8 - Tcnicas Comuns em Games 215Como exibir um HUD ......................................................................... 215

Aumentando o framework de game .............................................. 220Integrando o game em uma aplicao mvel ...................................... 226

Plataforma Android ....................................................................... 227Plataforma iOS .............................................................................. 231

Tempo e movimento ............................................................................ 233Game Loop .................................................................................... 234Movimento .................................................................................... 247

Efeito de paralaxe ................................................................................ 256Tcnicas de paralaxe ...................................................................... 257Exemplo de paralaxe com camadas de GameObjects ................... 258

Sumrio IX

Implementao Android ................................................................ 261Implementao iOS ....................................................................... 267

Games do tipo plataforma .................................................................... 273Implementao Android ................................................................ 276Implementao iOS ....................................................................... 278

Sistemas de partculas .......................................................................... 280Composio ................................................................................... 280Um exemplo .................................................................................. 281Implementao em Android .......................................................... 283Implementao iOS ....................................................................... 291

Concluso ............................................................................................ 296

Captulo 9 - Vamos Criar um Game 297Limitaes ............................................................................................ 299Licena de uso do cdigo-fonte ........................................................... 299A concepo ......................................................................................... 300Jogos casuais ........................................................................................ 301Jogabilidade ......................................................................................... 301Implementao Bsica ......................................................................... 302

I18N e L10N .................................................................................. 302Alteraes no modelo do game ..................................................... 303Alteraes na carga do nvel corrente ............................................ 307Alteraes no Game Loop ............................................................. 309Colises ......................................................................................... 311Registro de tempos ........................................................................ 315

esto de memria no iOS .................................................................. 323Uso do GLKBaseEffect ................................................................. 324Procure Memory Leaks ................................................................. 327Verifique se est realmente liberando a memria .......................... 328

Concluso ............................................................................................ 332Possveis melhorias no game ............................................................... 333

Captulo 1Introduo

Quando eu comecei a desenvolver games, li muitos livros sobre o assunto e fiz muitas pesquisas no oogle. Muitos dos problemas que eu passei no incio tive que batalhar muito para resolver sozinho. Dessa forma, reuni um conjunto de tcnicas ao longo do meu aprendizado, que so teis at hoje. Durante esse aprendizado, notei que muito difcil encontrar guias prticos de uso, com exemplos simples, o que nos fora a ler muito e escrever muitas provas de conceito, perdendo tempo neste processo.

Ento, resolvi colocar no papel tudo o que eu havia aprendido, e que po-deria ser til para outras pessoas. Assim, nasceu a ideia deste livro, que um guia prtico com solues para os problemas comuns no desenvolvimento de games mveis.

Eu queira algo mais que um recipe book (livro de receitas), porm me-nos que uma referncia completa. Um livro que voc consegue ler rapidamen-te e consultar sempre que precisar, com inmeros exemplos em cdigo-fonte, alm de um game completo.

Neste livro, eu assumo que voc, leitor, leitora, um desenvolvedor ex-periente e que deseja criar games para plataformas mveis, especialmente: Android e iOS. Apesar de j haver escrito livros introdutrios sobre o assunto, este um livro para profissionais que desejem entrar no lucrativo negcio de desenvolvimento de games, tornando-se um Indie ame Developer (desen-volvedor independente de games).

Ao longo do livro, voc construir um framework simples, porm abran-gente, e que pode ser utilizado para criar games mveis biplataforma (Android e iOS) rapidamente. O game exemplo do livro Bola no Quintal, foi feito em apenas 1 semana para as duas plataformas!

A melhor maneira de aproveitar todo o contedo ler com a mo na mas-sa, rodando todos os exemplos de cdigo.

Sobre aS plataformaSEste livro apresenta exemplos em Android e iOS, logo, voc dever ter

instalados os dois kits de desenvolvimento. Nada impede que voc opte por uma das duas plataformas, pois o livro no obriga voc a conhecer ambas. A

2 Manual do Indie ame Developer - Verso Android e iOS

plataforma Android utilizada a ltima verso disponvel (4.2, API = 17), po-rm, os exemplos podem ser executados em qualquer dispositivo com verso ingerbread (maior ou igual a 2.3). A plataforma iOS utilizada tambm a ltima verso disponvel (6.1), com Xcode 4.5.

Se optar por utilizar as duas plataformas, ser necessrio utilizar um com-putador Mac / OS X, com verso mnima Mountain Lion, podendo desen-volver para Android e iOS.

Sobre o cdigo-fonteTodo o cdigo-fonte do livro est disponvel para download, em formato

zip. Voc poder encontr-lo nos seguintes locais: Site da editora: http://www.lcm.com.br, procure pelo ttulo do livro; Site especfico deste livro: http://www.indiegamerbrasil.com; Site The Code Bakers: http://www.thecodebakers.com.

Se tiver alguma dvida ou dificuldade para instalar os projetos ou sobre o livro, por favor me contate:

[email protected]

http://www.lcm.com.br/http://www.indiegamerbrasil.com/http://www.thecodebakers.com/mailto:[email protected]

Captulo 2Reviso de conceitos

ames... Que coisa apaixonante! So capazes de despertar emoes, tanto negativas como positivas e so obras de arte vivas, que deixamos para a posteridade. Se voc nunca criou um game, no sabe quo boa a sensao de saber que as pessoas passam horas se divertindo com a sua criao.

Se algum me diz que criou um compilador, ou um sistema operacional, certamente vai me impressionar. Agora, se algum me diz que criou um Game, certamente vai chamar minha ateno imediatamente. Para mim, o ultimate fight de todo programador criar um ame. Isto o que diferencia os bons dos comuns.

Para mim, desenvolver um ame a maior prova de competncia para um programador. realmente um desafio muito grande, pois existem muitos aspectos a serem abordados. Um game um projeto de software complexo, com vrios recursos, de reas diferentes envolvidas.

tipoS bSicoS de gameSExiste mais de uma maneira de classificarmos um game, dependendo do

ponto de vista. Se estivermos falando sobre visualizao, podemos comear com:

Games 2D: aqueles em que jogamos nos movendo apenas em duas direes. Podem at utilizar recursos para dar iluso de profundi-dade (como paralaxe, viso isomtrica etc), mas nos movemos em um plano. Existem jogos que permitem mudar de plano (e perspec-tiva), como o Fez (http://en.wikipedia.org/wiki/Fez_(video_game)), mas ainda so basicamente 2D nos movimentos;

Games 3D: aqueles em que jogamos nos movendo em seis graus de liberdade (http://en.wikipedia.org/wiki/Six_degrees_of_freedom), com movimentos possveis de: aproximao / afastamento (eixo z), di-reita / esquerda (eixo x), cima / baixo (eixo y), e rotaes em cada eixo. Alguns games 3D no permitem isso tudo, restringindo as rotaes, por exemplo;

H uma certa confuso quando falamos em Games 3D. Algumas pessoas confundem este conceito com iluso 3D. Na verdade, o conceito que a litera-tura e os gamers mais aceitam o dos 6 graus de liberdade.

http://en.wikipedia.org/wiki/Fez_(video_gamehttp://en.wikipedia.org/wiki/Six_degrees_of_freedom


Ilustrao 1: Seis graus de liberdade (autor: Horia Ionescu, Wikipedia http://en.wikipedia.org/wiki/Six_degrees_of_freedom)

A figura anterior nos mostra os movimentos possveis em um verdadeiro ame 3D. Podemos: correr, pular, saltar, rolar (nos trs eixos) etc. Alguns ga-mes limitam o movimento somente aos trs eixos, evitando rotaes, porm, mesmo assim, no se limitam a um plano, como os Games 2D.

Tambm podemos classificar um ame quanto ao seu tipo de projeo, que a maneira como o modelo projetado na tela.

Ilustrao 2: Projeo 3D

Se for um Game 3D, isto mais crtico ainda. A traduo do modelo espa-cial para o modelo 2D da tela pode ser feito de vrias maneiras:

Projeo Ortogrfica (ou ortogonal): a iluso de 3D criada ao criarmos projees ortogonais ao plano, ou seja, no h diferena de tamanho entre objetos prximos e objetos distantes. Desta forma, mostramos os elementos em um ngulo diferente do que veramos apenas de cima, ou de lado. Evita os clculos complexos de projeo 3D e mantm uma boa iluso para o jogador.

Captulo 2 - Reviso de conceitos 5

Viso Isomtrica: no uma projeo, mas uma forma de mos-trarmos os objetos. Neste tipo de viso, rotacionamos um pouco os eixos para mostrar mais detalhes dos objetos, criando a iluso 3D. Neste caso, o ngulo entre os eixos (x, y, z) no plano igual, ou seja: 120 graus. Normalmente, a viso isomtrica utilizada com proje-o ortogrfica. Era muito comum nos anos 80 e 90, embora alguns jogos ainda a utilizem. Alguns exemplos famosos que usam viso isomtrica: Q*Bert (Gottlieb), Civilization II (MicroProse), Diablo (Blizzard);

Projeo Perspectiva: vem do desenho tradicional, no qual as partes mais prximas parecem maiores do que as mais distantes. Tambm conhecida como perspectiva cnica. Do maior iluso de realidade aos games, porm exigem maior complexidade de progra-mao e poder de processamento. Os jogos mais modernos, como: Battlefield, Assassins Creed, Halo e outros apresentam viso em perspectiva;

Ilustrao 3: Projees 2D de um cubo

claro que procurei simplificar ao mximo o conceito de projeo 3D, mas apenas para facilitar o entendimento. Se quiser saber mais, recomendo um bom livro, como o Mathematics for Game Developers, de Christopher Tremblay (Amazon). Porm, existem bons artigos introdutrios na Wikipedia:

Perspectiva (grfica): http://pt.wikipedia.org/wiki/Perspectiva_(gr%C3%A1fica); Isometria: http://pt.wikipedia.org/wiki/Isometria_(geometria); Isometric graphics in video games and pixel art: http://en.wikipedia.

org/wiki/Isometric_graphics_in_video_games_and_pixel_art;Tambm existem classificaes de games quanto s suas caractersticas,

algumas delas so: Arcade: este termo mal interpretado, mas sua origem vem das

mquinas de jogos, conhecidas aqui como Fliperama. Jogos ar-cade possuem regras simples, partidas rpidas, com pontuao,

http://pt.wikipedia.org/wiki/Perspectiva_(grficahttp://pt.wikipedia.org/wiki/Isometria_(geometriahttp://en.wikipedia.org/wiki/Isometric_graphics_in_video_games_and_pixel_arthttp://en.wikipedia.org/wiki/Isometric_graphics_in_video_games_and_pixel_art


vidas, viso Isomtrica etc). Exemplos de arcades clssicos: Spa-ce invaders e Pac-Man. Os jogos arcade evoluram e hoje esto disponveis em vrias plataformas, incluindo mobile;

Jogos de Ao: desafiam o jogador fisicamente, seja por coorde-nao motora, viso de movimento ou tempo de reao. Possuem vrias subcategorias, como: plataforma, tiro e luta. Exemplos cls-sicos: River raid (Atari), Sonic (SEA), Super Mario (Ninten-do) e outros mais modernos, como: Angry Birds (Rovio), Jetpa-ck joyride (Halfbrick). Na verdade, arcades so jogos de ao, s que com regras e visual mais simples;

Aventura (adventure): jogos que desafiam a inteligncia do joga-dor, colocando-o em determinado mundo, com uma misso a cum-prir. Nos primrdios da computao pessoal, os jogos de aventura eram simples, muitas vezes textuais, ou com poucos grficos. Eu gosto de citar os exemplos do Renato Degiovani, como: Serra Pe-lada e Angra-I. Hoje em dia, muitos jogos de aventura tambm misturam caractersticas de jogos de ao, como os Shooters;

Role Playing Game (RPG): so derivados dos famosos jogos de RPG textuais, como Dungeons & Dragons. Na verdade, so jogos de aventura, nos quais o jogador assume um papel e uma vida para-lela em um universo virtual. A principal diferena para os jogos de aventura tradicionais a durao do jogo, que pode ser indetermi-nada. Hoje em dia, os jogos RPG ganharam verses multiusurio online, como os MMORPG Massively Multiuser On-line RP (RPs on-line massivamente multiusurios). Exemplos: World of Warcraft (Blizzard) e Ragnark (ravity Corp);

Tile based games: podem ser jogos de ao ou RP, nos quais os personagens se movem em um tabuleiro, de casa em casa. Exis-tem vrios padres e ferramentas para criar Tile Based Games, como o padro TMX (https://github.com/bjorn/tiled/wiki/TMX--Map-Format) e TiledEditor (http://www.mapeditor.org/). Alguns RPGs e jogos de aventura so tambm Tile Based;

Menu games: so jogos de simulao e RP, com interface baseada em escolha. Parecem muito com os jogos de cartas, como: Magic. Voc tem uma srie de atributos e vai desafiando os outros jogado-res, acumulando vitrias ou amargando derrotas. Um bom exemplo o Mafia Wars (Zynga);


Simuladores: simulam veculos ou atividades. Existem simuladores de voo (Microsoft Flight Simulator), de carro (ran Turismo Sony), de cidade (SimCity Maxis). So mais difceis e desafiadores;

Estratgia: so uma mistura de simulao e RP, no qual o joga-dor tem que conquistar um objetivo, geralmente atravs da guerra. Exemplos: Age of Empires (Microsoft) e Civilization (Micro Prose);

Outra classificao importante quanto ao pblico-alvo do ame, por exemplo:

Infantis: jogos para crianas, geralmente no alfabetizadas ou em fase de alfabetizao. So simples e visuais;

Jogos para meninas: as meninas esto cada vez mais tomando de assalto o mundo dos games e existem jogos especficos para elas, como: jogos de vestir, jogos de cozinhar, jogos de princesas;

Casual games (jogos casuais): so feitos para quem no jogador habitual (ou gamer). So para pessoas que jogam casualmente, sem ter isto como atividade constante. Podem ser de vrios tipos, mas, geralmente, so simples, com poucas regras, fcil jogabilidade e baixo comprometimento (voc no tem que criar uma carreira). Podem ser quebra-cabeas simples, como: Where is my water (Disney) ou jogos de tiro, como Angry Birds (Rovio);

Hardcore games: so feitos para jogadores habituais ou gamers. Normalmente, exigem um comprometimento maior do jogador, que tem que criar uma carreira virtual, que pode ser comunicada em redes sociais de games. eralmente possuem vrias sequncias, como: Assassins Creed (Ubisoft), Battlefield (EA ames) ou ran Turismo (Sony);

Jogos de aoO objetivo principal deste trabalho so jogos de ao. Em primeiro lugar,

porque todos os elementos clssicos (Player Object, NPC, ame loop) so en-contrados neles e, em segundo lugar, porque so uma porta de entrada para o desenvolvimento de games.

Os jogos de ao podem ser divididos tambm em subcategorias, como:Plataforma: so jogos 2D com iluso 3D, nos quais o jogador se

move entre plataformas, de diversas altitudes, pulando, correndo e saltando. Ele pode ter que enfrentar desafios fsicos, como abismos,


ou mesmo adversrios. Exemplos so: Sonic (SEA), Super Ma-rio (Nintendo) e, mais modernamente, Super Meat Boy (Team Meat);

Tiro: seu objetivo matar inimigos atirando diretamente neles ou derrubando-os. Podem ser simples como o Angry Birds (Rovio), ou complexos, como o Doom (Id Software / Nerve Software). En-tre os jogos de tiro, existem os First Person Shooters, nos quais a viso a do jogador (em primeira pessoa), ou Third Person Shoo-ters, nos quais a viso externa ao jogador;

Luta: so jogos nos quais o jogador desafiado a derrotar lutado-res, que podem ser totalmente virtuais, ou avatares controlados por outras pessoas. Alguns exemplos so: Street Fighter (Capcom) e Mortal Kombat (Midway games);

Jogos de ao so baseados em tempo, ou seja, a cada fatia de tempo a posio do jogador (e das balas) muda, sendo atualizada constantemente. Quando o processamento de uma fatia de tempo demora demais, acontece o efeito de Lagging, que quando o jogador percebe a lentido do jogo em determinados momentos. O Lag pode ter diversas causas, como a latncia da rede, em caso de jogos multiusurio, ou mesmo a lentido da renderizao de frames. O Lag pode causar grande insatisfao no usurio, compromen-tendo o sucesso do Game.

Devido a esta caracterstica de sensibilidade ao tempo, jogos de ao exi-gem muito do programador. necessrio racionalizar os grficos, utilizando ao mximo o poder de processamento de PU (raphics Processing Unit), e tambm empregar recursos de multiprogramao, de modo a aproveitar o pa-ralelismo, afinal, muitos dispositivos mveis so multicore (dotados de mais de uma CPU ou ncleo).

macro funeS de um gameSe pensarmos nas macrofunes de um game, veremos algo como o dia-

grama seguinte.

Ilustrao 4: Macro funes de um game


InventrioResponsvel pelos objetos e propriedades do Game. Os elementos ativos

do jogo (personagens ou Player Objects e NPCs) e suas propriedades (quan-tidade de vidas etc).

PontuaoResponsvel por acompanhar a pontuao do usurio, suas conquistas e o

compartilhamento destas informaes.

EstratgiaQuando o jogo tem caracteres prprios, no manipulados pelo usurio

(Non-Player Character ou NPC), preciso dar alguma inteligncia a eles, caso contrrio, o jogo ser fcil demais. Alguns tipos de jogos dispensam a estratgia, baseando-se apenas em clculos aleatrios, como: labirintos, por exemplo. Jogos do tipo Shooting (2D, 3D, TPS, FPS), quando no esto em modo multiusurio, necessitam de estratgias avanadas, para dar a sensao de realidade ao usurio.

ConfiguraoResponsvel pela persistncia e recuperao de todas as informaes de

configurao do jogo, como: nveis oferecidos, nvel do jogador, conquistas, opes etc.

Game loop o conjunto de comandos repetidos a cada fatia de tempo, responsveis

por movimentar os objetos, atualizando o modelo de dados. Ele tambm pode, ao final do processamento, invalidar a apresentao, ordenando o redesenho da tela. Em jogos de ao, geralmente existe um Game loop baseado em tem-porizador, que atualiza a tela em determinadas fatias de tempo (time frame). Alguns tipos de jogos dispensam este recurso.

AnimaoOs caracteres do jogo e at mesmo o cenrio podem exibir animaes. O

personagem pode sorrir, chorar, gritar e o cenrio pode mudar. At mesmo a movimentao dos personagens tratada por esta funo. A animao tambm envolve a tcnica utilizada para desenhar os objetos na tela a cada fatia de tempo passada.

FsicaA macrofuno de fsica muito importante em jogos de ao. Ela res-

ponsvel por dar realismo ao movimento dos caracteres. Coisas como: impul-so, gravidade, movimento e coliso so tratadas por esta funo.

10 Manual do Indie ame Developer - Verso Android e iOS Manual do Indie ame Developer - Verso Android e iOS Manual do Indie ame Developer - Verso Android e iOS

InteraoControla a maneira pela qual o usurio interfere no jogo. responsvel por

capturar o input do usurio e converter em aes no jogo.

Comunicao responsvel por comunicar ao usurio o status do jogo, e tambm o

resultado de suas aes. Pode manter energy bars, contadores, emitir sons, acionar exploses etc.

Algumas destas macrofunes podem ser implementadas em parte por bi-bliotecas de terceiros, como: Box2D e OpenL ES. Porm, mesmo assim, necessrio um esforo do desenvolvedor para configurar e interagir com elas.

Uma funo muito importante a de Inventrio, que tambm abrange o modelo de dados do Game.

Model / View / ControllerUm ame bem construdo sempre baseado no padro MVC Model /

View / Controller, no qual os trs aspectos da aplicao esto separados: Model: responsvel por manter o estado da aplicao; View: responsvel por ler o estado atual e apresentar ao usurio; Controller: responsvel por alterar o estado da aplicao atualizando

o modelo e controlar a atualizao da View;O modelo de um ame a sua representao em memria. Normalmente,

mantemos referncias dos objetos ativos, como: caracteres e cenrio. Mas po-demos ter variaes, como camadas diferentes, para dar efeito de paralaxe (http://en.wikipedia.org/wiki/Parallax_scrolling), que quando os objetos distan-tes se movem mais lentamente do que os objetos mais prximos, dando iluso de profundidade.

Ilustrao 5: Efeito paralaxe - Wikipedia: http://en.wikipedia.org/wiki/Parallax_scrolling

http://en.wikipedia.org/wiki/Parallax_scrolling


Na figura, vemos trs camadas de objetos (cu, celeiros e cho), que se movem em velocidades diferentes, dando iluso de profundidade ao Game.

A camada de apresentao (ou View) de um ame responsvel por cap-turar o estado do modelo e desenhar os objetos em sua posio atual. Existem vrias tcnicas para desenhar objetos, desde utilizar os prprios Widgets nativos do aparelho (Android ImageView ou iOS UIView), ou desenhar di-namicamente os elementos (Android onDraw / iOS drawRect:(CRect)rect).

Finalmente, a camada Controller tem a misso de atualizar o modelo e ordenar que a camada de apresentao atualize a tela. A camada Controller responsvel por executar o Game loop e por obter o input do usu-rio. Tambm deve se comunicar com a macrofuno de Estratgia para ver como o jogo deve reagir.

objetoS e elementoS tpicoS de um gameTemos alguns elementos comuns em vrios tipos de games, especialmente

nos jogos de ao. Por exemplo, sempre existe um objeto que representa o jo-gador ou que ele est controlando diretamente. Este tipo de objeto chamado de Player Object. Existem casos em que mais de um PO (Player Object) existe ao mesmo tempo, e o jogador consegue mudar o controle de um para outro (Sonic & Tails, Jogos de Futebol etc). Porm, geralmente, o jogador est controlado apenas um nico PO a cada momento.

O Player Object pode ser uma nave, como no famoso jogo Asteroids (Atari http://en.wikipedia.org/wiki/Asteroids_(video_game)), no qual o jogador tinha uma nave e podia virar e atirar contra os asteroides. Tambm pode ser um objeto como uma bola, como no jogo para iPad Labirynth HD (Illusion Labs AB). No jogo que apresentei em meu ltimo livro, BueiroBall, o joga-dor controlava a mesa, logo, todas as bolas eram POs.

Outro tipo de objeto o NPC Non Player Character (Caractere ou per-sonagem no controlado pelo jogador). Ele representa o adversrio, que pode (ou no) ser dotado de alguma inteligncia. Nos jogos multiusurio, o NPC pode ser um PO controlado por outro Jogador, ou pode ser algo controlado pela inteligncia do jogo em si. NPCs existem para complicar a vida do joga-dor, tornando a partida mais divertida e interessante. Quem que no se lem-bra das tartarugas do Super Mario? O ponto mais importante dos NPCs que eles possuem movimento e comportamento, ou seja, podem atirar, perseguir, se esconder, explodir ou tomar atitudes, que so controladas pela macro funo de Estratgia do jogo. Um NPC sensvel ao movimento e coliso.

http://en.wikipedia.org/wiki/Asteroids_(video_game


Levando em conta a caracterstica de sensibilidade ao tempo, tpica dos jogos de ao, um NPC ocupa fatia considervel do processamento e dos re-cursos. Quanto mais NPCs um jogo tem em determinado momento, maior a quantidade de recursos para atualiz-los e moviment-los. Balas tambm podem ser consideradas como NPCs, pois se movimentam e so sensveis a colises.

Tambm existem os objetos estticos, que no so sensveis a colises. Objetos estticos podem at se mover, mas sempre como parte de um cenrio. No so sensveis a colises e nem podem ser controlados pelo jogador. Al-guns exemplos: cenrio, nuvens, rvores distantes, montanhas etc. Em certos casos, os objetos estticos nem existem, sendo parte da imagem de fundo. Em jogos mais modernos, objetos podem ser acrescentados ao fundo para dar a iluso de paralaxe. O importante que objetos estticos no podem ser afeta-dos pelo PO ou pelos NPCs. Jogos mais modernos permitem que se deforme em algum grau o cenrio, destruindo prdios, veculos de fundo etc. Nestes casos, os objetos estticos esto se comportanto como NPCs, recebendo e se deformando em funo de tiros, o que exige um alto poder de processamento da console ou do dispositivo mvel.

Game Loop o ncleo de atualizao de um jogo de ao. nele que ocorre a atualizao do Modelo e pode tambm ocorrer a renderizao da View (MVC). Os game loops mais simples podem fazer apenas isto:

1. Verificar se o usurio entrou com algum estmulo;2. Executar a estratgia pra os NPCs;3. Mover o Player Object;4. Mover os NPCs;5. Verificar colises;6. Atualizar inventrio;7. Invalidar a View;8. Dar feedback sonoro.

Na verdade, o ame loop constri um momento do jogo, que apresen-tado em sequncia de modo a dar a iluso de movimento. Apesar de parecer simples, existem vrias consideraes importantes a respeito do Game loop. Por exemplo, ele comanda a renderizao? Ele baseado em time-frame? Ele roda em um Thread separado? Como lidar com a concorrncia?

Em alguns casos, o Game loop independente da fase de renderizao, e ocorrem em momentos (e at em CPUs) separados. O ideal que o ame loop seja enxuto o suficiente para rodar a cada Time-frame, evitando Lag.


Outro problema tpico a acelerao provocada pelo hardware. Por exemplo, ao jogar em um dispositivo mais veloz, o ame loop fica mais rpido e os NPCs tambm. preciso haver um controle de temporizao, garantindo um frame-rate (taxa de atualizao) constante por segundo. Normalmente os games atuam entre 30 e 60 FPS (frames por segundo).

Game Level ou nvel, pode ser entendido como duas coisas diferentes: o nvel em que o jogador est e o cenrio do nvel atual. Na verdade, Game Le-vel o conjunto de: cenrio, misso e elementos que o jogador deve enfrentar em um jogo. Alguns jogos no possuem este conceito, por exemplo os Never ending games (jogos que no terminam), como o Temple Run (Imangi), por exemplo.

JogabilidadeJogabilidade, ou Gameplay, uma caracterstica ligada usabilidade do

jogo, ou seja, o quo o jogo nos diverte. Eu diria que o somatrio das expe-rincias do usurio durante o jogo, que envolve: facilidade de controle, boa visualizao de informaes, nvel crescente e ajustado de desafios etc.

Outros aspectos que influenciam a jogabilidade so: Satisfao proporcionada ao jogador; Facilidade de aprendizado do jogador; Eficincia de envolvimento. O quo eficientemente o jogo envolve o

jogador. Jogos eficientes envolvem o jogador rapidamente; Motivao para evoluo, ou se o jogo motiva o usurio a cumprir

atividades; Cativao, se o jogo faz com que o usurio volte a jogar novamente

ou se interesse em adquirir novas fases, armas etc;Um dos fatores importantes na jogabilidade pode ser a socializao, ou a

facilidade que o game d para divulgar suas conquistas. Muita gente confunde jogabilidade com facilidade de jogar, que um

dos aspectos do conceito. Embora seja muito importante, a usabilidade (faci-lidade de jogar) sozinha no garante o sucesso de um game. Talvez seja melhor citar alguns exemplos de games com boa jogabilidade:

Angry Birds: simples, fcil e rpido de aprender; World of Goo: fantstico! Embora seja um jogo de desafios, sua

jogabilidade tima; Fruit Ninja: igualmente simples e fcil, com alta eficincia de

envolvimento.


fatoreS de SuceSSo de um gameUm game bem projetado envolve vrias atividades separadas:

Game design: o processo de criar o contedo, as regras, os cen-rios, os personagens e a Jogabilidade. um trabalho que envolve vrias especialidades, no apenas programao. Durante o Game design muito produtivo criar prottipos do ame, para avaliar se o conjunto est agradando;

Mecnica do Jogo: estuda-se a interao do usurio com o ame, como sero os movimentos, controles e como sero implementadas as regras. A mecnica tambm se preocupa com o desacoplamento entre os nveis e o cdigo-fonte, procurando parametrizar a seleo e montagem de nveis. Tambm pode envolver prototipao para estudo e seleo de alternativas, alm de seleo de engines, mo-dalidades e recursos para dar ao usurio a melhor experincia com o game;

Game construction: a programao do jogo propriamente dita, que engloba a criao de artefatos (imagens, sons, msica), nveis (cenrios, dificuldade, etc) e cdigo-fonte para a implementao da mecnica do jogo de acordo com o Game design;

So aspectos diferentes entre si e que no devem ser tratados apenas como problemas de programao. Em equipes independentes (indie gamers) co-mum termos esses conceitos misturados, porm, os games mais bem sucedidos so aqueles em que existem especialistas de vrias dessas reas envolvidos.

Outro fator de sucesso, sem dvida o visual do Game, que deve ser atra-tivo e coerente com o ame design, ou com a histria e ambientao. Um dos exemplos mais interessantes o do World of oo (2D Boy), que tem um visual meio dark e nojento, bem apropriado para as bolas de Goo do jogo (gosma ou coisa nojenta). Outros exemplos de visual interessante so: Angry Birds (Rovio), Fruit Ninja e Jetpack joyride (Halfbrick), Wheres my water (Disney) e vrios outros.

Quando falamos em jogos mveis (este trabalho voltado para eles), a jogabilidade tem outros critrios de avaliao. Quando estamos em casa, com um Xbox / Kinect, da Microsoft, ou um PS3, temos vrios recursos para con-trolar o ame, porm, quando estamos com um Smartphone (um iPhone ou um Android qualquer) ou mesmo um Tablet, os recursos so mais limitados. Embora contemos com acelermetro e multitoque, no temos o mesmo con-trole que um Joystick ou um dispositivo tico proporcionam. A tela menor e, geralmente, no estamos em um ambiente timo para jogar (penumbra,


silncio e uma tela de LED enorme). A jogabilidade para jogos mveis deve ser estudada levando-se em conta estas caractersticas.

Um erro muito comum dos desenvolvedores de games mveis criar as mesmas verses para smartphones e tablets. No so a mesma coisa, embora, com o Samsung alaxy S III e o iPhone 5, os smartphones estejam crescen-do, ainda so bem diferentes de um tablet de 8 ou 10 polegadas. necessrio adaptar a jogabilidade ao tamanho do dispositivo.

A originalidade tambm tem um papel importante no sucesso de um Game, especialmente se for do tipo casual. Games muito parecidos com outros, de maior sucesso, no so bem vistos e a tendncia do pblico considerar como uma imitao, mesmo que seja apenas uma coincidncia. Quanto mais origi-nal seu game for, mais poder chamar a ateno deste pblico.

Neste livro, no vou falar sobre este assunto, mas a forma de monetiza-o tambm pode ter um impacto positivo ou negativo no Game. Em meu livro anterior Mobile ame Jam (www.mobilegamejam.com), focamos muito nestes aspectos, porm, no podemos deixar de mencionar alguns problemas. Para comear, nem todos os usurios so fs de jogos Ads based e podem se irritar com aquela faixa de tela utilizada para veicular anncios. Eu tenho games publicados que so deste tipo, e a rentabilidade muito baixa. Outra forma que deve ser evitada cobrar licena de uso. Se voc j cobra pelo uso sem deixar o usurio experimentar, receita para o fracasso, a no ser que seu game seja realmente sensacional. O ideal dar ao jogador uma maneira de experimentar o game antes de compr-lo. A entra o processo de in-app pur-chase (compra por dentro da aplicao), e os bens virtuais. uma maneira de fazer o usurio se div ertir e recuperar gradativamente o seu investimento.

http://www.mobilegamejam.com/

Captulo 3Kit de ferramentas para

criao de gamesQuando eu era garoto, passava aquele seriado antigo do Batman (DC

Comics), no qual o Morcego tinha um cinto de utilidades, e eu achava aque-le cinto sensacional. Com Games, no muito diferente, pois necessitamos ter a mo (e saber usar) algumas ferramentas importantes, que nos pouparo muito tempo na criao de um Game.

Dependendo do tipo de ame que voc vai fazer, algumas ferramentas se tornam mais importantes e outras, desnecessrias, mas sempre existe um con-junto bsico que voc deve ter. Vamos mostrar algumas delas aqui.

ferramentaS grficaSEm ames, as imagens so fundamentais e ns j discutimos isso, agora,

o momento de entrarmos mais um pouco a fundo no assunto, focando nas principais ferramentas para criao de imagens.

ImagensVamos comear a estudar imagens em seu formato virtual e, depois, vamos

ver como ela renderizada (apresentada) na tela. Toda imagem na memria um conjunto de pontos. Estes pontos so ar-

mazenados na memria e, posteriormente, so exibidos para o usurio. Cada ponto tem as propriedades: coordenadas e cor.

As coordenadas de um ponto indicam onde ele est em nosso mapa virtual (Bitmap no confundir com o formato BMP). Dependendo do tipo de grfico que estamos trabalhando, pode ser em um mapa tridimensional ou bidimensional. Como estamos falando de imagens, vamos supor que seja ape-nas bidimensional.

J a cor, normalmente expressa em quantidade de vermelho (red), verde (green) e azul (blue), podendo tambm trazer a quantidade de transparncia (Alfa). Vamos ver alguns exemplos simples de representaes.


tranSparncia e canal alphaAs imagens podem trazer informaes sobre trasnparncia, conhecidas

como Canal Alpha.eralmente, um valor zero no canal alfa de uma imagem significa que ela

totalmente transparente, e um valor 100% significa que totalmente opaca, mas isto varia de acordo com a ferramenta que utilizamos. Por exemplo, o LibreOffice Draw considera uma imagem com zero no canal alfa como sendo totalmente opaca, e um valor 100% como totalmente transparente.

Ilustrao 6: Propriedades dos pontos grficos no LibreOffice Draw

Como podemos ver na figura anterior (LibreOffice Draw), temos dois pontos ( claro que so imaginrios) com suas caractersticas. Note como formamos a cor em formato RGBA Red, reen, Blue e Alfa (http://www.w3schools.com/cssref/css_colors_legal.asp). No formato RB Red, reen e Blue (http://www.w3schools.com/cssref/css_colors_legal.asp), temos um indicador da quantidade ou intensidade de cada cor, representado por um valor entre 0 e 255 (1 byte), assim, podemos representar as cores:

Preto: RB (0,0,0); Branco: RB (255,255,255); Cinza: RB (128,128,128);

Captulo 3 - Kit de ferramentas para criao de games 19

Vermelho: RB (255,0,0); Verde: RB (0,255,0); Azul: RB (0,0,255); Amarelo: RB (255,255,0); Azul ciano (azul beb): RB (0,255,255); Rosa beb: RB (250,200,200);

Se quiser ver as combinaes de RGB, pode usar um programa como o LibreOffice Draw (http://pt-br.libreoffice.org/), ou o imp (http://www.gimp.org/) e usar a ferramenta de Cores.

Note que o dilogo de cores do LibreOffice Draw tambm tem uma aba de transparncia, que permite ajustar a opacidade da cor.

Como vimos na ilustrao 6 (Propriedades dos pontos grficos), alm do formato RGB, tambm temos o canal Alfa, que regula a opacidade ou transparncia da cor. Este formato conhecido como RBA. Existe algu-ma confuso quanto ao fato do canal representar o nvel de opacidade ou de transparncia. Uma boa referncia, o W3Schools (http://www.w3schools.com/cssref/css_colors_legal.asp), diz que o canal alfa representa o nvel de opaci-dade da cor, variando entre 0 (totalmente transparente) e 1 (totalmente opa-co). J alguns softwares e literaturas tratam essa medida como percentual, variando entre 0% (totalmente transparente e 100% (totalmente opaco) (http://en.wikipedia.org/wiki/RBA_color_space). Vamos mostrar alguns exemplos de transparncia.

Temos que prestar ateno na forma como as ferramentas se referem ao canal alfa. O LibreOffice Draw encara como transparncia, logo, 0% sig-nifica opaco e 100% significa transparente. J, para o imp, uma camada 0% significa totalmente transparente, e 100% significa totalmente opaco.

Ilustrao 7: Vrios nveis de transparncia

http://www.w3schools.com/cssref/css_colors_legal.asphttp://www.w3schools.com/cssref/css_colors_legal.asphttp://en.wikipedia.org/wiki/RGBA_color_spacehttp://en.wikipedia.org/wiki/RGBA_color_space


Na imagem anterior, usamos o LibreOffice Draw para desenhar. Os qua-drados, que possuem cor de fundo preta, esto com o canal alfa variando de 0 at 1, ou, na linguagem do LibreOffice, variando de 100% at 0% de transparncia.

Toda imagem armazenada da mesma maneira. Porm, h alguns detalhes sobre imagens que precisamos conhecer.

Unidades de medidaQuando falamos em imagens, muito comum ouvirmos pontos e pi-

xels, conceitos que muitas vezes nos confundem. Um ponto (point) uma medida de tipografia e equivale a 1/72 de polegada. Um pixel uma unidade grfica de um dispositivo. a menor unidade utilizvel de um dispositivo gr-fico, como uma tela de LCD. Temos que deixar claro que estamos estudando grficos exibidos em telas, e no impressos, pois, caso contrrio tudo mudaria.

Resoluo e densidadeH muita confuso sobre estas duas mtricas. O senso comum diz que re-

soluo a quantidade de pixels, tanto na horizontal quanto na vertical, que um dispositivo pode exibir. Tambm serve para determinar o tamanho de uma imagem. Por exemplo, uma imagem de 5 Megapixels tem 5 milhes de pixels, o que no est relacionado ao tamanho fsico. Uma tela WXA, com 1280 x 800 pixels, tem 1,024 Megapixels.

J o tamanho que uma imagem ou tela tero depende muito da densidade, que a quantidade de pixels por polegada (PPI) que a tela pode exibir (ou que a imagem espera ser reproduzida). Isto determina qual tamanho a imagem ter na tela real. Cada dispositivo tem sua densidade especfica, por exemplo (fonte: gsmarena.com) :

Samsung alaxy S III: 306 PPI; Apple iPhone 5: 326 PPI; Apple iPad 4: 264 PPI; Apple iPad 2: 132 PPI; Motorola Xoom 2 Media Edition: 184 PPI.

Profundidade de corA profundidade de cor (Color depth) o nmero de bits necessrios para

representar cada cor de um pixel. Temos dois grandes sistemas para repre-sentar a cor: indexado e direto. O sistema indexado utilizado quando temos


baixa profundidade de cor, ou seja, temos poucos bits para representar cada cor. Ento, criada uma palheta (tabela) com as cores utilizadas e o cdigo , na verdade, o ndice nesta tabela. Sistemas com 8 ou 12 bits por cor geral-mente utilizam palhetas de cor. O sistema direto quanto no usamos pa-lheta, mas representamos diretamente o valor de cada cor. Podemos ter vrias profundidades neste sistema, como 8 bits, 16 bits ou true color, que so 24 bits de cor (8 para cada cor RB). Com este sistema, podemos representar mais de 16 milhes de cores. claro que o sistema direto requer mais mem-ria (RAM ou arquivo) para representar as imagens, porm, fica mais fiel.

Hoje em dia, o sistema indexado utilizado para armazenamento de ima-gem, de modo a economizar espao. Entre os tipos de arquivo que usam pa-lheta temos: BMP, IF e PN.

Arquivos de imagemExistem vrios padres para armazenamento de imagem, cada um me-

lhor para determinada aplicao. Temos formatos que usam palheta, formatos que usam Color deph e formatos que podem utilizar os dois sistemas. Tambm podemos armazenar uma imagem de maneiras diferentes, como: Raster e Vetorial.

Imagens em formato Raster so as mais comuns. So mais simples em termos de processamento, pois basicamente armazenam os pontos e suas cores. S isso. necessrio apenas decodificar (ou descomprimir, caso necessrio) o arquivo e acionar os pontos na tela com a cor necessria. Porm, o formato Raster tem a desvantagem de ser grande. claro que podemos comprimir a imagem, perdendo ou no informao, mas, ainda assim, o arquivo grande.

Existem formatos de arquivo Raster que comprimem a imagem, com perda ou sem perda de informao. O JPEG, por exemplo, utiliza compresso com perda, que pode ser regulada atravs da qualidade do arquivo. Arquivos como PNG comprimem sem perda de informaes, porm geram arquivos maiores.

J as imagens em formato vetorial no representam a imagem na forma de pixels, mas como vetores. Elas contm as instrues para desenhar a imagem, permitindo mais suavidade na renderizao. Os arquivos em formato vetorial so menores do que os em formato raster, porm, sua renderizao exige mais recursos de processamento e pode gerar distores quando utilizamos dispo-sitivos diferentes.


Os principais formatos de arquivos de imagem so:Formatos Raster:

GIF: usa compresso sem perda e pode representar imagens com palheta de 256 cores. Suporta animao e mais indicado para ima-gens com grandes reas de uma s cor, como: grficos comerciais, desenhos simples etc;

BMP: o formato nativo do Microsoft Windows. No usa compres-so e pode representar true color (24 bits). Os arquivos BMP so grandes, em comparao com outros formatos;

PNG: suporta true color com canal alfa (transparncia). mais indicado para imagens com grandes reas de cor nica. Tambm suporta imagens em sistema direto, sem palheta;

JPEG: comprime imagens de maneira extraordinria, podendo re-duzir absurdamente o tamanho do arquivo. Porm, usa compresso com perda de informao. Uma vez salvo, no possvel restaurar a imagem original. mais indicado para arquivos de fotografias;

Formatos vetoriais: SVG: Scalable Vector raphics, um formato padro, criado pelo

W3C, e utilizado no HTML 5;CGM (Computer raphics Metafile), CDR (Corel Draw), WMF

(Windows Metafile Format);

Ferramenta para Sketch muito importante criar Sketches ou rascunhos das imagens de seus

ames. Nada impede que voc use papel e lpis para isto, mas um Ske-tch digital tem a vantagem de poder ser utilizado diretamente. Eu me lembro quando criava ames para Windows e desenhava a imagem em papel para depois passar por um Scanner.

O ideal ter algum dispositivo para digitalizao de desenho livre, como uma mesa digitalizadora, que um tablet (no confundir com Tablet Mo-bile), que tem uma caneta especial e permite capturar seu desenho manual. Outra opo usar algum aplicativo de desenho em um Tablet mobile, como o iPad (ou algum dispositivo Android).

Eu costumo usar o Sketchbook Pro for iPad, da AutoDesk. um progra-ma barato e muito fcil de usar e que me permite criar imagens rapidamente, como a da figura a seguir.


Ilustrao 8: Rascunho de personagem de ame

Utilizando uma caneta para iPad, consigo desenhar rapidamente e at colorir a imagem, sem grande sacrifcio, pois posso apagar partes e corrigir rapidamente.

Ferramentas para desenho RasterNa minha opinio, a melhor ferramenta para edio de imagens raster o

PhotoShop, da Adobe. No h dvida alguma sobre isso. Porm, ele tem um custo de licena relativamente alto, com relao a outras alternativas. Na mi-nha opinio, se voc tiver condio, compre logo a licena da Adobe Creative Suite 6, que j vem com tudo o que voc pode necessitar para criar grficos.

Porm, se voc um Indie amer, provavelmente no estar to moti-vado assim para investir uma alta soma, especialmente se estiver comeando. Mas lembre-se: o investimento se pagar com a qualidade e facilidade de uso dos produtos da Adobe.

A opo mais popular de editores raster gratuitos o Gimp (http://www.gimp.org/) - NU Image Manipulation Program. um editor poderoso, com interface simples, porm dotado de muitos efeitos interessantes. H verses para MS Windows, Mac OS X e Linux. Entre outras coisas, o imp permite:

Trabalhar com transparncias; Trabalhar com vrios formatos diferentes de imagem, inclusive

SVG;

http://www.gimp.org/http://www.gimp.org/


Criar imagens com mltiplas camadas, que podem ser superpostas; Criar animaes em GIF; Selecionar partes da imagem de vrias formas: retangular, elptica,

livre, por cor etc; Usar vrias ferramentas nativas de transformao, cor e pintura; Usar vrios filtros de efeitos, como: entalhar, esculpir, realar, pin-

tura a leo, clares etc;

Ilustrao 9: Exemplo de uso de filtro de clares do imp

Uma opo profissional de custo relativamente mais baixo o Corel Painter (http://www.corel.com/corel/product/index.jsp?pid=prod4030123&cid=catalog3590073&segid=2100019&storeKey=br&languageCode=pt). Ele permite baixar uma verso de avaliao (30 dias) que d uma boa ideia dos seus recursos, porm s est disponvel para MS Windows e Apple Mac OS X. melhor do que o Gimp em alguns aspectos, como os recursos de pintura digital.

Ferramentas para desenho vetorialVoc pode trabalhar com imagens vetoriais em seu game. Em meu livro an-

terior Mobile ame Jam (www.mobilegamejam.com) ns utilizamos imagens vetoriais, sendo desenhadas em um Canvas. Porm, isto pode demandar re-cursos de processador, caso seu game seja muito complexo. Outra maneira de trabalhar com imagens vetoriais cri-las em um editor de imagens vetoriais e, posteriormente, converter os arquivos em algum formato raster. O Gimp faz isto com perfeio.

http://www.corel.com/corel/product/index.jsp?pid=prod4030123&cid=catalog3590073&segid=2100019&storeKey=br&languageCode=pthttp://www.corel.com/corel/product/index.jsp?pid=prod4030123&cid=catalog3590073&segid=2100019&storeKey=br&languageCode=pthttp://www.mobilegamejam.com/


Comparao entre renderizao raster e vetorialA renderizao raster muito rpida e o trabalho pode ser dividido com a

PU (raphics Processing Unit), evitando lags no game. Porm, mais su-jeita s diferenas de densidade e resoluo entre os equipamentos, exigindo verses diferentes ou ento operaes de resizing, que podem resultar em arquivos serrilhados (pixelados, uma consequncia do processo de reduo / ampliao).

J a renderizao vetorial uma operao de desenho completa e, geral-mente, executada na CPU. Existem alguns artigos interessantes sobre tc-nicas para utilizara a GPU na renderizao de desenhos vetoriais, entre eles este, da NVidia: http://http.developer.nvidia.com/PUems3/gpugems3_ch25.html, porm, no a forma comum de se trabalhar. A vantagem da renderi-zao vetorial a suavidade do desenho, que pode ter sua escala facilmente aumentada ou diminuda. Alm disto, os arquivos vetoriais so menores e no necessria mais de uma verso de cada imagem.

De qualquer forma, eu sempre crio a imagem dos meus games em formato raster (usando o Sketchbook pro) e depois converto para formato vetorial. No final, eu converto as imagens vetoriais finalizadas em formato raster, com um arquivo para cada tamanho (resoluo / densidade) de dispositivo.

Ilustrao 10: Um ensaio de personagem

Na figura anterior, vemos dois ensaios de uma personagem de game que eu estou criando. O da esquerda (raster) foi criado rapidamente no Sketchbook pro. Note como ainda mantive as linhas de construo que usei. A imagem da direita feita em formato vetorial (no aplicativo iDesign, para iPad). Eu tenho a tendncia de criar personagens em estilo mang, porm, resolvi dar

http://http.developer.nvidia.com/GPUGems3/gpugems3_ch25.htmlhttp://http.developer.nvidia.com/GPUGems3/gpugems3_ch25.html


uma ocidentalizada no rosto (arredondando e diminuindo a inclinao dos olhos). Mas ficou do jeito que eu queria: uma personagem meio rebelde e misteriosa.

Eu no vou trabalhar com a imagem vetorial, mas vou utiliz-la para criar imagens raster. O desenho vetorial me ajuda a criar imagens mais perfeitas, j que eu no tenho muito talento para desenho manual.

A ferramenta que eu gosto de usar para criar desenhos vetoriais o iDesign para iPad, da Touchware (https://itunes.apple.com/us/app/idesign/id342790226?mt=8). Ele barato (cerca de US$ 5,00), possui os recursos b-sicos de edio vetorial, como: curvas de Bzier, auto fechamento, pintura, rotao, combinao com imagens de fundo e at gradientes.

Outra boa ferramenta, na minha opinio o Fireworks, da Adobe (http://www.adobe.com/br/products/fireworks.html), uma ferramenta voltada para web designers, que permite trabalhar imagens vetoriais e raster tambm. Em-bora seu uso seja mais voltado para criao de Web designs (sua integrao com CSS fantstica), tambm permite gerar temas para JQuery Mobile e tra-balhar imagens vetoriais. Seu preo um pouco alto, assim como toda a suite da Adobe, mas acredite: o investimento se pagar em produtividade!

claro que no podemos sequer falar em grficos vetoriais sem mencionar o Corel Draw (http://www.corel.com/corel/product/index.jsp?pid=prod4260069), cujo preo da licena mais competitivo e os recur-sos so fantsticos.

Como eu mencionei anteriormente, eu uso o iDesign, da TouchWare (), na verso iPad. Embora tenha menos recursos que os produtos mencionados, tem baixo custo e funciona muito bem no iPad. Sua licena custa cerca de US$ 5,00, e vem com um tutorial muito fcil de entender.

Agora, se voc quer uma opo gratuita, eu recomendaria o Inkscape (www.inkscape.org), que Open Source e gratuito. Ele possui verses para MS Windows, Apple Mac OSX e Linux. muito fcil de usar e permite gerar a maioria das imagens que voc necessita. Suas caractersticas importantes so:

Trabalha com camadas de desenhos; Gera arquivos raster a partir dos desenhos vetoriais; Consegue importar vrios formatos de imagem, tanto vetoriais como

raster; Possui vrios filtros grficos sensacionais.

https://itunes.apple.com/us/app/idesign/id342790226?mt=8https://itunes.apple.com/us/app/idesign/id342790226?mt=8http://www.inkscape.org/


Ilustrao 11: O ensaio de personagem no Inkscape

O Inkscape pode ser gratuito, mas cheio de surpresas. Assim como o imp, ele tambm tem filtros sensacionais, que permitem dar um efeito pro-fissional em seus trabalhos. Para dar um exemplo, eu transformei a imagem da minha personagem em um android, com efeito Glowing Metal.

Ilustrao 12: Imagem robotizada


game engineSUm Game engine uma ferramenta para facilitar o desenvolvimento de ga-

mes. Eles so compostos por editores, bibliotecas e interface de programao, que podemos utilizar para criar nossos prprios games. Existem game engines para vrias plataformas, seja 2D ou 3D, com nveis diferentes de facilidade de uso.

Adotar um Game engine pode aumentar sua produtividade, permitindo que voc se concentre mais no ame design (incluindo a jogabilidade), ao invs de se preocupar com detalhes de animao, game loop etc.

HTML 5 + JavascriptExistem vrios ame engines para HTML 5 + Javascript. J que a Adobe

discontinuou o desenvolvimento do Flash player para dispositivos mveis, a galera que fazia jogos em Flash est migrando para HTML 5 e Javascript.

Em meu ltimo livro, Mobile Game Jam, eu mostrei como desenvolver games mveis usando HTML 5 e Javascript, e mostrei um engine multiplata-forma: o Phoneap (Cordova). Mas no mostrei nenhum ame engine desta plataforma.

O ImpactJS (impactjs.com) uma boa opo. Ele permite criar games em HTML 5 + Javascript para Desktops e dispositivos mveis. Vem com um editor de nveis (o Weltmeister), que facilita muito a criao de cenrios para diferentes nveis do jogo. Ele vem com ferramentas de depurao e empacota-dores, que permitem colocar sua aplicao diretamente na AppStore iOS. Seu custo relativamente barato (US$ 99,00).

Existem vrios outros game engines para HTML 5 + Javascript, porm o ImpactJS, na minha opinio, o mais profissional.

NativosUm Game engine nativo aquele que possui bibliotecas nativas e executa

fora do ambiente do Browser. Geralmente, apresentam melhor performance do que os ame engines baseados em HTML 5 + Javascript.

O Cocos2D for iPhone (http://www.cocos2d-iphone.org/) um port do Game engine original Cocos2D, para Python. bastante popular, com v-rios games famosos no mercado. Ele vem com um ambiente de desenvolvi-mento (CocosBuilder), a biblioteca do ame engine em si (cocos2D), e um engine de fsica (Chipmunk). Existem verses para HTML 5 (http://cocos2d-x.


googlecode.com/files/Cocos2d-html5-v2.1.zip) e Android (http://code.google.com/p/cocos2d-android/). gratuito.

O AndEngine (http://www.andengine.org/blog/) um game engine para Android, similar ao Cocos2D. Tambm gratuito e open source.

Para quem quer um engine mais profissional, tem o Antiryad Gx (http://www.arkham-development.com/antiryadgx.htm), que permite criar games 2D ou 3D para vrias plataformas, entre elas: iOS e Android. Ele possui vrios tipos de licenas, desde gratuita at enterprise (900 euros).

Porm, se voc quiser realmente detonar com um ame 3D animal, use o UDK Unreal Development Kit (www.udk.com) para iOS, Android, PS3, Xbox, Windows, Mac OSX etc. Com o UDK, voc pode desenvolver seu game sem custo e, quando estiver pronto para publicar, pagar uma taxa de US$ 99,00 (nica). Porm, h mais cobranas se voc alcanar US$ 50.000,00 em vendas.

Finalmente, temos o Unity (http://unity3d.com/), que um engine para ga-mes 3D muito interessante. A verso bsica gratuita e permite criar games para MS Windows e Apple Mac OSX, e voc pode criar games comerciais com ela. Se quiser criar games para dispositivos mveis, voc deve adquirir os add-ons especficos, como: Unit iOS (US$ 400,00) e Unit Android (US$ 400,00). Tambm existem as licenas pro para estes ambientes. O Unity sensacional e vem com um editor fantstico.

Ilustrao 13: Jogo que estou criando com o Unity

Se voc vai criar um game 3D, melhor considerar uma ferramenta de de-senho apropriada. Eu recomendo o AutoDesk Maya (http://usa.autodesk.com/maya/), apropriado para criao de personagens 3D com animao. Agora, se

http://code.google.com/p/cocos2d-android/http://code.google.com/p/cocos2d-android/http://www.arkham-development.com/antiryadgx.htmhttp://www.arkham-development.com/antiryadgx.htmhttp://unity3d.com/http://usa.autodesk.com/maya/http://usa.autodesk.com/maya/


preferir um software gratuito, o Blender (http://www.blender.org/) uma ex-celente opo. E os modelos 3D criados com o Blender podem ser importados em game engines 3D, como o Unity.

Usar a plataforma nativaEmbora um Game Engine possa acelerar o desenvolvimento do seu game,

ele tambm tem algumas desvantagens, entre elas: Ficar preso aos recursos disponveis no Engine; Complexidade de aprender a API; Preo da licena; Dependncia de suporte (ou comunidade) para Bugs;

Alm destas possveis desvantagens, necessrio considerar que as APIs das plataformas nativas, tanto do Android, como do iOS, permitem criar ga-mes com recursos avanados, como o OpenGL ES, por exemplo.

Mesmo que voc queira utilizar um ame Engine, eu considero funda-mental que voc saiba o que est acontecendo e, para isto, nada melhor do que criar um game na mo, sem engine algum. Depois, se considerar rele-vante para o seu projeto, poder escolher um Game Engine apropriado, porm saber avaliar e usar melhor as funcionalidades, pois j sabe os detalhes de programao de games.

ambienteS multiplataformaFora os Game engines, existem alguns ambientes multiplataforma para

criao de aplicaes mveis, alguns deles com recursos para ames. Para comear, vou vender o meu peixe. No nosso portal The Code Bakers (www.thecodebakers.org), criamos um framework de aplicaes mveis multiplata-forma, o AAMO (www.aamoframework.org). Ele baseado em Lua e pode ge-rar aplicaes em iOS e Android. Futuramente, haver verses para Desktop e tambm um game engine embutido: o AAMO Xtreme. O AAMO totalmente gratuito e Open Source, mas ainda no contempla os recursos para criao de Games.

Outro ambiente multiplataforma interessante o CoronaSDK (http://www.coronalabs.com/products/corona-sdk/). Ele tambm baseado na linguagem Lua e possui recursos muito interessantes para criao de games. Ele foi escolhido pela EA (famosa por vrios games) para criar seu jogo mvel: World Smack (http://www.coronalabs.com/blog/2012/11/08/corona-spotlight-ea-chooses-corona--for-word-smack/). O corona no gratuito, mas tem licena de baixo custo, s necessria quando voc for publicar o game.

http://www.thecodebakers.org/http://www.thecodebakers.org/http://www.aamoframework.org/http://www.coronalabs.com/products/corona-sdk/http://www.coronalabs.com/products/corona-sdk/http://www.coronalabs.com/blog/2012/11/08/corona-spotlight-ea-chooses-corona-for-word-smack/http://www.coronalabs.com/blog/2012/11/08/corona-spotlight-ea-chooses-corona-for-word-smack/


prototipadoreSUm grande recurso, geralmente ignorado pelos desenvolvedores de game,

a prototipao. Este recurso nos permite capturar, de maneira simples e cla-ra, os requisitos de uma aplicao. Como games possuem requisitos muito subjetivos (jogabilidade um deles), a prototipao pode ser um excelente instrumento para acelerar o desenvolvimento, evitando retrabalho.

Seja utilizando um Game engine ou no, o comprometimento do projeto de um game cresce rpida e exponencialmente. Em poucas semanas, j temos tanto cdigo escrito que criamos um forte comprometimento com ele, deixan-do de ver coisas bvias. Com um prottipo isto evitado, pois podemos jogar tudo fora e comear novamente.

Felizmente, existem alguns softwares excelentes para prototipao de ga-mes e aplicaes em geral. Eu uso dois deles, que considero excelentes.

Para comear, gostaria de falar do Codea (http://twolivesleft.com/Codea/), uma ferramenta que roda diretamente (e apenas) no iPad. Com ela, podemos programar diretamente no iPad, sem necessidade de um laptop ou desktop. Infelizmente, s existe verso para iPad. Podemos at baixar o Codea Runti-me (https://github.com/TwoLivesLeft/Codea-Runtime) e distribuir a aplica-o na AppStore. A licena do Codea custa US$ 9,99 e acredite: ela se paga rapidamente!

Vou mostrar o prottipo de um game que foi feito originalmente no Codea em menos de 4 horas! Eu aprendi a usar o Codea, aprendi a linguagem Lua e criei o Game enquanto estava hospitalizado, aguardando uma cirurgia renal. Quando fui para a sala de cirurgia, o Game estava pronto. claro que era um prottipo, mas estava funcionando completamente.

Eu sou f do Codea, porm, fiquei completamente atnito e pasmo quando conheci a oitava maravilha do mundo: O Processing (http://processing.org/)! aquele tipo de coisa bombstica que nos faz gritar: Para tudo! O Processing um ambiente de simulao e prototipao, que j vem com tudo em cima para criar Games. Ele usa uma linguagem tipo java, mas tambm permite exportar seu projeto para HTML 5 + Javascript e at mesmo Android, ou seja: lava, passa, cozinha e, ainda por cima: gratuito!

bibliotecaS auxiliareSComo j discutimos, um Game um projeto muito complexo, com vrias

macrofunes diferentes. Certamente, podemos utilizar Game engines para nos auxiliar, porm, ainda existem alguns motivos importantes para estudar-mos as bibliotecas em separado:

http://twolivesleft.com/Codea/http://processing.org/


1. Custo. Se criarmos diretamente o game, no necessitaremos adquirir licenas e, como j discuti, alguns Game engines possuem requisitos de licena meio complexos;

2. Domnio. Se voc souber o que est por baixo do cap, vai saber tirar maior proveito dos componentes para seu Game;

Uma ferramenta importante um engine grfico que permita utilizar os re-cursos de acelerao de sua placa de vdeo (PU raphics Processing Unit) e esta ferramenta a biblioteca OpenGL ES (http://www.khronos.org/opengles/), que uma verso da OpenGL (http://www.opengl.org/) para dispositivos m-veis. A principal vantagem renderizar imagens mais rapidamente, utilizando multiprocessamento compartilhado entre CPU e PU, tanto para grficos 2D como para 3D. Tanto no iOS como no Android, existem recursos para facilitar o uso do OpenGL ES na criao de games.

E, finalmente, temos a biblioteca Box2D (http://box2d.org/), que um phy-sics engine, ou seja, uma biblioteca que fornece funes fsicas, como: movi-mento, foras e colises para nossos games parecerem mais realistas. Para ter uma ideia de quanto a Box2D importante, o game Angry birds a usa como seu physics engine.

http://www.khronos.org/opengles/http://box2d.org/

Captulo 4 Prototipao do game

Bem, vamos comear realmente o nosso game. Imaginemos uma ideia simples e vamos tentar criar um prottipo com ela, de modo a avaliar se est boa para virar um Game.

Tudo comea com uma ideia. Que tal criarmos um shooting game? Afi-nal de contas, shooting games so fceis de criar e, geralmente agradam a todos. Podemos comear com um rascunho (Sketch) do game. Eu pensei em um game de escapar de asteroides. Voc est em uma nave e tem que manobrar em um campo de asteroides, evitando colidir com eles. Voc ganha pontos de acordo com a distncia percorrida, em anos-luz.

Uma dica: se voc comear a complicar, pensando coisas do tipo: j tem muita coisa assim, preciso criar algo diferente... seu projeto no vai andar. Voc vai criar um prottipo do jogo, logo, no o momento de pensar nisso. Depois, voc pode fazer as otimizaes que desejar.

Um rascunho tudo o que precisamosEu peguei meu iPad e, usando o Sketchbook, criei vrios desenhos. Eu

fui desenhando o que me vinha mente, sem me preocupar muito com esttica ou funcionalidade. O desenho que mais gostei foi o da prxima figura.

A nave se move para cima e para baixo, e os asteroides vm em sua di-reo, pois ela est se movendo para a frente. Existem asteroides bons (os brilhantes), que repem a energia da nave, e os asteroides ruins (opacos), que podem destruir a nave. Caso ela colida com um asteroide ruim, sua energia drenada, pois ela usa os escudos para impedir sua coliso.


Ilustrao 14: Rascunho do jogo

Se o seu jogo tiver mais telas ou nveis, voc pode ir criando rascunhos para cada um deles. O importante colocar a idea no papel (digital), antes que voc se esquea.

uSando o codeaO Codea um ambiente de programao sensacional. simples e prtico,

permitindo criar rapidamente jogos e simulaes grficas. Ele uma aplicao para iPad, que est disponvel na AppStore por cerca de US$ 10,00.

Ilustrao 15: A tela inicial do Codea

Captulo 4 - Prototipao do game 35

Os pontos positivos do Codea so:1. Tem recursos que facilitam o desenvolvimento rpido de games;2. J vem integrado com o engine de fsica Box2D;3. Usa a linguagem Lua (www.lua.org), que simples e pouco verbosa;4. Vem com Spritepacks (conjuntos de imagens) e outros recursos para

criao de games.Porm, o Codea carece desesperadamente de documentao decente. No

parece um produto comercial e, certamente, no tem o suporte necessrio, em caso de problemas. O site da empresa, Twolivesleft.com, muito minima-lista e no tem uma documentao formal. Existem vrios tutoriais (alguns criados por terceiros) que explicam rapidamente como ele funciona.

claro que podemos criar Games com o Codea e distribuir na AppStore, pois ele tem um Codea Runtime (https://github.com/TwoLivesLeft/Codea--Runtime) que permite fazer isto. Porm, quando se trata de criar um produ-to comercial, eu sou muito conservador, pois, em caso de problemas, o meu cliente vai reclamar comigo e eu, como desenvolvedor do Game, no terei a quem recorrer. por isso que eu no uso o Codea para desenvolvimento, mas apenas para prototipao.

No Codea, podemos criar cdigo-fonte para responder a eventos e para criar classes, que sero utilizadas no ame. A linguagem a Lua (www.lua.org), criada pela PUC-RJ. Lua uma linguagem simples, intuitiva e pouco verbosa, cujo aprendizado extremamente simples. Ns iremos ensinando Lua conforme o prottipo for se desenvolvendo. Alis, foi assim que eu apren-di a usar Lua. S para comear, Lua canse sensitive e no precisa de ponto e vrgula no final da linha. Os comentrios so iniciados por --.

Um tutorial rpido em CodeaVamos fazer uma porcaria em Codea para voc pegar o jeito. Comece

iniciando um novo projeto, na tela do Codea (Ahn, galera: s funciona no iPad, ok? Se voc no tem um iPad, leia a prototipao no Processing). Escreva um nome qualquer para o projeto, por exemplo: bola. Ele vai criar todo o cdigo do projeto, que apenas escreve Hello world na sada.

http://www.lua.org/http://www.lua.org/http://www.lua.org/


Ilustrao 16: O cdigo gerado pelo Codea

Ele gerou um cdigo-fonte muito simples, como podemos ver na figura. O arquivo Main o arquivo principal de sua aplicao Codea, ele contm algumas funes de Callback, ou seja, so invocadas pelo engine do Co-dea em determinadas situaes. A primeira funo a setup, que chama-da na inicializao. Neste caso, estamos usando a funo print para gerar uma mensagem na sada da execuo. A outra, a funo draw, invocada a cada novo frame gerado. Neste caso, ela apenas limpa a tela, com a funo background (, , ), e ajusta a grossura da caneta para desenhos em 5 pixels, com a funo strokeWidth(5).

Se voc quiser ver uma referncia rpida (algo semelhante a um Help), toque no smbolo do Codea na tela principal ( um quadrado verde com dois C, um grande e um pequeno).

Como eu rodo o programa?Vamos ver uma referncia rpida dos comandos do editor:

Seta para a esquerda, no canto superior esquerdo: volta ao incio; Boto +, no canto superior direito: cria uma nova classe ou um

arquivo vazio; Tabs na parte superior da tela: alternam entre os arquivos; X no canto inferior esquerdo: fecha o arquivo; Boto play, no canto inferior direito: executa o programa;


Clique no boto play, no canto inferior direito da tela do editor e voc ir para o ambiente de execuo.

Ilustrao 17: O ambiente de execuo

O ambiente de execuo bem simples. Ele tem um painel de proprieda-des, um de output (para sada de comandos print), e uma barra de controle. A barra de controle est sempre no canto inferior esquerdo, e tem alguns botes:

Seta para a esquerda: termina o programa; Pausa / Play: para ou continua a execuo do programa; Seta curva: reseta o programa, executando do incio; Mquina fotogrfica: tira uma foto instantnea do programa; Filmadora: filma a execuo do programa;

Agora, vamos fazer uma coisa mais legal. Vamos criar um foguete que se move. Altere o arquivo Main para acrescentar as linhas em negrito abaixo:

-- bola

-- Use this function to perform your initial setupfunction setup() print(Hello World!) x = 0 y = HEIGHT / 2 supportedOrientations(PORTRAIT_ANY) displayMode(FULLSCREEN)end


-- This function gets called once every framefunction draw() -- This sets a dark background color background(40, 40, 50)

-- This sets the line thickness strokeWidth(5)

-- Do your drawing here x = x + 1 if x > WIDTH then x = 0 end sprite(SpaceCute:Rocketship,x,y)end

O resultado da execuo um foguete que sai do canto esquerdo da tela e vai at o canto direito, recomeando quando atinge o fim.

Ilustrao 18: O foguete se move pela tela

Vamos ver o que mudamos. Para comear, criamos duas variveis, x para posio horizontal e y para vertical. Note que o valor de y a metade da tela (HEIGHT / 2) fixamos a orientao em portrait, pois queremos que


o iPad seja segurado em p. Faz sentido, pois os asteroides ficaro mais prximos. Depois, retiramos os painis que aparecem do lado esquerdo com a funo displayMode(FULLSCREEN).

Sempre que for necessrio criar um novo frame, a funo draw ser in-vocada. E, neste momento, ela vai apagar a tela e desenhar um sprite (uma imagem) de uma das colees de sprites que j vem com o Codea. um pe-queno foguete com um tripulante. Ele vai desenhar sempre na posio indica-da pelas variveis x e y. O Codea usa a orientao cartesiana correta, com o ponto inicial (0,0) no canto inferior esquerdo.

A cada chamada da funo draw, vamos incrementando o valor de x. Quando ele se torna maior que a largura da tela (WIDTH), ns voltamos ao valor zero.

Criando o prottipo do AsteroidNuts no CodeaAgora, que j entendemos um pouco do Codea, vamos tentar criar nosso

prottipo. Para comear, temos dois tipos de ame Objects: Nave e Asteroide. A nave um Player Object, ou seja, controlado pelo usurio, e o asteroide um NPC.

Todo o cdigo-fonte pode ser baixado, logo, no necessrio digitar os comandos. Veja na Introduo. Tem um arquivo Asteroid.txt (..\Codigo\AsteroidNuts_Codea\Asteroid.txt) com a classe toda.

No importa se temos dois tipos de asteroides (bom e ruim), pois so ape-nas variaes de propriedades de um asteroide.

Nossa classe tem que armazenar os atributos de posio do Asteroide, alm do sei tipo (bom ou ruim). O Codea usa a API Nspire (http://www.inspired--lua.org/2011/05/5-object-classes/), que facilita a criao de classes. Para criar uma nova classe, abra o editor do projeto e clique no boto +, que fica no canto superior direito. Escolha Create new class e d o nome Asteroid. Voc vai notar que j tem alguns comandos:

Asteroid = class()

function Asteroid:init(x) -- you can accept and set parameters here self.x = xend

http://www.inspired-lua.org/2011/05/5-object-classes/http://www.inspired-lua.org/2011/05/5-object-classes/


function Asteroid:draw() -- Codea does not automatically call this methodend

function Asteroid:touched(touch) -- Codea does not automatically call this methodend

A linguagem Lua no suporta a criao de classes diretamente, porm como sendo uma linguagem baseada em prottipos, permite modificar o com-portamento e caracterstica de objetos dinamicamente, imitando o conceito de classes. A API Nspire tem a funo class() que facilita a criao de classes. Neste caso, criamos um objeto Asteroid e acrescentamos a ele uma proprie-dade (x) e trs mtodos (init, draw e touch).

O mtodo init ser invocado sempre que quisermos pegar um novo obje-to da nossa classe, por exemplo:

ast1 = Asteroid(10)Os mtodos draw e touched so dicas que deveramos implementar

estes mtodos e invoc-los, quando necessrio. O Codea inseriu comentrios indicando que estes dois mtodos no sero invocados automaticamente.

Para comear, vamos trabalhar nosso construtor (o mtodo init). Primei-ramente, temos que pensar em como iniciar o Asteroide. Cada Asteroide deve-r surgir no canto direito da tela, em uma altura varivel. Haver uma faixa de valores no eixo das ordenadas (Y), onde os asteroides podero surgir. Eu no quero usar a tela toda, pelo menos neste prottipo. Ento, faz sentido passar-mos em passar os limites para o construtor da classe, de modo que este possa gerar um asteroide dentro da faixa esperada.

function Asteroid:init(upper,lower) -- you can accept and set parameters here local tipo =math.random(1,100) self.position = vec2(100,50) self.dimension = vec2(50,50) self.position.x = WIDTH - 100 self.position.y = math.random(upper,lower) if tipo > 80 then self.type = 2 else self.type = 1 endend


O prefixo Asteroid: indica que este um mtodo a ser atribudo aos objetos do tipo Asteroid, e o sufixo init o nome do mtodo. O prefi-xo self., em alguns comandos de atribuio, se refere ao objeto da classe Asteroid, logo, self.type = 2 significa que estamos atribuindo 2 pro-priedade type, do objeto. Se ela no existir, ser criada automaticamente.

Lua uma linguagem de tipagem dinmica, ou seja, cada varivel tem seu tipo atribudo dinamicamente (e pode mudar). Passamos dois parmetros para o construtor: upper limite superior no eixo das ordenadas, e lower li-mite inferior. Ns criamos trs propriedades no construtor:

position: do tipo vec2 (do Codea), que retorna um vetor com coordenadas bidimensionais (x e y). Armazena a posio atual do asteroide;

dimension: igualmente vec2, armazena a largura e altura da caixa que contm a figura do asteroide;

type: do tipo number (Lua), que armazena o tipo do asteroide, se ele bom (type = 2) ou ruim (type = 1). claro que isto po-deria ser resolvido melhor por hierarquia ou composio, mas um prottipo, logo, descartvel;

Nossa estratgia para decidir se vamos criar um asteroide bom ou ruim apenas aleatria. Poderamos levar alguns fatores em considerao, como o nvel de energia do jogador e a quantidade de acertos que ele tem, mas, para efeito de prottipo, vamos deixar assim. eramos um nmero aleatrio entre 1 e 100 (math.random(1,100)) se ele for maior que 80, ns o transformamos em bom.

Inicialmente, calculamos a posio horizontal (abscissas) em WIDTH 100. Depois vou explicar o motivo, mas est relacionado com o tamanho do asteroide, que 50. E calculamos a posio vertical (ordenadas) com um n-mero aleatrio entre o limite inferior e o superior (math.random(upper,lower)).

Agora, demos que desenhar um asteroide. O melhor local para fazer isto no mtodo draw. Ns invocaremos o mtodo draw sempre que desejar-mos redesenhar um objeto Asteroid especfico.

function Asteroid:draw() -- Codea does not automatically call this method spriteMode(CORNERS) if self.type == 2 then sprite(Tyrian Remastered:Energy Orb 1, self.position.x, self.position.y, self.position.x+self.dimension.x,


self.position.y+self.dimension.y) else sprite(Tyrian Remastered:Eggstroid, self.position.x, self.position.y, self.position.x+self.dimension.x, self.position.y+self.dimension.y) endend

A primeira coisa que fizemos foi mudar o modo de desenhar um sprite, que uma imagem carregada na tela. Por default, o Codea sempre considera a posio de um sprite (coordenadas x e y) como o centro da imagem. Eu prefiro trabalhar com os cantos e especificar o tamanho da imagem, ento eu mudei o modo de desenho para CORNERS (spriteMode(CORNERS)), que significa: x e y sero o canto inferior esquerdo da caixa que contm o sprite, e os parmetros w e h sero, respectivamente, as coordenadas do canto superior direito da mesma.

Se for do tipo 2, um asteroide bom, logo, eu uso um sprite da biblio-teca do Codea, que representa uma esfera brilhante. Eu uso a funo sprite para desenhar a figura do ast

Documents

Manual do Indie Game Developer - Versão Android e iOS.pdf