Monday, December 19, 2011

Project: Malibu Beach Crab

What comes to your mind when you think of the beach? Sand castles, surfers, ice cream under the shades and maybe even a nice swim in cool clear seawater.

I think of crabs. Not the hordes of hermit crabs that flood some beaches, but tiny little crustaceans no bigger than the fingertip with soft translucent shells. They emerge from holes in sand washed and wet from the waves.

With Scratch, we need not be confined to reality. Let's take our imagination further. This is what we will create:

There seems to be a lot going on in this project but we'll soon see that the idea is really simple. Basically, the entire project breaks into four steps.

Step 1: Setting the stage

There are two stage backgrounds. The first background has a short introductory text to the game. What we want to display this from the beginning of the program until the user hits the 's' key to start the game. This is how the script looks like:

Script for the stage
It displays the first background, and switches to the second one on 's' key press. At this point, we also reset the points variable that we'll be using to keep score. Then we broadcast a "start" message. We will see in the following steps that we program all sprites to respond to the "start" message.

Step 2: Controlling the crab

In the Run, Scratch, Run! project, we have seen how to program movement controls on a sprite with the keyboard. We do the very same thing here:

Script to control the crab
The difference in this script is that we use the glide blocks to simulate jumping. Notice that we constrain the crab to the same x position when it glides. So the crab only moves vertically upwards to the y-coordinate of 100, and then back to -111. (You may find it interesting to compare this to the jumping script in the Run, Scratch, Run! project. The Three Ways to Program Falling Objects in Scratch tutorial briefly mentions the difference between using glide blocks and changing position coordinates in a loop.)

Step 3: Moving the bananas, suns and fruit platter

If you play the completed program above, you will see that the bananas and suns appear to fall rather haphazardly from the sky. Let's take a look at the scripts that we use to make the banana and sun sprites fall:

Script for a banana sprite
Script for a sun sprite
They are actually the same! The minute difference lies in the wait_secs block, where we pick a larger random number for the sun. So what's going on here? When the sprites receive the "start" message, they hide themselves - this clears the stage when we replay the program. Then, they repeatedly do the following sequence:
  1. Reset their own positions to somewhere at the top of the stage. We purposefully set the y-position 240, which is safely offstage since the stage covers up to 180 in the y-axis. We want them to fall anywhere from the top of the stage. This means that we will need to vary the starting x-coordinates. we do this by selecting a random number that is within the range of the stage. 
  2. Wait for a random number of seconds. We do this because we want the sprites to fall unpredictably. If we had specified a constant number, the player will be able to time the falls - that's no fun when playing a game!
  3. Show themselves and fall by gliding to the bottom of the stage.
Why do me make the sun sprites wait longer than the banana sprites? We do this because we want the bananas to fall more frequently than the suns. The game will be more challenging if the suns fall very often. See this for yourself - download the project and experiment with the script.

Next, we move the fruit platter. This is the most satisfying "food" for our crab. It does not fall from the sky, but moves horizontally across the stage. The crab will need to just to "eat" it. This is how we make the fruit platter move:

Script for the fruit platter
This script is also about the same as those for the banana and sun! It repeatedly does the same three main things: reset position, wait, and glide. This time however, the fruit platter resets its position to a fixed location at the top left of the stage. Also unlike the banana and sun, when the fruit platter glides it keeps the same height on stage while changing its x position to move from left to right.

Step 4: Keeping score

Here is a more exciting part of the program. We have created a variable, called points, to keep score. We want to change the value of points depending on what the crab has eaten. One eaten banana is a point, while a fruit platter gives 20 points. Getting touched by a falling sun however, loses 10 points. To do this, we will need to keep track of whether a banana, sun or fruit platter has come in contact with the crab. To each of these sprites, we insert these scripts respectively:

Script to detect whether a banana has touched the crab
Script to detect whether the fruit platter has touched the crab
Script to detect whether a sun has touched the crab  
All we are doing here is to broadcast a particular message depending on what has touched the crab. If it is a banana the message is "eaten!", if it is a fruit platter then "eatenFruits!", and a sun, "sunBurnt!". On touching the crab, we make the sprites disappear using the hide block.

What happens to the broadcasted messages "eaten!", "eatenFruits!" and "sunBurnt!"? They are received by the crab:

Script for crab behaviour
The crab does three things on receiving each of these messages. It updates points, plays a sound and says something. For example, when a fruit platter touches the crab, it broadcasts the "eatenFruits!" message. The crab immediately receives this message, updates points by 20 more, burps, and says "BURRRRRRP!!!"

There we have it. A game in Scratch in just four simple steps.

Project trivia

I first created this project in May 2010 while assisting a five-day Scratch course for students from Nanyang Girls High School. It was held at the School of Computing, National University of Singapore and was great joy to do. Back then, I went by the username chapati on Scratch. 

No comments:

Post a Comment