Making Awesome Soccer – Part II

So after reading Part I, you’ve now got all the tools you need to start writing your very own soccer game. But what’s next? Well, here Peter continues the run down of how Awesome Soccer started out way, way back when… (cue those peculiar screen swirls and ‘that’ music)

1. Create some initial Sprites. For me, this involved photographing my son Brandon in his football kit facing in the 8 different (compass) directions, which was very funny for us both. This was followed by lots of image work in Paint Shop Pro and GIMP to cut around our hero to remove the background, and to resize to some appropriate sprite dimensions (although this resize did make him look completely out of proportion). We were finally left with 8 shiny new .png images:

Where it all began...

2. Create an Application that loads in these images, and displays our player sprite on the screen. Exciting stuff…

3. Next, Implement control logic to move our player around the screen. This is pretty straight forward stuff; you read the keyboard for designated key presses and then increment the players x and y co-ordinates accordingly. Refine this to change the image displayed to the corresponding compass direction of the key presses.

4. Create a Football pitch! Shouldn’t be too hard now should it?
However, being the perfectionist (code monkey) that I am, I decided that I wanted to algorithmically produce a football pitch, so it could be produced at any size and any width (I had some lofty ideas about allowing extra wide pitches like Wembley, or thin ones like the old Highbury. I even wanted to allow for a 5-a-side type pitch). This took far longer to do it than I’d previously estimated, but the pitches were ultimately produced to precise and exact FIFA regulations! They could be any width & height in yards, and even allowed you to specify the number of pixels per yard! The shame of that geekery lives with me to this day…. (I had also wanted to allow various different types of lawn “mowing” patterns at this stage, but I’d wasted too much time already, so that would only in the game much, much later…)

5. So now we can finally display our player on an actual pitch. That followed swiftly with the first “sit back and smile whilst gushing with self satisfaction” moment, and a feeling that I was actually making some progress…

6. Implement Ball Physics. This was probably one of the key battles – realistic ball motion and bounce. Time to cast your mind back to A-Level Maths and Physics, or more realistically, start googling for the equations of motion, conservation of linear momentum, projectile physics…blah blah blah. I will not bore you good readers with details of that, but there is a lot of info out there on the web about projectiles (hint, hint).

7. So now (again after a not insignificant period of coding), we can move the ball around the screen with the cursor keys (I added a toggle key to change between controlling the player and controlling the ball for this). Pressing the spacebar would “kick” the ball at a preset power. Nice!

8. Next, it was obvious that you needed to somehow to represent that the ball had height and was flying through the air within this high angled 2D persective, so the only real solution was to incorporate a ball shadow. At first I thought this would simply be a question of drawing the shadow at the co-ordinate (ballX + ballHeight, ballY – ballHeight), but that doesn’t quite produce a realistic effect. Again, a subtle little bit of maths (think Trigonometric Triangles) produces the desired effect. Job Done!

9. Next – Scrolling the pitch around to follow the ball. Always a key battle in any game, how to control the scrolling of a large playing area (in our case the pitch) when you have a limited display area (ie the screen). After various trials and various errors, I came up with a solution to scroll the pitch correctly so that the camera kept up with play nicely……which was the cue for the second ‘sit back and smile’ moment….

So that’s it for Part II….in Part III we’ll discuss how one player became a team…

My my, that could be the title of a motivational lecture couldn’t it?

Tags: ,

Leave a Reply