Introduction: Pi Cap Capong Project Tutorial

About: Bare Conductive makes creative electronic tools for any designer, engineer or aspiring maker.

Pong is one of our favourite video games, and in a recent workshop, we were lucky to have Paul Tanner, Tina Aspiala and Ross Atkin turn Pong into “Capong” (capacitive + Pong!) by breaking it out of the screen and into their hands. They used a Pi Cap and a Raspberry Pi to map the Pong paddles to the position of their hands and created a simple, challenging and really addictive game.

The Pi Cap is Bare Conductive’s newest product. A Raspberry Pi add-on, it allows you to add precise capacitive touch, proximity sensing and high-quality audio to your Raspberry Pi projects. It works with the Raspberry Pi A+, B+, Zero and later (any Raspberry Pi with a 40 pin GPIO connector). With the sensing precision of the Touch Board, and the computing power of the Raspberry Pi, the Pi Cap has is a great tool for transforming analog data into digital outputs.

We’ll leave it to Paul to take you through “Capong” below:

Capacitive Pong is a reinterpretation of the traditional screen game. Instead of using a mouse or arrow keys it uses capacitive sensors. The game runs on a Pi Zero with a Pi Cap add-on and an Ethernet adaptor.

This provides 12 sensor inputs, of which 4 are used. They are arranged on the laser-cut stand so that each player moves her hand between a pair of sensors.

The game is based on SimplePong, available on openprocessing.org, and released under Creative Commons. This was modified to use input from the Pi Cap sensors (instead of a mouse) and converted to 2 player operation.

The first version runs on a laptop in Processing and takes its input over Open Sound Control (OSC) protocol from the Pi Zero. On the Pi Zero, we used the demo software provided with the Pi Cap – one of those modules generates an OSC stream.

The constants were obtained by experiment, matching the range of outputs from the Pi Cap with the height of the playing window. It would be good to put the whole thing on the Pi, we should also clean up the code, label the constants etc. The game could also benefit from the addition of sound, a scoring system and a better way to start the game; but that’s for another day.

Find out more about the Pi Cap’s features and get yours today from our online shop. If you want to try and make your own Capong, follow the instructions below. Enjoy!

@paul_tanner 25 July 2016 Stand design and general inspiration by @rossatkin and @spongefile

Step 1: Video

In this short video, Ross explains his team’s project and how they went from prototype to build the final working versions of their two games using the Pi Zero and Pi Cap.

Step 2: How to Set It Up

Run through the ‘Setting up your Pi Cap on the Raspberry Pi Zero‘ tutorial here , and don’t miss any steps. (You need to know the IP of the Pi to log into it.)

Step 3: ​Code Examples

Run through the Pi Cap intro to see the code examples, particularly the one that streams the sensor data via OSC to your laptop terminal window. Notice the DIFF data – that’s what we’ll be using.

Step 4: ​Processing

Download and install Processing if that’s not already on your laptop. Unzip and install the code mpr121_pong in Processing’s sketch folder, usually /Documents/Processing. Open the sketch in processing and start it running. Nothing will happen in the playing window until you complete the step below.

Step 5: OSC

To run the OSC demo standalone, go to your PiCapExamples folder on the Pi and cd to cpp/picap-datastream-osc-cpp. Use ./run to see the Pi Cap datastream.

Find out the IP of your laptop then use ./run –host [IP address of laptop] to stream it to Processing.

Pong should now be running. Click the laptop mouse to start a game. The game finishes when a player misses the ball. Click the laptop mouse to start another game.

Step 6: ​Acrylic Stand

If you want to build the acrylic stand seen on the video, you can download the Illustrator files below and follow the tutorial instructions, courtesy of @rossatkin. You will need a laser cutter to cut these out, or you can make it out of foam board.

Download Red Template

Download White Template

Step 7: Assembly

To assemble your stand, glue one of the I- shaped pieces to the white rectangular piece with no holes in it.

Before you glue in the two red rectangular pieces, make sure to insert two of the crocodile clips into the structure as shown in the image, there should be a slot for the cables to exit when you attach the sides. This will ensure the wires are concealed within your stand but still accessible.

Glue the two red rectangular pieces to the white structure.

Step 8: Glue

Using a small paintbrush, dab all the joints of the stand with the acrylic glue, this adhesive will melt the plastic pieces together. Careful with the red acrylic, it may melt and release some colour.

You should still have one acrylic piece remaining, the white rectangle with two holes. Don’t glue this piece on yet.

Step 9: Crocodile Clips

Stand your Capong upright (so the white piece with no holes is touching the tabletop). Make sure you have enough wire so that your crocodile clips protrude at the top (you need at least 3in of croc clip visible as shown in the picture).

Now, leave some length of the wire out the bottom of the stand, and cut and strip the wire. You should have about 1.5cm of copper wire protruding. You’re going to use this to attach the copper wire to the sensors.

Step 10: Paint Your Sensors

Cut out two cardboard squares and two rectangles. These will go to your stand so you can measure the size of the interior surfaces for sizing.

If you’re using Electric Paint, you can paint directly onto these squares. Once dry, apply some double sided tape, you’re going to glue the sensors face down against the acrylic. But first, you must cold solder the paint!

Step 11: Cold Solder

Using your Electric Paint tube, squeeze out a generous amount of paint onto the exposed copper. You should make sure the wire is held in place so that it doesn’t move around (you can use double sided tape).

The finished sensor should look like the third image in Step 11. When you’re finished you should have four sensors, two square, two rectangular, connected to each of the sides of the Capong stand.

Step 12: Aluminium Foil Sensor

If you don’t have Electric Paint you can make your sensors using aluminium foil. Just follow the same steps as above, but sandwich the exposed wire between the aluminium foil and the cardboard as seen in the images on the right.

Step 13: Attach to Stand!

You can now firmly attach your sensors to the stand and get out your Pi Cap and Pi Zero!

Step 14: ​Attach to the Pi Cap

Take the crocodile clips that are protruding from the top of the Capong stand, and attach them to your Pi Cap’s electrodes. Make sure you’re connecting to the right electrodes – the one’s you’ve programmed for functionality. Now you can connect your Pi Zero, upload the code, and get playing! Like this project?Want to make your own? Find out more about the Pi Cap’s features and get yours today from our online shop.