Art 315Lecture 4

Dr. J. Parker

AB 606

Today’s class: Programming!

• We are going to write some simple programs.

• We will use a tool called GameMaker– It allows point and click instead of typing– Syntax is more or less irrelevant– Remembering names/syntax is

unimportant

Concepts are what is essential here.

What Shall We Do?

• Something with pictures• Something very simple

So how about a ball doing something ball-like? Rolling or bouncing, perhaps?

If you think about it, there is alot to even this simple program.

Let’s Get Started.GameMaker can be downloaded for a PC, no cost, fromThe maker – YoYo Games. http://wiki.yoyogames.com/images/f/fd/GM7.zip

The new version is 8. Don’t get it, it will not be compatiblewith the Mac version.

The Labs should have a Mac version, and I can give you either one on a CD.

GameMakerGameMaker is a tool intended to allow people to develop computer games on their PCs.

We are using it as an intro to programming because it is simple to use, yet contains all of the power of an interpreted programming language.

It is simply an intro, not intended to replace C++ or Java.

Let’s Get Started

Run the install script. Then run the program itself. You will see:

GameMaker 7

The menu on the left side has the key stuff.

SpritesSounds BackgroundsPathsScriptsFontsTime LinesObjectsRooms

Sprites

These are pictures. Small GIF or JPG files.

A sprite is the representation of an object within the game.

Here are some sprites:

SoundsThese are audio clips, things like the sound of

impacts, shots, bounces. WAV or MP3 files.

A sound is the representation of an event within the game.

Here are some sounds:

Boink Zap Shot

BackgroundsThese are larger images, static. They represent

the set or backdrop upon which a game is played out (also: a room or a board). JPG/GIF

Here are some backgrounds:

Stars Tile

ObjectsThe key elements of a game. These are the

things that move about and interact to create game play. One is generally controlled by the user, the rest have some autonomy.

Pac-Man is an object. So is Mario.

Objects are connected to their graphical rendition, their sprite. Objects themselves have no fixed appearance, only a sprite.

ObjectsOur project: a ball that moves.

Object: a ball.The ball’s sprite should look like a ball. We can make a ball using paint or some such

program. Or we can borrow one.

Making our own will contribute to making the final work our own. Borrowing is faster.

ObjectsBall from google. Search: ‘ball’ under the

‘images’ class.

It’s too big (trust me). Make it smaller – say, 32x32

Now we start …

ObjectsWe are going to make a ‘ball’ object. (why?)

The object will have a sprite (or we can’t see it) so let’s make that first.

(in windows visual compilers this would be a ‘resource’, and game developers would call it an ‘asset’)

Click the Sprites link on the left hand menu.

A new menu pops up:

SpritesWe are going to make a ‘ball’ object. (why?)

The object will have a sprite (or we can’t see it) so let’s make that first.

(in windows visual compilers this would be a ‘resource’, and game developers would call it an ‘asset’)

Right click the Sprites link on the left hand menu and a new menu drops down;

Left click on the ‘Create Sprite’ item

Sprites

Sprites

Sprites

Name the sprite spr_ball

Click here to load the Image from the file ‘ballsmall.jpg’

Click here so that theCentre of the ball is the Reference point (??)

Click here when done.This can be editedagain later on.

Sprites

This is what it looks like just before saving.

Are We Programming?

No, not really.

We’re organizing assets, which will become a larger part of what ‘programmers’ will be doing.

Now that we have a ball sprite, we could make the ball object, or at least start to.

Ball Object

On the left menu, right click on ‘Objects’ and then left click on ‘create object’ in the menu that drops down.

The ‘Object Properties’ window will appear.

Ball Object

This is a very complicated window. Objects are complex things.

Click on name and rename this ‘obj_ball’.Click on the little picture right of where is says <no sprite>. A menu will drop down, and one of the items will be

Spr_ball and a little Picture. Click on this toSelect the ball as thesprite

