Painting with Hiroshi Kawano

I have finished week twelve of Andrew Glassner’s 2D Animation and Interaction Course. This week the subjects were shapes, angles, loops, variations on ‘if’, utilities and the mouse. The homework was to create a painting program. Painting has to be interpret very broadly. I have to use the mouse and the keyboard. Did not need to use map (), lerp () or dist(). Instead I used the modulo.

Because I would like to make a painting program in which you can paint in Hiroshi Kawano’s style I made it very simple. Kind of Ceefax style. I would like to add simple rectangles to Hiroshi Kwawano’s painting. To do so I had to paint rectangles with a size twenty times twenty pixels. Also I would like to change color during the painting. And I would like to clear everything when I am finished or when I am not pleased with the result.

That seems simple. And it is. To paint in rectangles I used the modulo. It calculates the reminder when one number is divided by another. As the Processing 2 reference page states: when 52.1 is divided by 10, the divisor (10) goes into the dividend (52.1) five times (5 * 10 == 50), and there is a remainder of 2.1 (52.1 – 50 == 2.1). Thus, 52.1 % 10 produces 2.1.’ An ideal function to calculate multiples of 20 pixels.

I created a global variable which holds the number twenty. Used mouseDragged to paint. The outcome of the mouseposition modulo rectanglesize are subtracted from the actual mouseposition. This gives the location of the rectangle in multiple positions of twenty. Sounds very complicated in text but it is easier to follow in the actual code. To choose the five painting colors (red, black, orange blue and white) I just stored them under the keys one to five. Made black the default paint color. To clear the image I used the zero key. This paints the background-image over the entire painting which results in clearing the screen to its original state.

I posted a four paintings.
KawanoPaint_01
KawanoPaint_02
KawanoPaint_03
KawanoPaint_04

And here is the paint program including the code.
KawanoPaintProgram

Advertisements

Comments? Leave a reply.

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s