Monthly Archives: May 2014

Makey Makey, Take 2

This is the second post in a series about the use of the Makey Makey for faculty professional development in technology, design, and creativity.

As I described in my last post, the first incarnation of my Makey Makey project, was a relatively inelegant “instrument” I hacked together using some fruit, kitchen utensils, and a Google Coder project. I left the project out in our faculty lounge for a few days, in the hopes of garnering some interest in attending our first “play day” coming up next month. The project seemed somewhat of a success, since I observed several instances of tones, laughter, and what I interpreted as “contemplative silence” emanating from the lounge while the project was up. A few folks even emailed me either thanks or excited exclamations of “that’s cool!” Thus, at least in terms of garnering attention from my colleagues, the Makey Makey project was turning some heads, and encouraging some play. The project seemed also to inspire a little bit curiosity with regards to electrical circuitry, mostly around how people did not get “shocked” when holding the electrical leads. Some people also began experimenting with different conductive materials, swapping out spoons to pencils or other fruit.

For Phase 2, I decided to up the sophistication of the project, creating a conductive “board” to replace the dangling fruit and wires, and rather than using simple tones on the C major scale, to embed some free loops from GarageBand. The browser I’d be using to display the project is Google Chrome, which can read and play .mp3 files. This created a minor obstacle, because GarageBand loops come in a completely different file format. To work around this, I added each loop to a separate GarageBand project, and then exported each project in .mp3 format. Problem solved. I then found some copyright-free images online (thanks Wikipedia!) to match the GarageBand loops I used. After a couple of more tweaks to the user interface, I had a web page that looked like this:

Image

For the board, I used the underside of a printer paper box, aluminum foil, scotch tape, and an exacto knife to carve out and affix some conductive “pads.” For each of the five pads, I used a wide strip of foil, stretching from the bottom of each pad to the top of the “board,” where I could easily attach the leads from the Makey Makey. For the ground lead, I made an aluminum foil strip at the bottom of the board.

Image

 

I then uploaded the site to the computer in the faculty lounge, and left a little flier of instructions, with a small plug for our “play day” in June. Fingers crossed that this iteration will pick up where the last one left off…

IMG_0070

First Stab with the Makey Makey

So I’ve had a Makey Makey sitting on my desk for a few months, and until last week, I hadn’t even opened the box. After seeing a video of the Makey Makey’s creator Jay Silver on TED back in the winter, I felt inspired and compelled to get one. But as they so often do, work and life get in the way of things, especially creativity. And so the Makey Makey sat on my desk, all but forgotten, until a couple of weeks ago, when my colleagues and I decided to schedule our first technology professional development workshop devoted entirely to “play.”

Rather than simply send out the all-too-commonly unread mass email announcement, or post fliers above the copier machines, we decided to advertise our workshop with whimsical crafts, making use of the same tools we wanted to bring with us to the workshop. Finally, I had a reason to unpackage my Makey Makey, and start playing with the very serious intent of doing “work.”

The Makey Makey is a very simple device, reminiscent of the original Nintendo Entertainment System game controller, but with sharper edges, more holes, and exposed electronic components on the back.

Image  Image

 

It runs off of USB power, and acts as a sort of modified “keyboard” (without any obvious keys). In fact, it would be like having a keyboard for your computer that only consisted of the four arrow keys and a space bar. The sixth input on the Makey Makey functions like a left mouse click. Super simple. The Makey Makey comes with seven colored alligator-clip leads, which you use to create connections between the designated buttons (keys) on the Makey Makey and other conductive objects (spoons, fruit, coins, aluminum foil, etc.). There are also six “ground” input/output connections on the Makey Makey. The “ground” connections serve to complete the circuits you’ll end up constructing to control the buttons (keys) on the Makey Makey. By building these mini circuits, you can control your computer’s interface, such as scrolling up, down, left, or right, entering spaces between text, or clicking on objects. In the video above, Jay Silver shows some examples of this being used to create things like pianos and drums on the computer, but of course, with just a little bit of imagination (and a little bit of computer programming experience), the Makey Makey can do much more.

To advertise for our workshop, I decided to make my own five-key “piano” with the Makey Makey, and the process was made MUCH easier by using some HTML5, Javascript, and some help from Google Coder. The Google Coder site lists a bunch of easy-to-hard web-based projects that are specifically directed towards use with the Raspberry Pi, but are easily adapted for regular computer use. I chose to use their “Music Boxes” project for my Makey Makey for its simple interface and use of HTML5, which I have some experience with.

Image

 

HTML5 is great in that it lets you use media “tags” in your HTML code, rather than fussing with overly complicated syntax or plug-ins like Shockwave. To make a long story short, the Music Boxes project provides you with some basic HTML code and instructions to help create the site picture above, and associate various musical tones (which come with the Music Boxes project download) to the individual colored boxes. The result is that when you click on a box, the browser plays a tone. With a mouse, this means you can play one tone at a time.

Using a combination of HTML and Javascript, however, you can associate the various tone files with keyboard keys, turning your QWERTY keyboard into a virtual synthesizer. Enter the Makey Makey. Using the five Makey Makey buttons (keys), I was able to take the Google Coder Music Box code and write my own little program and create a real-life “synthesizer” that my colleagues and I could play together in our faculty lounge. Here are some images of the result. Not an elegant first stab, I’ll admit, but I have plans in the works for the next iteration already!

Image

Image

Image