A New Hope

A New Hope - student project


I've been following the Processing project for a long time, delving into it ever so often, but never really getting out of tutorial mode.   Then for awhile, I found Nodebox, which is an interesting tool that has some nice things going for it (Python-based, Modular building blocks, vector-based).  I did however manage to create a workflow that resulted in the images below.  I called the series 'Constrained Curves', after an interesting interaction that resulted from snapping the points of an ellipse to a grid.  Here's a few



Looking forward

After so many false starts with Processing, I'm optimistic.  I watched Joshua's Beyond Play: the Art of Creative Coding and was sold on the class right away.  Highly recommended viewing.   Especially if you want to design hotel carpets :)

Why was I sold?  Because of his enthusiasm, his philosophy, his background, and the anecdotes that I can completely relate to.  And most of all, that he had created a workflow.  Something that had eluded me for so long.  For me, that's huge.  A blank file is my worst enemy.

I also haven't brought my analog art into a digital workflow before.   I've done it the other way around, by outputing digital and transferring via lightbox.  Excited to bring it full circle.  My analog art tends to be abstract anyways, so excited to see how it fits in.

Next is exploration and play.  I'm thinking about Sketch for my vector work.

Update #2

I'm meandering my way through the Color class.  Finding photos with good colors and using the ColorPicker has become a sort of Zen game for me.  Spent some time making some SVGs, I've come to treasure my Motif Cubes and have thought for some time that these patterns would work well in generative design.  So in this first HYPE piece, I'm using HGridLayout to assign one of the six SVGs, rotate and apply a pallete derived from a desert sunset. At some point, I would like to add some interaction to cycle through the different SVGs and orientation.  There's another set of tiles that I would like to implement, to emulate Curtis Steiner's 1000 Cubes, which if you are ever at the Seattle Art Museum, you simply must stop to play with.

Update 3

Felt that not enough was going on in the background.  Split my pallete into two HColorPools and applied the reds/browns to some gridded HRect in the background.  I wanted the size to be offset, but ran into some issues lining up the two grids.  I should probably finish the Color lessons so I can learn to use layout more effectively!  Anyhow, I solved the problem of lining up grids by replacing the literal values with relative height/width values.  I also washed the colors out and added a little grit by overlaying a paper texture with HImage.


Update 4

So, I'm really enjoying taking a pallete and splitting it into subgroups via multple HColorPools, and then applying those to seperate composition elements.  For this iteration, I drew up new shapes (ala the 1000 blocks project I previously mentioned) and then applied in four layers of the same pattern via HGridLayout - greens, blues, a white alpha(50), and a flat black at double size.  Lastly, I apply a white paper texture via HImage over the whole canvas at alpha(50).  I'm seeing some similarities to Coast Salish styles, and may need to explore that more.  

Update 5 - 9/19/13

Only one SVG in this one, with repeated elements in the SVG.   It's still on HGridLayout, but went for more overlap by randomizing the size in divisions of height & width.   Two layers - the one in back has some larger sizes and a colored stroke.   I think I'll need to finish lesson 8 and output this to some larger files.

Update 6 - 9/25/13

Starting to get the hang of HPixelColorist, I think.  I think the major issue I was running into was sizing my designs to match the  image.  I had been using relative sizes ie  .size(width/8, height/8)  which works great with HGridLayout for square compositions but starts to get wierd when your canvas is non-square. Does anyone knows how to size HPixelColorist to match the canvas dimensions?   

For this update I created a new set of tiling SVGs and then overlayed at different sizes using the color layout from a random photo which had interesting blocks of color.   The source image:

After some HYPE alchemy:

Update 7 - 9/26/13

Really enjoying this pallete.


Did some hexagon grids, then switched over to rectangular SVG.  Liked how everything fit together at random rotations of 60

And with slightly chunkier shapes.

Update 8 - 10/7/13

Started a tumblr  - http://echophon.tumblr.com  I'll be posting more experiments there as the class winds down.

I've been looking at 'classic' Processing more and more, and seeing what I can integrate with HYPE.  Lots of trial and error and not much success.  Lots of looking at code examples and trying to sort out what's happening.  Exploring how introducing randomness affects things...    

Started reading 'Generative Art' by Matt Pearson again.  After that, 'Form Code' & maybe 'The Nature of Code'

Particularly fascinated with how things move in 3D space.  In that, I discovered random walkers again.  All these are derived from the HCanvas Examples (with some modifications)

Update 9  - 10/21/13

Just iterating a lot.  Trying to get into Matt Pearson's book, but just spending a lot of time looking at the HYPE sourcecode and examples.  PROTIP:  Want to learn more about how a class works?  Look at the individual PDE in the source.  Especially helpful when learning about the various parameters, and what they do.

Been really fascinated by options that 3D presents.  Jerome posted some very helpful tips on making looping gifs that have been super helpful.  Thanks Jerome!

And a really big thanks to Joshua for pushing HPolarLayout into staging.  I used it with 3D mode enabled and got some really interesting organic results by rotating on the individual axis with HOscillator (also super awesome!).  

And here's a few more with HGridLayout

Update 10 - 11/05/13

Spending a lot of time animating gifs, but random walkers still fascinate me.  These two series are using the new HPolarLayout with HOscillator to do the walking.

Lion walks

Color walks (using a colorshift function Joshua tacked onto one of the Examples)


Update 11 - 03/31/14

I'm mostly working on animation now, you can find my updates in the Programming Graphics II class stream.  But I'm finding that I'm desiring some printed work, so may be posting updates here again.  I'm not very savvy on printing at the moment, but looking forward to learning more in this area. Here's a new color walk

and here's a recent animation using HCanvas, HOscillator, & anchor point manipulation.  Title: Growth Cycle


Update 12 - 06/05/14

Went back and revisited HColorField, and used that with some sketches that had been experimenting with Perlin Noise.  I used a random layout and assigned different ColorFields with a modulo on the index of my loop.  Looking forward to exploring more with Color in this approach

2 Fields.

2 Fields Black