ICM: Sakura (Revisited) and Koyo

This week in Intro to Computational Media @ ITP, we learned how to add text into a Processing sketch.  I used my Sakura (cherry blossom) sketch from week 3 as a departure point and added the Japanese characters for sakura さくら into the new version of the sketch (above). I wanted to create a kind of “digital calligraphy” that explored the relationship between words and abstract shapes and set everything in motion. I also made an autumn leaves (koyo) sketch with the Japanese characters for koyo 紅葉 and an autumn color story.  To make things more visually appealing, I increased the size of the triangles and added some transparency to the background to create a more stylized sense of the passage of time in the animation and to create an illusion of three-dimensional depth.

There was a slight problem in getting the sketches to execute correctly though.  Although Processing is able to deal with Unicode-8 character sets, I was unable to get the Japanese characters to display correctly in the calligraphy font that I wanted.  The Japanese characters were showing, but in a default san-serif font and not the font that I created and specified in Processing.  I realized that I had to import the full character set and not just the default characters that Processing turns into bitmaps when you create a font.  However, when I checked “all characters” in the Create Font menu and clicked on “Create”, my computer froze up, probably because Japanese fonts have literally thousands of different characters, unlike the 26 letters and handful of punctuation marks we have in English.  Since I was only using 3 different characters in the Sakura sketch and 2 different characters in the Koyo sketch, I thought I that I might try creating SVG files in Adobe Illustrator for each character and then importing the Candy SVG library into my Processing sketches, which would then allow me to import the Japanese characters as vectors instead of bitmapped fonts.  Also, I only had to load the characters that I needed, and not the entire character set of the font.  As you can see from the screenshots, this approach worked!  I got the Japanese chracters to display in the calligraphy font instead of the default Processing font which didn’t work in the context of the sketches.

Click on the screenshots above and below to play with the sketches.  Drag the mouse around the frame and hold down any key on the keyboard to scatter cherry blossoms petals/autumn leaves.

ICM: Week 3 – Sakura

In week 3 of Intro to Computational Media at ITP, we learned about functions and objects in Processing.  I also peaked ahead to arrays so I could execute my idea.  I was inspired by my t-shirt (below), which is a Japanese design of cherry blossom petals (sakura in Japanese) blowing in the wind.

Here is my abstract Processing version (or click on the screenshot below to view). Press any key or click the mouse in the square to scatter cherry blossom petals.

View source code