HoudahGeo Icon Design

Just this week I've completed the application icon for one of my MakaluMedia clients, Pierre Bernard of Houdah Software, on his latest beta application HoudahGeo. In June 2006, I designed the icon for Pierre's first OS X application, HoudahSpot.

HoudahGeo allows you to geocode photos with latitude, longitude and altitude information. Take your photos, "pin" their locations on the earth, then export information to EXIF tags or Google Earth KML files, letting you can see the images in Google Earth.

Sketches
Pierre and I started working with pencil sketches, using a globe with photos stuck to the surface, and a satellite in orbit around it, as you can see below:

1. In my first sketches, I focused on a single satellite, beaming information to/from photos on the surface of the globe. At this stage I hadn't worked out continents or exact placement of the photos, but knew I liked this general idea.

2. Here I played around with the idea of both a satellite and a camera orbiting the earth, and had by this round, started exploring continents and image locations a bit more. In the end, we discussed the camera+satellite option and felt the camera was redundant and not necessary to get the message across.

Production Icons
Next I went to production, using Fireworks to create the vector-based artwork. After a rough first draft, Pierre had an idea to try a pushpin in place of a satellite, though in the end, we felt the satellite just worked better.

With each successive revision, the earth was refined, satellite tweaked, highlights, glows and adjustments made. Here I've placed the first 4 revisions together to give you an idea how the process generally works:

The final adjustments and tweaks happened on icon v5, including a size up of the earth about 5-6%, lightening of the satellite's pulse glow and a few adjustments to photo locations on the earth itself.

Fireworks as Tool of Choice
The construction if icons using vectors in Fireworks, greatly assists in these kind of subtle tweaks. Because all of the elements are created as vector items, they can be easily sized up and down with no degradation of image quality, or moved around without worrying about re-applying masks or filters.

For comparison purposes, here is the final, winning HoudahGeo icon v5:

Thanks Pierre for choosing to work with me and MakaluMedia on your latest Mac application! I had a great time working with you on another fun icon project. :-)

Comments

[Jeremy Wagstaff]

Beautiful stuff, Mike, a real work of art.

[Pierre Bernard]

Thanks for the great work Mike!

[Allan Reyes]

Great work and happy to know that you use Fireworks!

[Kris Gosser]

Amazing stuff, Mike. I got a quesiton for you:

Do you have a template for the shape of the land masses? Or did you create those yourself? I end up staying away from globe type designs becuase I can never nail the right shape and proportions of the America, Europe, Africa, etc.

[Mike Rohde]

Jeremy, Pierre and Allan, thanks for your kind words!

Allan, I really love Fireworks � as a long-time Adobe Illustrator user, its vector oriented approach suits my workstyle quite nicely.

Kris, I happened to draw the continents, based on a real photo I found as a reference. I wasn't worried about perfectly capturing every crinkly detail, so the continents aren't 100% GPS accurate, but are close enough for use on an application icon. :-)

[Rev Cruz]

Very beautiful icon! I will have to look at Fireworks, and perhaps do some of my future projects there. I presently use CorelDRAW in all of my projects.

[Mike Rohde]

Rev � thanks! Do check out Fireworks. If you are into vector drawing it's a natural transition � since you're into CorelDraw, it might be a nice fit for you. Read this article as well:

http://www.pixelyzed.com/pixelforge/whychoosefireworks/

[ilker]

Good job!

[Respiro, the logo design guy]

Mike, great work! Congrats! What soft did you use? I presume that Adobe Illustrator... at least, this would be my option. :)

[Mike Rohde]

Thanks Iker and Respiro!

I used Fireworks for this one and for all of my icons � gives me lots of options and works very much like Illustrator (which I love for logo design).