Uh oh! Looks like your browser’s out of date.
You’ll have more fun viewing our site on one of these instead.
×

Content + Resources

Creative Tips + ToolsHow We Make ItPeople + Things We LoveThe Future Of...Work Culture
Jump To

Blog

Painting with Code

  • Send this to a friend:

    (required)
    (required)
Jun 04 2014

By day, I code mobile apps and design digital experiences. In my free time, I create art. I recently began exploring both at once with generative art, a sublime combination of computer programming and graphic art.

Generative art, or art derived from computer code, is a relatively new format, in which the artist-programmer realizes a vision or idea by defining parameters and commands. But making generative art is, in many ways, just like painting or any other classical fine art.

When you create a painting, you start with an inspiration and sketch it on paper. You then prepare your oils, brushes, and canvas, and you refine the painting until it’s just right. I follow a similar process with generative art. When something inspires me, whether it’s a contour map in a geographic magazine, a chart representing a mathematical formula, or the various mechE tools in my father’s workshop, I sketch it on paper and jot down the keywords that best describe it. Then, I sit down at my computer and compose the code (using the Python programming language) that will “paint” the right “brush strokes.” I run the code to generate images on my computer, and go through multiple iterations until the code outputs the shapes, colors, opacities, and shadows that perfectly express my original idea.

I leverage the power of my computer to generate the artwork. Where a classical fine artist would pull out their oils and brushes to express colors and shapes, I do the same with parameters. For example, I defined a palette of colors for painting waves like this:

As if the computer was a hand holding a brush, I tell it how to paint by defining command codes, like draw_wave:

Delightful randomness

While most of the parameters in my code are set statically, I have also added an algorithm that allows certain parameters to be generated randomly, so the visual elements of the image change randomly within a defined range. This way, the final product is unpredictable; I’ll never know exactly what image will be generated.

This function returns a float number randomly ranging from 0.1 to 0.7:

The random parameters are not only unpredictable, but also non-reiterative, so these images cannot be recreated—they are completely unique.

Algorithm as art

Computer graphics are based on mathematics, so when I paint with code, I am exploring and visualizing the beauty of structure, abstraction, and complexity in mathematics that most of us don’t get to see in our daily lives. It often happens that when I play with a new algorithm and see the images it generates, I'm inspired to develop them into artwork, as was the case with Tsunami, below. The inspiration for this series came while playing with an algorithm named Cornu Curve, which generates a fantastic visual effect of crazy waves. From the same code, I made six different images using a combination of a hundred curves in varying opacities and shades of blue.

Unlimited complexity

Creating art with code allows me to make complex images that I could never have made by hand, such as All Seeing Eye, below. It is composed of millions of lines and hundreds of layers, and each line has its own shadow, blur, and opacity.

My goal was to use the complex texture to create the visual effect of catching or entrapping the audience in the “eye.” The computer is an exciting tool for creating art like this, which requires repetitive, intricate work. A piece of generative artwork composed of millions of shapes can be drawn in just a few minutes. Rendered by hand, the same piece might take a human ten years to accomplish.

Like a painter selecting the perfect tool, I used the following piece of code to define a “brush” with just the right characteristics to create the lines I wanted:

Then, just as a painter would use a specific gesture to create a certain visual effect, I used the following code to tell my computer how to hold and draw with the brush I created:

Functional designs

The exciting thing about generative art is that it is not only beautiful, but also usable. We can create new patterns and unique fabrics for the fashion industry, or we can move beyond two-dimensional creations and use generative art to make sculpture, furniture, and even architecture.

Creating art with code, I’m constantly making new discoveries of exciting visual possibilities. Computers have revolutionized countless aspects of human life, and now, generative art has the potential to revolutionize artistic expression, opening infinite space for innovation.

  • Hailei Wang

    IDEO alum
    Hailei is an interaction designer in Shanghai.
  • Send this to a friend:

    (required)
    (required)
  • Send this to a friend:

    (required)
    (required)