Garage Launched Games!

Garage Launched Games!

If you haven’t read Steve’s first blog entry, you should take it in. It describes how we started making games (or at least how we started to want to make games), and gives you an idea of how little time we really have to make games in our “spare” time. With kids and families, and work, etc, it is very difficult to find time to make games. Since that is what we want to do, we make them in the few hours a week we can spare.

I have spent the last few nights creating pre-alpha version of Retro Goes Berserk.

What I have done is finally create (what to me is) an acceptable running animation for my little hero creature. He kind of looks like a little green space man with a backpack. Currently he is controlled with the arrow keys. The Z key will fire his weapon. You can select from 3 different weapons by clicking on the 1,2,and 3 keys. I have uploaded a version to test. I’ll discuss some of the details of creating this pre-alpha below, and it might help to have tried it out.

Play the Pre-Alpha here

The first big problem I had to tackle was the collision detection between the little green space man and the walls of the room (those are the blue square things that kind of look like walls if viewed from above). Since each wall tile brick is only a 10×10 square, using tile based collision detection on the space man sprite that is considerably larger took a little extra time to figure out. Eventually I decided to do 3 checks per frame. Each of these checks looks at where the spaceman will be on the next frame after a key has been pressed in a certain direction. In essence, when the player clicks on the right arrow key, my code does all of the calculations and checks before you visually see the little space dude move on the screen. In the case of moving to the right, I check to see which tiles he would hit with his head, his feet, and his middle origin point on the next frame. If any of those are a tile with a wall in it, he is not moved. There are still some collision detection problems with the walls, but I think I have masked most of them with slightly clever wall designs.

After finally accomplishing the collision detection, I drew 3 tiny gun sprites that are swapped out on the space man when you press the 1,2, or 3 keys. I then applied a modified version of Steve’s Particle Explosion class with my bitMapAnimation code to create an explosion that can be seen when the bullets hit the walls. I added in a frame rate counter in the bottom right of the screen. A good way to test the FPS is to stand close to a wall (facing it) and fire the [3] key gun as fast as you can. I watched the frame rate counter dip as animated explosions are created, animated and removed in succession on the screen. I could only have about 8 explosion going before I got a frame rare dip. I decided to use special code and techniques I developed while build my still unreleased shooter called Retro Blaster. If you try hard enough, you can still probably see some dip as multiple explosions are being drawn. What you can’t tell if how low the frame rate would have dipped if those same explosions were movie clips running through their animation sequences in real time. You could probably only have 10 or 11 on the screen at once before there would be a noticeable drop in frame rate. The reason is that the ParticleExplosion class creates and uses a movie clip for each particle in the explosion. Each particle moves on each frame, changing size, alpha, position, and rotation. There can be 100’s of particles in one explosion. Flash 8 is FAST, and Steve’s code is tight, but games need to use as many tricks as possible to be fully optimized. Because of the changes to the clips on each frame, the “cacheAsBitmap=true” attribute would be of no use, and actually slow the animations even more. The solution I have come up with to provide many animations on the screen at one time is called Bitmap Animation Caching.

If you clicked on the pre-Alpha link above, you may have noticed that before the game starts, the screen says “Caching Animations” and you can viability see a large red explosion on the screen. What I do here is copy each from of that animation into a bitmapData object. Those objects are then store in what I call a “reel”. The animation reel is simply an array of these objects that when played back in order will create the illusion of an animation. This is just like the flip book animations that you may or may not have created when you were younger. When an explosion is created on the screen, I simply place a blank movieClip at the coordinates where I want the explosion to to happen, and then attach a bitmap from the correct reel on each subsequent frame until the reel array has reached its length-1. I then remove the explosion object and clip from the screen.

Next up, I plan to design some enemy robots and add some AI to their movements. I can’t have the roots running into walls (well, not the smart ones anyway).

Leave a Reply