As much as possible I like to tackle topics I'm interested in when fulfilling an open-ended coursework brief like 'make a Flash game'. So for this project I decided to look into procedural generation, which led to me making an infinite runner game. This isn't a particularly advanced version of procedural generation, but it's one I worked out completely by myself so I'm quite proud of it.
Most infinite runner games feature auto-running, with the player jumping and performing other actions as needed to keep the run going or collect bonuses. Having decided on the genre I turned to The Spriter's Resource for inspiration on the theme. I came across the artwork for an old mobile game (pre iPhone/Android) called Superman Batman: Heroes United. I liked the art style, the sprite sheets were easy to work with and the tiled backgrounds were ideal. So the stage was set: an infinite auto-runner game featuring Batman, where the player would jump, punch, grapple and glide across the rooftops of Gotham. I even had an antagonist in the form of Darkseid.
The first thing I worked on was randomly generating the buildings, or rather the platforms which would later become buildings. I knew that each building would be comprised of many tiles, as per the art style. This led to a simple prototype wherein a fixed number of buildings would exist in the world at a time. When a building went off the left edge of the screen it was destroyed and a new one would be created to the far right, off-screen. This worked but the constant creation and deletion of large numbers of tiles was very inefficient and needlessly performance heavy.
To counteract this I created a buffering system to reuse existing tiles. When tiles went off the left edge they were deallocated from their current building and added to the buffer. When there were enough tiles in the buffer to create the next building they would be allocated to that building and changed accordingly. The special tiles along the top row of each building had some extra functionality to allow for collisions, so those were kept in a separate buffer. There were two building variants which can be seen in the screenshots; one with a brick edge and one with a wider pillar. Each building had a 50/50 chance of either and the tiles would have their images changed accordingly. The height and distance from one building to the next was randomized within the constraints of what was reachable by the player, i.e. a building wouldn't spawn at an unattainable jump height compared to it's predecessor.
This was the first game I made which had a proper state machine controlling the behavior and therefore animation of a character, with the player's inputs manipulating the state based on context. As an example, if Batman were in the running state and the player pressed the jump button then he would enter the jump state and the animation would change accordingly. But if the player pressed the jump button again while in the air then it would toggle between the falling and gliding states. There were states (and animations) for running, jumping, falling, punching, grappling and gliding. If you were to ask someone for a set of iconic Batman actions then punching bad guys, gliding and using the grappling gun would likely rank pretty highly. As it happens these work pretty well as game mechanics too.
When a new building is generated there is a simple chance based selection as to what type it is. It may just be a normal building, it may have an enemy atop it, it may be part of a two-building set for gliding, or part of a three-building set for grappling. The gliding set consisted of a tall building followed by a gap too large to jump, followed by a shorter building. The grappling set consisted of two buildings of equal height placed an unreachable* distance apart, with a special grapple building placed between them. The player could slow their descent when falling by pressing the jump button again to enter glide mode. When near a grapple building they could press the grapple button and swing across in a long arc.
These special building sets would be spawned in together, requiring the buffers to fill with a large number of tiles before they could be created. In the end there were 1020 tiles in the normal tile buffer and 100 in the special top-row buffer. This gave a good balance between having enough tiles in the buffers to reliably spawn buildings off the edge of the screen, without having so many that the cost of managing them detracted from the benefits of the system. It was a fun, interesting solution to work out and build. A similar, smaller system is also used to generate the random tile-based cityscape in the background of the game.
Failing to punch a bad guy doesn't negatively effect the player, but punching them will get you bonus points which greatly boost your score. I'm a big fan of Rocksteady's Batman: Arkham Asylum and wanted to pay tribute somehow, so I decided to have the score displayed over a large black bat. Whenever the player successfully punches an enemy, a "+100" appears beneath the display, similar to the HUD for the combat system in Asylum.
Having gone all-in on the Batman theme, I knew I had to find some appropriate music. The 1960s theme was a given. But I also wanted a couple of other tracks and spent several hours listening to remixes and original songs on soundcloud. With Batman being such a huge cultural icon, there was a lot to get through. Eventually I found a couple of tracks which work well enough as backing music for the game.
There are just 3 sound effects in the game. There's a fantastically over-the-top punch effect which I really love. There's also a sound for the grapple, which is actually a section of a recording of someone cracking a bull-whip. Finally, I found I needed a sound effect to let the player know when they entered the gliding state, as the animation is the same as the falling animation with a slower rate of descent (the mobile game the art is from had no glide mechanic). For that I actually found a recording called "cape swoosh" which was made for an endearingly low-budget Batman skit on YouTube (which you can watch here).
This is the biggest project I've made so far and also the first game I've made which isn't just a wholesale rip-off of something else, as such I'm quite proud of it.
*The gap between the grapple buildings is actually just small enough to glide across if you time it perfectly. Try it. I dare you.