<< LCARStrek 2.16 Brings Updated Look | The roads I take... | 15, 14, 13, 8, 7, 2 years ago, and the future? My Web Story >>

MaKey MaKey Experiments

I think I probably became aware of the MaKey MaKey when Chris Heilmann blogged about it, but I might have heard about it even before. I surely saw it when Chris had his WebRTC photo booth running with it at MozFest 2012 in London.



When I ran across it again on ThinkGeek, I put it on my wish list - and finally ordered one this month. Now, after I had wrapped up this week of work, I finally found some time to play with it, and an interesting and very geeky Friday night ensued. Here's a bit more about that - and about Saturday, and further plans/ideas. :)

So, for one thing, I wanted to use this device with actual Open Web stuff, and not with Flash or other proprietary software. After all, this is Open Hardware (yay!) and I'm entirely entrenched in Open Source / Free Software, from using Linux on desktop, laptop and server, via working for Mozilla/Firefox, to doing some web apps under the MPL2 license in my free time. So, given the latter, I decided it would be nice if I could navigate the OSM world with my Lantea Maps app/site (source) using the MaKey Makey. For that, I had to put some keyboard accessibility into Lantea Maps itself, which is a good idea for accessibility, among other things, anyhow. So I did that, looking at Chris' testy-testy and MDN to find out how to achieve that best. I ended up implementing methods to move the map with the arrow keys, hooked up zoom in/out to +/- keys as well as w/s (the latter are supported by MaKey MaKey out of the box), and then also created direct shortcuts to certain zoom levels with the 0-9 numeric keys (not supported by MaKey Makey, but convenient for keyboard users).

OK, then it was time to actually bring in the MaKey MaKey. I really want to do some fruit stuff at some point, but I only had a few apples around, and I thought it actually would be nice to create some kind of navigation pad that can be used with Lantea Maps at full screen when having an OpenStreetMap booth at Linuxwochen in Vienna. I figured that with some cardboard from the back of an old note pad, and some tinfoil, that should be doable. I added some plastic wrap for insulation, glue of course, and some paper clips so the crocodile clips to connect to the MaKey MaKey wouldn't scratch the tinfoil too much (as well as some temporary applied ones to hold things together while allowing the glue to dry). Here's some photos from production:

Image No. 23125 Image No. 23126 Image No. 23129 Image No. 23137 Image No. 23139

Note that the back side as well as the right rim of the pad is covered with a single sheet of tinfoil that makes the earth connection quite naturally when you hold the pad in your hands.
As of the last photo, while the glue was still drying, it was ready to use for some map navigation (and after the night, I removed the temporary paper clips and took another "promotional" picture):

Image No. 23140 Image No. 23141

Even while getting to bed that evening, the ideas for my next project were flying around in my mind already. On one hand, I saw that MaKey MaKey had connectors for mouse up/down/left/right, on the other hand, ever since trying the original BananaBread demo as someone who's usually not doing any first person shooter games, I wondered if there was a nicer or more obvious way to operate this, rather than using w/a/s/d keys for movement, space/click for jump/fire, and mouse for turning. Well, now that I had done this first custom pad for MaKey MaKey, would there be a handy solution for that as well? In any case, it would be fun. So I took a smaller piece of cardboard that would make this thing fit nicely into my hands (just like those professional game pads), and decided this time I would try something slightly different by using coins as the actual "buttons" on the pad. One-cent coins looked like the right size, and I had a 10-pin cable around from a different project, which would fit for the 10 "keys" pretty well (just that I needed one more for earthing, which I again did with a sheet of tinfoil at the back of the pad, so I added yet another single cable in the end). Also, this time I used some double-sided tape instead of glue for many cases, as that works better with the cable and coins:

Image No. 23142 Image No. 23144 Image No. 23146 Image No. 23148

And then I was ready to play some BananaBread, now with both the awesomeness of running a 3D first person shooter seamlessly in the browser AND using a special game pad for playing!

Image No. 23150 Image No. 23151

If you're interested, not only are those pictures all linked to the gallery where you can go up to "big" versions of those, there's a few more steps of building visible in this photo gallery.

Given all that and the fact that Linuxwochen Wien in the first days of May has an additional focus on Open Hardware this year, I decided to hand in a proposal for a talk on MaKey MaKey there. I intend to show off those pads as well as Chris' photo booth and any other MaKey MaKey experiments that I can fit, preferably ones that run as web pages/apps (let me know if there are any nice ones).

I'm thinking that it could be nice to have an app that shows you on screen in a web site which kind of fruit/item you touched (configurable with key <-> item entries), and I'd love a web (not Flash) piano and/or drumset (using ogg or even opus files with HTML5 audio!) app to present, maybe I can hack something up if there's nothing around.

If this has caught your interest, it's easy to get your own MaKey MaKey, and if you're in or around Vienna in the first days of May, I'd be happy to meet you at my talk (there will be a Firefox OS App workshop as well, probably!) - oh, and if you have any nice, open web apps/pages that show off this device, let me know! :)

Entry written by KaiRo and posted on March 24th, 2013 20:25 | Tags: BananaBread, Lantea, Lantea Maps, Linuxwochen, MaKey MaKey, Open Hardware, OSM | no comments

TrackBack/Pingback

Comments

No comments found.

Add comment