#HackArt

by Eduard Muntaner-Perich

Here I share my personal explorations on creating learning experiences that mix Creative Computing and Art.

February 23, 2019

Hacking art at the museum with playful coding: Picasso


In this article we continue the series where we explore how to hack and play with famous works of art by using programming. In this specific case we will play with two paintings by Picasso, from the MoMA collection. For the coding part we will continue using Scratch.

A fun activity to increase children's (and adults') love for art is to create stories from paintings and sculptures. It is a way to immerse ourselves in the works of an artist and express our creativity with storytelling.

The example I present here is very simple. From a photo where you can see two paintings side by side, we bring to life two characters, one in each painting, making them talk, move, and even exchange the canvases. 

This activity is perfect for an art hackathon. Imagine that you visit a museum with your class or with your family, you walk around the exhibition halls, alone or accompanied by a guide, and while you enjoy the works and learn about the artist, you also take photos already thinking about the stories you are going to create.

After that, in the museum as well (or at school or at home), divided into teams, you start to imagine and create stories, hacking and playing with the pictures you have taken.

We need mobile phones to make the photos and computers (or tablets) connected to the Internet. Apart from this, we only need Scratch, although sometimes a graphics editor can be very useful to play with the photos. Paper and pencil to create storyboards are also highly recommended.

To cut out characters we can use free and open source software like Gimp. There are also online editors like Pixlr. Gimp has different selection tools and has a plugin called "Resynthesizer" that allows you to select something you want to remove from an image, and with the push of a key, it's gone without a trace. If you think these tasks are complicated, you can search for tutorials on the Internet. In Youtube you will find many videos that teach you how to do these things using Gimp or Pixlr. Or if not, you can simply use the Scratch paint editor, which is very simple but still powerful enough to play with your photos.

As I always say, and although these activities are for educational purposes, it is very important that when we play with works of art we always cite the artists and the works. If you want to do it with works of contemporary art by living artists, unless the art is public, it would be a good idea to inform the artist.

In my example I have turned a character from the painting "Harlequin" and a character from the painting "The studio" into two Scratch sprites.

Below you can see the two paintings and the Scratch project. If you look at the project on the Scratch website you can see how it is programmed by clicking on "see inside". You will see that the programming is very simple. I encourage you to remix it.

"The studio" (1927-28) and "Harlequin" (1915) by Pablo Picasso (MoMA collection).


Reimagine

Like all the activities I propose, this one can also be re-imagined in many ways. What if you create a story where characters jump from painting to painting? Or what if each team creates a part of the story and then they put them together? What if you mix characters from different artists? And what about doing it with sculptures?

February 11, 2019

Playful coding with a famous painting. Magritte


In this activity I try to show how we can have fun using coding to hack or play with a famous painting. Specifically, I used Scratch to do some playful coding with the painting "The pilgrim", by René Magritte. Magritte is an artist that children like very much (like all surrealists) because of his ability to unsettle you and make you wonder what you're seeing.

The programming in my project is very simple. It allows to move the head of "The pilgrim" with the arrow keys and make it coincide with the body (in the painting they are separate). You can also change the head and make others appear: the same face covered by an apple (a reference to another painting by Magritte), the Scratch cat, or Picasso's face.

In this project we are exploring two of the many things we can perform on a painting through creative computing: (1) to make an object in the painting move, and (2) to make appear new objects that were not in the painting.

Even if we use images of artworks for educational purposes, it is very important that we always cite the works and the authors.

To move an object in the painting, first we have to turn it into a "sprite". This means that we have to cut it out from the image, and fill the remaining space so that the cut is not noticeable (content-aware fill). In the image below you can see the original painting, the version without the face, and the face.


Although cutting images with the Scratch drawing editor is feasible, if we want to do a precise work, then it is not recommended. To do this kind of tasks we can use free and open source software like Gimp. There are also online editors like Pixlr. Gimp has a plugin called "Resynthesizer" that allows you to select something you want to remove from an image, and with the push of a key, it's gone without a trace.

When you have completed these steps, programming with Scratch is very easy. Simply put the painting without the face as a background (or as a sprite in the back layer) and then add a sprite that is the face you have saved in a separate file. From then on you can move the face, modify it, add sounds, or anything else you can think of.

