Monday, June 14, 2010

John Green's Website Icons

A couple of you may have heard of an author named John Green. I hear his books are pretty good, but he also makes videos on the internet? That's actually kind of weird...

Ok, just kidding. Today's post is about the icons I designed for John Green's new website, which was designed by Alan Lastufka. Alan asked me to design icons for each of John's books and a couple other pages, which he wanted to look hand-drawn and simple. I chose symbols from each of the books from the various covers and drew them out with the pen tool in Photoshop. For the text, I couldn't find a typeface that looked exactly how I wanted it to, so I wrote the alphabet out by hand, scanned it, and pieced together the words in Photoshop. It became a weird hybrid of a typeface and handwriting, and I think it works well for John's site. Below you can see all the icons I designed, including the ones that Alan didn't end up using in the final design.

The letters with the dots over them are the ones I used for the text.

By the way, I didn't make the colored versions of the icons that you see when you mouse over them on the site. You can thank Alan for that feature.


  1. Allows users to upload and share CSS templates which are licensed under Creative Commons Attribution or released into the public domain