Game Design with real-world controllers: Scratch and MakeyMakey

Scratch and Makey Makey are projects from MIT, which allow kids as young as 6 to create games, and use electronic circuits for real-world controllers. I attended the “GameMaking with Scratch and Makey Makey” workshop with my 8yo daughter this weekend and I was excited enough to write a bit more about it in a blog post, rather than just post an FB status update.  The workshop was hosted at HackerYou in downtown Toronto and run by LadiesLearningCode, a non-for-profit that provides tech-related workshops in 30+ cities in Canada, some primarily for women and girls. OK, so let’s go!

Scratch: Game Designing for 6 year olds?

Scratch is an environment that allows you to create or program your game. It allows users to drag-and-drop elemental instructions for each game character or “sprite” that you create. It is ingenious in completely hiding the syntax (or special markings) for any particular programming language. As someone who’s programmed in at least seven languages, I can tell you that tremendously speeds up the learning curve. In other words, you are programming in English.

To create and share projects you sign up for free at http://scratch.mit.edu. This is what the editor looks like:

You can see the “sprite” Scratch the Cat on the left. On the right, you are connecting Lego blocks to create a set of instructions, or an algorithm. In the middle is the tool box. It includes actions (“turn X degrees”), sound (say “meow” or recorded soundbite), events (“Do X when game starts”), sensing (do X when touched by Scratch the Cat).

They have a pre-built character library, or you can create your own by drawing or by taking a photo with your camera. We changed our game of Pong to have our own faces as the ball.

And here is what a simple set of instructions look like. From such building blocks come games.

During the workshop, we started with a Pong game where the paddles didn’t have instructions and assigned behaviours to the paddles so we could control them.

  • If press “up” button, move “up” (change y coordinate by +10)
  • If press “down” button, move “down” (change y by -10)

And to get the ball to bounce off the paddles:

  • If in contact with paddle, “bounce off” (turn 180 degrees and move away)

The kids got introduced to control structures like if..then, and for..else, to triggers (when press “Start” button), and — without the term coming up – to object-oriented programming (because each sprite is an instance of an object with its own behaviours).

Makey Makey: Connecting the Real World to the Computer

Now, Makey Makey is what makes this post about a tangible art. It’s an electronic kit that allows you to make custom controllers for your game by completing a circuit with whatever conductor you want.

Here is an example circuit connection:
Glob of play dough -> microcontroller port for the “left arrow” key on the keyboard -> USB port of your computer.  And of course, ground.

So now, when you push your glob of clay, it’s the same as pressing the “left” key on your keyboard.

Combine this with human creativity and these are the kinds of ideas you get. I like this one on Musical Paintings. Here is a gallery of them.

Our kit in the class was a “Classic”. These and other more interesting sets are available from the project page. It was a set of colour-coded alligator clips, a microcontroller (small embedded computer), and a USB cable to plug into your computer.

Here is the microcontroller, basically a small computer with limited embedded instructions and responses. Connect the alligator clip to the holes for the key you want to control. In this picture I’ve connected the gray to “up” and orange to “down”. The red cable at the top goes into a USB port to the computer.

Here is our setup, with playdough controllers for our Pong game.

So now, when you push your glob of clay, it’s the same as pressing the “left” key on your keyboard.

Combine this with human creativity and these are the kinds of ideas you get. I like this one on Musical Paintings. Here is a gallery of them.

 

 

 

Another cool demo was two players high-five-ing each other to play the game Flappy Bird. In this game the bird has to fly through a passage of obstacles. Each high-five caused the bird to flap its wings and go a bit higher (and not lose altitude). So your high-five frequency keeps the bird afloat and you have to do it just right to keep the bird from crashing into obstacles. Totally awesome; I have a video which I’m not going to post here (ask me).

This was a blast and definitely something I wish I had when I had more time on my hands during long lazy summers …