Sunday, April 11, 2010

And then there were bubbles!

I oftentimes find that most of my projects are very spontaneous. I think this is why I like Processing so much; I'll be doing whatever I'm doing and then suddenly be like "oh hey I want to program x!"

And then I do.

My latest spontaneous Processing shenanigans were inspired by my motion graphics professor Rafael Macho. He was showing us some of his work and a design from his Aptera Car project caught my eye.

I thought "Wow, a design like that would be incredibly tedious to illustrate, but probably really fun to program" so I pulled up Processing and got to work.

My First attempt was very simple: Create a simple set of rules for how the bubbles look and then for every vertical coordinate create one with a random x coordinate. It ended up looking something like this (or click here to try the applet for yourself):

I liked the result from a visual standpoint, especially since the pattern scrolls infinitely, but I decided I wanted to try and see if I could prevent the bubbles from overlapping. I wanted to try incorporating physics. I found some code in the Processing examples library called "Bouncy Bubbles," by Keith Peters. I tweaked the code to incorporate my aesthetic and ended up with this:

The new bubbles, while amusing to watch, didn't create a pattern I liked as much as the previous attempt. So I returned to my previous attempt and reprocessed it in a different way so that the texture generated statically, without scrolling down the screen. I then decided that since it was a texture, it was important for it to be tileable, so I added a couple checks to make sure the bubbles continued on the opposite side of the screen if they went over the edge. In the end, I was rather pleased with the result:

The difference is not very obvious from taking a snapshot of the program, however when running the program (which features PDF export in the application version) and using the texture, it is now seamless and can be duplicated infinitely in any direction.

Coming soon - "And then there was JavaScript!"

Wednesday, April 7, 2010

Album covers for The Pillows (fun fun fun ok!)

During my senior year of high school I took AP 2D design. I had been messing with digital graphics for many many years, but this was my first experience with real graphic design, although I did not realize it at the time as I was striving to do digital illustration. For the AP portfolio I was required to do a concentration: a series of 12 pieces that followed a theme. I decided I would do album covers for my favorite band - The Pillows.

I wanted to do this not only because they were my favorite band, but also because their song titles were just so bizarre and made fantastic titles for art pieces. I did covers for songs such as "Instant Music," "Waiting at the Bus Stop," "Robotman," and "Little Busters." It was incredibly fun and I learned a lot - I had never done anything quite like it.

Now I'm in my third year of design school and such things come so much more naturally to me. I just finished two quarters of visual communications with Henri Lucas and decided I would try to make a new album cover, one with more focus on typography. I decided to try the song "Fun Fun Fun OK!" because I felt like the music could inspire some fun typography. After designing the cover, I took a live-trace of the pillows logo and added it to the cover (the vector is a little sloppy, but almost unnoticeable at low resolution).

You can listen to the original song here.