I've added some buttons to the project that allow you to change the face. I do it through "costumes". The same sprite has several costumes with other images that I have added. Check the project and the scripts here, and feel free to remix it.



Reimagine

There are many ways to reimagine this activity. Take a look at other Magritte's paintings, you will see that they are very thought-provoking and will give you a lot of ideas. Let the children explore them. Also think about how to add interactivity with the physical world. For example, there are some objects that appear recurrently in Magritte's paintings (hats, apples, pipes, umbrellas). You can play with real objects and the Makey-Makey kit to make them appear or disappear from the paintings on the screen.


February 4, 2019

Imitating Jackson Pollock's abstract art with Scratch


This article is the first in a series that will explain how to play at imitating the abstract art of some painters by using Scratch.

We begin with Jackson Pollock's abstract expressionism. My Scratch project is inspired by his work "One: Number 31" (1950), on display at MOMA, New York City. 

Pollock, well known for his "drip paintings", is a very popular artist and proof of this is that on the Scratch website we can find dozens of projects inspired by his works. 


The activity that I describe below is conceived to generate a quite realistic result (although of course very far from a real Pollock painting). For the activity you only need a computer (or some mobile device) and an Internet connection. 

Although the version of the activity I am going to describe is more appropriate for secondary school students (since they need to have notions of angles and concepts such as randomness), we could also simplify it and implement it with primary school children.

Step 1. Learning about Jackson Pollock


Of course the best way to enjoy Pollock is to immerse yourself in his paintings, standing in front of them in a museum. As I usually say, if you are lucky enough to have a nearby museum with Pollock 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 Pollock. But if the museum option is not possible, the Internet is full of resources to learn. For example, it is very interesting to know how he painted directly with the canvases on the floor (see video above), what came to be known as "drip paintings". The MOMA website is also a good place to learn and enjoy the 86 works that are shared online.

The painting I have chosen is huge and occupies an entire wall: 2,69 m x 5,30 m.

Step 2. Painting a first layer of lines on the virtual canvas

The way I propose the activity, the programming is divided into two main parts. The first consists of painting thick lines and large areas of color. These lines later will be almost covered when in the second part we paint the network of thin lines, but they will generate some spots and shadows that are very useful so that the final effect is realistic. 

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.

In Scratch 3 there is an extension called "Pen" that allows us to draw on the stage. It's as simple as using the Pen Up and Pen Down blocks and moving the sprite around the stage. This is how we can draw a thick curved line (with random thickness and random transparency): We repeat 50 times a small forward movement, and we turn a few degrees left or right.

Drawing a random, thick and curved line.

If we now repeat the previous script 50 times and add a random color (within a set of 3 possible colors), we will be able to fill the stage with thick random lines of different colors and transparencies.

 Drawing 50 thick lines with 3 colors.

Step 3. Painting a large network of thin lines above what we had created before

Now we repeat the previous process but drawing many more lines, thinner, longer, and with five colors instead of three.

Drawing a random, thin and curved line.

 Drawing 200 thin lines with 5 colors.

If we now put the two parts together, and we first draw the fifty thick lines and then the two hundred thin lines, we get a result that is totally random each time, but always keeps the same style. To give it a realistic touch and make it look like a photo taken in the museum, we can add a sprite that represents people looking at the painting.

Result of running the program 4 times.

When we program a project like this we are generating a lot of iterations. The first part of the program has two nested loops with a total of 250 iterations (50x50). And the second part has two other nested loops, with a total of 60,000 iterations (200x300). All this makes the execution of the program slow. The whole process of painting the canvas can take more than 30 minutes. Watching how it runs is beautiful (and almost hypnotic), and I've added jazz music in the background. But Scratch allows to run the projects in "turbo mode" and you can see the result in just a few seconds (Shift-click on green flag for turbo mode).

My Scratch project. Shift-click on green flag for turbo mode.

Step 4. Reimagine

Finally, some ideas on how to play with the project, improve it and remix it. For example you can start playing with the numbers (length and thickness of the lines, number of iterations, etc.) and see how the result changes. You can also play with the colors. I've chosen some colors very similar to those used by Pollock, but you can use any. You could also have several sprites painting at the same time, or add a sprite that "drips" small colored dots on different parts of the stage, to make it even more realistic.