Mini Plane: het ontwikkelen van een iPhone-game, deel 2 (dagboek)

In het vorige artikel zijn we begonnen aan het iPhone-avontuur: de game Mini Plane omzetten naar het iPhone-platform. Ons eerste plaatje staat op het scherm en of het nou een stilstaand plaatje is of een plaatje dat straks gaat bewegen: ze werken allemaal op dezelfde manier.
Ik maak voor de plaatjes gebruik van de zogenaamde OpenGL-mode. Van wat ik overal op internet begreep, is het toch wel de betere oplossing voor snelle games. Het voordeel daarnaast is dat dit ook te gebruiken is op Android en het in de toekomst voor mij dus wat makkelijker kan worden om de spelletjes op beide platformen te maken. Er is gelukkig veel te vinden over programmeren in OpenGL-mode op iPhone en dat maakt het voor mij alleen maar makkelijker. Ik zal in de latere artikelen ook nog wat links geven naar goede resources, tutorials en andere informatie die ik gebruik tijdens het maken van Mini Plane.

Bewegende objecten

Wat de bewegende plaatjes betreft: ik zie games altijd op een vrij simpele manier. Je hebt een speelveld, met daarin objecten. Objecten zijn in dit geval de speler zelf, monsters, bonus-items, muntjes, diamanten, eigenlijk dus alles wat in je spelwereld te vinden is. De objecten doen niets anders dan bewegen van punt A naar punt B, allemaal afhankelijk van de spelregels. Dit kun je op elk spel testen, van het meest simpele spel tot het meest grote miljoenen kostende spel dat je op de Xbox 360 of PS3 kan vinden… ze werken allemaal hetzelfde!

De spelregels kun je heel ingewikkeld maken, of vrij simpel houden. Simpele regels wil overigens niet zeggen dat je spel ook simpel is!

In Mini Plane is het belangrijkste ons vliegtuigje en de regels voor het vliegtuigje zijn vrij simpel: je vliegt van links naar rechts met een bepaalde snelheid en als er verder niets gebeurt, dan daal je steeds sneller en sneller.
Als de speler het scherm aanraakt, dan stijgt het vliegtuig steeds iets sneller. De interactie met de speler is dus vrij simpel en valt onder het concept van ‘one-Button gameplay’: een enkele knop die het spel regelt en in dit geval is het hele iPhone-scherm de actieknop.

Achtergrond maken

Aan alleen een vliegtuig op het scherm kun je nog niet echt zien dat er beweging in zit. Dus we gaan een leuke achtergrond in het spel stoppen, op de manier die bekend staat als een ‘parallax background’. Dit is simpelweg een aantal verschillende lagen die los van elkaar op verschillende snelheden bewegen. De achterste laag is erg langzaam om het idee te wekken dat deze in de verte ligt en de voorste laag gaat sneller omdat deze dichter bij de speler ligt.

Gelukkig heb ik alle plaatjes al klaarliggen van de Android-versie en worden beide versies identiek aan elkaar. Dit omdat ik ook van plan ben de online-highscores in te bouwen, zodat Android- en iPhone-gamers gewoon tegen elkaar voor de nummer 1-positie kunnen vechten. Daarnaast is ook nog eens bijna alle broncode om de plaatjes te bewegen hetzelfde als de Android-versie, dus is het een simpele copy+paste-operatie. Alhoewel, de Mac heeft copy+paste natuurlijk op iets andere toetsen zitten dan ik als Windows-gebruiker gewend ben, dus mijn vingers raken regelmatig de verkeerde toetsen aan!

Na wat gemopper hier en daar hebben we uiteindelijk toch onze parallax layers aan de praat: een wolkenlaag, ver op de achtergrond dus de meest trage qua beweging, daarna een ‘faded achtergrondlaag, die weinig tot geen detail heeft, voor een beetje een mistig idee. En dan nog de meest aanwezige achtergrondlaag, waarin detail zit en die vrij snel over het scherm gaat.

Op Android kun je mooi gebruikmaken van een gradient-shader. Deze gebruik ik dan ook veelvuldig om een mooi luchteffect te maken van donker blauw naar lichtblauw… Helaas kent de iPhone dit niet, maar dat is snel op te lossen door een stilstaand en beeldvullend plaatje te tonen op de achtergrond. Zet daar de parallax-layers op en voilà! Onze bewegende achtergrond is klaar. Om het helemaal af te maken zetten we ons vliegtuigje ook nog op het scherm en kunnen we nog een aantal minuten verslijten, door met een vliegtuigje te vliegen dat verder niets kan! 😉

Zie hier alvast het resultaat met de achtergronden en het vliegtuig: