Last week, The Hype Machine, a sort of combination music meta-blog and playlist, published its round-up from the year just ended, including its listing of the top fifty bands of 2009, with each of the fifty slots illustrated by an invited visual artist. If you skip ahead, you’ll see that the indie pop contenders The Pains at Being Pure at Heart came in at number thirteen, and that the illustration was done by none other than yours truly.
Seeing Forest, Trees
What I produced was less of a traditional illustration, really, than a kind of typographic/photographic hypothetical.
I gave myself the assignment of designing something vaguely like a poster or an album cover, borrowing some aspects of those forms without actually serving any real purpose other than nominally marking the band’s place in the countdown. (By the way, their debut album was among my favorites for the last year; buy the CD or download from Amazon and I get a kickback). Mainly, I took the opportunity to have some fun.
By way of demonstrating my meager photo retouching talent, I thought I’d share the genesis of this illustration. It started with this photograph, one of a series of shots I took while visiting central Illinois, where my girlfriend’s parents have a view on a beautiful wooded area.
The first thing I did, obviously, was crop down the photo to match the 900 x 600 proportion that specified in Hype Machine’s brief to me. I tried to select as visually interesting an area as possible that, crucially, would form a kind of natural grid, as I knew I’d want to run type behind it.
Next step was to set the type, which is shown here with all of the funky kerning that I had to add in order for the words “Being Pure at Heart” to read from behind all of the branches.
In order to get the letterforms to recess, I created a new channel from the blue and red channels of the photo itself, adjusting the levels for maximum contrast.
Once I had that alpha channel, I used it as a layer mask, which achieves the desired effect of obscuring the portions of the letter forms that ‘stand behind’ the trees.
Obviously, the type wasn’t showing up very well against the light blue sky, and some additional contrast was in order. To do this, I added a few different layers of gradients on top of the imagery, setting them at about sixty percent transparency and setting the layers to multiply the gradient colors with the image data beneath. Here, a dark blue gradient, starting at full strength at the very top and diminishing to nothing about halfway down the image, is applied to darken the sky.
And here a bright orange gradient, starting at full strength at the bottom and diminishing to nothing about a third of the way up the image, is applied to warm up the trees.
I found that orange to be too chromatic though, and what I really wanted was for the thickest area of the trees to create a background solid enough to set smaller type against. So here I added a gradient of black to the bottom and set it to darken the tree trunks and deaden the warmth a bit.
Having achieved the relative contrast I was looking for, I stepped back and decided that the overall effect was a bit too artificial. So I used a levels layer to lighten the whole canvas.
Finally, I added the smaller blocks of text — which are purely decorative, really. The two blocks on the left and the right are passages taken from the band’s Wikipedia page, while the text running along the bottom is the track listing from their debut album. All of these smaller blocks of text were intended to be displayed too small to practically read; again, they weren’t intended to be functional but rather merely decorative.
That’s it. Again, you can see the illustration at a larger size over at Hype Machine. Not a whole lot of concept, and only a modicum of true Photoshop skillz, but, for me anyway, a nice bit of fun.
I quite like this, Khoi. And thanks for sharing your process.
Fair play that is awesome 🙂
This is awesome, what is the typography used?
Cecilia: that’s good ol’ Futura Bold. Glad you liked it.
One of my absolute favourites out of the 50 artworks. Thanks for sharing!
So cool that you shared the process!
Was a pleasure to have you contribute!
I think my students would love to see your PSD file – are you willing to share it?
Thank you! Your remarks have been sent to Khoi.