Hacking Mondrian with Scratch and Makey Makey

This creative learning activity consists of replicating on cardboard a Mondrian painting, and then hacking it by using Scratch and Makey Makey. The final result is a physical device connected to a digital one. Touching with the hand the colors of our replica on cardboard, we change the colors of the original painting that we have on the screen.

For teachers, educators, or parents, here is a proposal of how to implement the activity (of course there are many variants and alternatives to explore):

Materials and resources 

A piece of cardboard, coloured wax pencils, a black marker, copper adhesive tape, a Makey Makey kit (board, alligator clips, jumper wires, USB cable), a laptop, and Scratch. 

Step 1. Learning about Piet Mondrian

If you are lucky enough to have a nearby museum with Mondrian works on display, the first thing I would recommend is a visit with the children. They can take photos (if allowed) or make drawings, copying or inventing new works inspired by Mondrian. If the museum option is not possible, the Internet is full of resources to learn. For example, the painting I chose is "Composition with Blue, Yellow, and Red" (1927), on display at Museum of Fine Arts, Boston. The museum's website has information about that painting, but also Google Arts an Culture let you explore the museum, or you can check websites like WikiArt, a visual art encyclopedia.

Step 2. Replicate or invent a Mondrian work on cardboard

The next task is to cut a piece of cardboard (or whatever material you think is most appropriate) and replicate (or invent from) the Mondrian work of your choice. You can use coloured wax pencils, markers, paints, etc. Once the artistic work is finished, our piece must be prepared so that it can interact with Makey Makey and Scratch. I used copper adhesive tape to mark some areas of the painting with which we will play. The areas covered by the tape will be like buttons that when touched will cause changes in the digital version that will be on the screen. A more effective and fun solution for children would be to use colored conductive play dough instead of copper tape. We could cover the whole area of some of the squares or rectangles with conductive play dough. If you use the tape, make sure it reaches the edge of the cardboard, which is where we'll attach the alligator clips. If you want you can also create buttons like the ones in my example ('random' and 'reset') that later you can also program with Scratch.

Step 3. Connections with Makey Makey

In this phase we have to prepare the connections with the Makey Makey board. Each of the areas where you have put copper tape or conductive play dough must be connected to the board, either by alligator clips or jumper wires. Makey Makey turns anything into a touchpad, so with the kit we can turn objects like bananas, coins, or anything conductive into a computer keyboard key to control onscreen gaming action, play software-based instruments, etc. In our case, we will turn our painting on the cardboard into a control with which to hack the real work of Mondrian that we will have on the computer screen. In the Makey Makey website you can find tutorials that you may find useful. But the Internet is full of videos, examples and detailed activities. Do a search if you need help or ideas.

In the example of the picture above I connected the blue area of the painting with the round "Space" pad on the Makey Makey. I also connected one end of an alligator clip to "Earth" on the bottom of the front side of the board. With this setting, every time I take with one hand the free end of the alligator clip connected to "Ground" and I touch with the other hand the copper tape in the blue area, I'm closing the circuit, so it is as if I were pressing the "Space" key on the keyboard. Of course now we need to program with Scratch so that each time this happens, the blue area of the painting on the screen changes color.

Step 4. Coding with Scratch

Scratch is a free programming language and online community where you can create your own interactive stories, games, and animations. On this occasion we use it to make an interactive artistic project.

Check my project: https://scratch.mit.edu/projects/264910840/

There are many possible approaches to programming this project with Scratch. In mine, the idea is to put a background photo of the original Mondrian painting that we are hacking, or to draw a replica with the paint editor. Then we have to create a "sprite" for each colored area we want to play with. These sprites can be created with the paint editor, and must have the same shape and size as the area over which we will put them. Also, for each of them we have to create "costumes" with different colors.

The sprite for the blue area and its costumes.

The coding part is very simple. Basically we have to use blocks from the section "events" and the section "looks". The idea is to make the sprites change costumes when we press certain keys (or what is the same: change costume every time we touch a colored area of our cardboard work connected to Makey Makey).

 Scripts for programming the blue area sprite.

I programmed it without using the Scratch extension for Makey Makey. But Scratch 3 includes an extension specifically for it, making it even easier.

If you're new to Scratch, you can take a look at the tutorials it includes, or I also recommend this great guide: Creative Computing Guide.

Step 5. Reimagine

I haven't explained all the details for implementing the activity, but I think I've highlighted the key points. Here you can see the Scratch project I made. Try it, explore it, remix it.

With the same core idea you can imagine many other activities:

- Change Mondrian for other abstract artists.
- Instead of making the colors change, make the shapes move.
- Add music. Every time we touch an area we can change the color and play a sound.
- Choose a figurative painting, and when touching the represented figures on the cardboard make a dialogue appear on the screen, or make them move, or make appear figures from other paintings, etc.