March 17, 2020

Bringing to life visual poems with Scratch

In this post I will show you how to combine poetry, visual arts and playful coding. More specifically, I want to show you how to use Scratch to bring some visual poems to life.

Visual poetry is basically an experimental artistic expression that constitutes a genre of its own. It can be placed in the frontier of painting, photography, design, writing, and even poetic action. In short, it is a poetic creation based on visual resources.

In this small project we will bring to life three beautiful visual poems by Joan Brossa, a famous Catalan poet.

For each poem we will follow the same procedure. We will (1) look at the original poem, (2) see the final effect in Scratch, and then (3) see some ideas and tips for coding the animation. These are not complete tutorials, but rather stimuli for you to look for visual poems or make your own, and then create animations with Scratch to bring them to life.

If we imagine it as an educational activity (I prefer "learning experience"), it is ideal for simultaneously learning literature, art and technology. It is adaptable to many ages, as we can choose easier or harder poems to bring to life.

Poem 1


Scratch animation:

Scratch tips: 

To achieve this effect, the first thing I did is to edit the image of the original poem and delete all the letters inside the piano. Then I put the image of the empty piano into Scratch (as a sprite), and painted the white surfaces in transparent color.

Then I used only one more sprite, with the particularity that its "costumes" are all the letters of the alphabet. Scratch has some pre-designed sprites that are letters, but they don't have "costumes". For language, literature and poetry projects it is very useful to have all the letters of the alphabet as "costumes" for a single sprite. If Scratch had a sprite with these characteristics it would be very useful. In fact, just as there are extensions for drawing or making music, it would be very interesting if Scratch included an extension for language constructions (playing with letters and words).

For these reasons I just mentioned, I had to create a new sprite, with the letters of the alphabet as costumes. That was a bit tricky, having to download images of all the letters and put them into a single sprite. The good news is that I already did it, so you can reuse my sprite (you'll find the link to my Scratch project at the end of the post).

Once we have the piano-sprite and the alphabet-sprite, the idea is to use clones to generate many letters that originate from a single point (the center of the stage) and move in random directions, bouncing when they hit the piano.

For the bounces, just use the sensor that lets you know if a sprite is touching another one.

In my project, the alphabet-sprite creates 200 clones of itself and each clone executes this script:

Poem 2


Scratch animation:

Scratch tips: 

In this case the animation is quite easy. This time I used seven sprites: one for the umbrella, and the other six are for each word line ("pluja" means "rain" in Catalan; the original poem uses the word "lluvia", which is "rain" in Spanish).

To achieve the effect you have to play with layers and transparency. The umbrella-sprite is quite special. It covers the whole stage, and it's shaped like this (the squared surface is transparent):

If we put this umbrella-sprite on the front layer, and move the word-lines-sprites in the back (previously tilted), we will get the desired effect. The scripts are really easy. You can check them in my Scratch project (see link at the end).

Poem 3

Scratch animation:

Scratch tips: 

The last poem also has a pretty simple animation. It was more time consuming to get the sprites than not to program them. We have a sprite for each letter of "llibertat" (the Catalan word for "freedom"). But I wanted to keep the exact same font of the original poem, so I used an image editor to cut out each of the letters. These letters are simply placed in a curve, respecting the size (which decreases).

The beautiful aspect of the programming was to get the effect of the birds. I used a single sprite-bird (you can draw a bird and create several costumes, or reuse one of the many birs-sprites that you can find in the Scratch community), which clones itself to get the flock. Each bird executes exactly the same code, but with a couple of random parameters (size and direction). Here below you have that script:

Finally, here you can see the Scratch project with the 3 visual poems all together, plus music by Chopin:

 Check the scripts and feel free to remix the project here.

Visual poetry gives us infinite ways to experiment with Scratch. Instead of using famous poems, try to create your own. Or you can also add music and sound effects. Or you can even add interactivity using devices like Makey-Makey or micro:bit.


Post a Comment