Frogger Tutorial New

The Gallery Window

Double click the AgentSheets icon to start the program.

Select File->New Project... to start a new AgentSheets project. This will bring up a file dialog to define what the name of the new project is and where to save it.

Name the project "Frogger" in the file dialog that comes up (if the name "Frogger" is taken, try to put a number behind it like "Frogger_2235") and click OK. A "Define Agent Size" dialog box should appear.
Choose the size of your agents. For the game we are creating, you don't need to change anything - the default size of 32x32 pixels will work, so just click OK again.
A window should appear in the top left; this is the Gallery Window.

Creating the Frog

Click "New Agent" button to create the Frog agent: At the bottom of the Gallery window click the "New Agent" button. Name the agent “Frog.” The Frog agent should appear in the gallery. We will now draw the Frog.

Click the "Edit Depiction" button to draw the Frog: Select the Frog agent in the Gallery and click the "Edit Depiction" button at the bottom of the window. The Depiction Editor should now open. In the Depiction Editor we will draw what our Frog will look like.

The Depiction Editor

Hit the "Clear" button to clear default icon: Click the "Clear" button at the bottom of the window or use the Edit->Clear menu option in the Depiction Editor window. This will clear the default drawing in the window to give you a blank canvas to draw your frog.

Frog agent depiction

Select a color and the "Pencil" tool to draw your frog. Select the green color from the color palette at the top and the Pencil tool on the left and draw what you would like your frog character to look like. If you make a mistake you can use the Undo button, the Eraser tool on the left, or the clear button at the bottom to completely clear the drawing. You can also use the shape tools on the left to make circles or rectangles.

Click the "Done" button at the bottom of the window when you are finished. We have now created the Frog agent and drew how it looks like. If you are still not satisfied with how your frog looks, you can click on the "Edit Depiction" button again in the Gallery Window and modify the picture. Now, it's time to make more agents!

Creating the Street

Street agent depiction

Now let’s make the Street agent. Similar to how you created the Frog agent,

Click the "New Agent" button to create the Street agent. Name the Agent “Street.”

Open the Depiction Editor Window to draw your Street in the same way you drew the Frog. Make sure you draw a street that goes across from left to right.

We Now have Two Agents: The Frog and The Street! Great Job! Our next task is to make the game level. This is called a “Worksheet.”

Empty Worksheet window

Select File->New Worksheet to create a new worksheet: This will create a new, empty worksheet. Resize the Worksheet Window to the size you want your level to be (by clicking and dragging the bottom right of the window). The empty worksheet is where we will create the level for our game. Our level should include the Street, the Frog, and (eventually) Cars or Trucks. Let’s first create the Street. The Street will be a series of lanes that run across the Worksheet window. We will do this by placing the Street agent on the worksheet.

Use Pencil tool to place Streets in the Worksheet: Select the Street agent in the Gallery window by clicking on it. In the Worksheet window, use the Pencil tool to place lanes from left to right. If you want the lanes to cover a region, click on the filled “Draw Rectangle” tool (the rectangle which has textured middle) and make a Rectangle that covers a section of the screen you want the lanes to appear. This should create multiple “lanes” across the screen. If you make a mistake you can use the Clear button located in the bottom right to clear everything or the Eraser tool on the left to clear specific agents. Keep in mind that to complete the Frogger game, you will eventually have to make and put a river above the street lanes, so place the street towards the bottom of the worksheet, leaving space for the river (we will create the river in part 2 of this tutorial).

Place your Frog agent in the Worksheet: In a similar fashion, place one Frog in the Worksheet window. You only want to place a single Frog, since it will be cursor controlled. Make sure the agents are in the default starting position (e.g. the frog is in the start position at the bottom of the level). It is important that you do not draw over the Frog with the Street agent. This means if you place a Frog on the worksheet, do not draw the Street over it without erasing the Frog first.

This is a good time to save the worksheet!

GOOD JOB! You have now created and saved the first version of the level. Now let's test our program by running it and trying to play the game to see if it works the way we think it should. In the worksheet window, hit the 'Run' button located at the bottom left. What happens?

• Does the Frog do anything or does it just stay in one place?
• Can you control the Frog movements? For example, if you hit the up arrow, does the Frog agent move up?

The answer is no. To give our Frog the ability to move, we have to give a "behavior" to our Frog agent. As you will see, behaviors allow us to make our agents act in certain ways.