Ball Object

For now we can click on ‘OK’ and the window will close.

Still no programming, more ‘setup’.

By the way, the menu on the left changes whenever we add a new thing. Now it looks like this:

RoomsLeft menu, rooms link: right click, then left click on thecreate room item.The room properties window appears. Objects tab

RoomsMake sure that the obj_ball object has been selected, asit was on the displayed window.Then left click the mouse anywhere in the room area.

A copy of the ballsprite will appear where you clicked.

RoomsEach time you left click, a new obj_ball object will be created, and a new sprite drawn. Right clicking on a spriteRemoves both the object and the sprite.

Now click on the close icon (red X in upper right) and the Room Properties window will close.

First basic test: click on the green array (which is ‘play’)

A popup will say ‘saving executable’ and then a newWindow will open:

Rooms

Click here toreturn to theeditor.

The Metaphor

This system is like a programming system (API/SDK).

The metaphor is a simple one:Sprite outputRoom screen/monitorObject the point of the program (goal, objective).

The Metaphor

Since the object is the target of the program we write, that means that our task as a programmer is to make the correct things happen to the object.

The object in this case is a ball. Making the ball do something will be programming. Let’s make it move.

Move The Ball

In the editor, double click on obj_ball in the left menu; the Object Properties menu opens for the ball object.

We want to talk about events for a while.

Move The Ball

An event is something that happens. Something the program did not make happen, but was done to the program rather than done by it.

Simple, obvious events are: key presses, mouse buttons/position changes.Creation of an object is an event; so is the passage of time, strangely.

Move The Ball

We can’t predict when a key will be pressed, but can respond properly when one is pressed. In a game, an arrow key can change motion direction (or wasd keys).

We can’t predict when the mouse button will be pressed, but can respond to it by, for instance, doing something to the object under the cursor at that time.

Move The Ball

Click ‘add event’ and see the list of events!

This is the window thatopens when the add eventbutton is clicked.

Each is an event or class of event.

Move The Ball

Let’s make the ball move in the direction of an arrow key when we press one.

This would be a ‘Key Press’ event, and when we click on the Key Press menu item another menu opens:

Move The Ball

The arrowkeys

Move The BallClicking on press <Left> gives us this window: The text in the

Events window shows what eventis being handled.

The Actions Window shows theprogram: what todo when the event occurs!

There’s nothing there just now.

Move The BallWhat we want to do then the left arrow key is pressed is to make the ball move left. How can we do that?

The symbols in the right panelreflect actions you can specify. Since weWish to make the ball move, I’d suggestWe select one of the ‘Move’ symbols:

Move fixed move towardsMove freeSpeed gravityChange x, y direction friction

Move The Ball

Move The BallWhat we did was: mouse down on the red MOVE icon, move mouse to the Actions window, let go of the button.The red icon stays in Actions and a detailed MOVE window

opens. Then we selectThe parameters with the mouse: direction left, speed=1, then click on theOK button.

Move The BallWhat it means is: when the event left array key pressed occurs, The object is to move in the left direction with a speed of 1.

Let’s see what this looks like (run the program) by clicking on the green arrow (run) again!

About 6 secondsin I pressed theleft arrow key.

Our First Computer ProgramThis is a computer program in every respect, and we put it together.

It is very much like the first trivial program that first year Engineers write: the “Hello, World.” program:

#include <stdio.h>int main (){ printf (“Hello, world.\n”); return 0;}

Pause for Discussion

Do you think of this as a program? (what we did, I mean)

Is it done?

A painting is never done, I hear. Is a program?

The ball just floats off when you type the left arrowkey. How could we make it stop? Go right?

Can we make it stop at the edge, instead of disappearinginto the unknown?

Done for Today

This has been a lot to swallow for anyone not a programmer.

Download the program we wrote from the course web site. This program is L0401.gmk

If we get this far, lets stop for today and digest.