Last week we were in Paris, where we did a Think Camp on mobile games for science at the CRI.

20150721_121428This summer, the CRI are running a course on game building—GLASS, or Game Lab Summer School. The focus is on games for science and the results will be judged by a jury.

The Workshop

The aim of the workshop was twofold.

First, we wanted to do some brainstorming about mobile science and games. How can we use mobile devices in science-oriented games? As input devices, controllers, collaboration tools?

Our other goal was to get students up and running with some quick coding lessons about how to develop for mobiles. I kicked this off with a demo showing how to link up mobiles as controllers to browser-based web games.

We had about fifteen students, all post-graduate, from a wide range of backgrounds—developers, game designers, graphic designers, and scientists.

The Hack

For the demo I used CRI’s own RedWire, an online platform for game building created by Jesse Himmelstein .

For the comms, I used websockets. I set up a quick (10 line!) websocket server, which I ran on my laptop.

I then hacked RedWire to produce QR codes for each player in a Redwire game, which mobiles can use to pair to the appropriate game controller. I also added a websocket client module to RedWire to listen for messages from paired mobiles. Finally, I hacked together a simple mobile up-right-left-down arrow controller using Apache Cordova with the websockets-for-android plugin.

This is the result in the browser client. When you open a game (here pong), you get a QR code for pairing your mobile—one for each player.

Screen Shot 2015-07-28 at 14.48.01

In the mobile app, you first see a pair button, which when pressed brings up a barcode scanner:

Screenshot_2015-07-28-15-28-17Screenshot_2015-07-15-12-45-33

The QR code contains the address for the websocket server plus info about the controller interface. Once the scanner captures it, you’re paired. Each mobile can now control one of the pong paddles in the browser.

The demo worked in tests in various locations before the workshop—blocked ports are the main source of problems—but during the workshop we could only get one phone to pair—mine! It would have been interesting to find out why, but there wasn’t enough time and anyway, debugging is usually not a hit with audiences….

You can find all the code for the experiments (minus the websocket server–write your own or use socket.io !) on github:

RedWire hack: https://github.com/bcfuchs/RedWire

Mobile controller: https://github.com/bcfuchs/redwire_pairing_demo

For the rest of the hack, we concentrated on getting people up and running with Cordova. Long download waits for android sdk etc meant mixed success—only a couple of students got as far as making an app. While we were waiting, I demonstrated how easy it was to add hardware functionality using Cordova plugins—camera, accelerometer and signal info.

There’s more on the workshop, including the ideas from our brainstorming session, in the workshop blog (currently in a semi-edited state…I’ll be tidying it up this week, as well as adding some photos of flipcharts, etc).

« Back to Blog