Conceited Blog RSS Feed

Random musing from a couple of conceited indie Mac & iPhone developers. We like pretty things, we are good at everything, and we like to meet new people. We occasionally post things that might be of interest, so keep checking us out.

Anatomy of the Clips icon September 23rd, 2008

1 comment

Finding a talented designer

Probably the hardest part in getting the Clips icon designed was finding a talented designer to work with. I think we probably contacted around 15 designers who we felt had the right style for us, but in the end there was only one who had the right personality and design skills we required.

Jordan Langille of OneToad Design is one of the more popular designers for Mac and iPhone software developers. He came highly recommended by our fellow developers on the #macsb IRC channel.

Getting the preliminary sketches

When we approached Jordan, we really didn’t know what we wanted. We knew we wanted a nice icon that fit with the rest of Mac OS X and would convey what our application was trying to accomplish. We basically gave him free creative reign and shortly after our initial discussions he had produced the following sketch for our approval:

Clips sketch

What goes into an icon?

The sketch above is a good representation of Clips, at least we think so. There is the obvious clipboard metaphor, but taken further with all different types of media being stored in “cubbies” (ala Spaces) of their own. We left it up to Jordan to decide what content best be displayed in their own cubbies, and he did a pretty good job at conveying Clips’ everyday usage amongst various workflows.

Microsoft’s Zune and Clips’ icon: 2 things that don’t look sexy in brown.

The first revision of the Clips icon had a really standard approach to the clipboard, and Jordan used a nice brown color. The icon looked very nice, but really didn’t ooze pretty to us. Being conceited, we decided we would throw out the “norm” and go with a nice stainless steel clipboard. Practical? Not really, but it sure is sexy! Below is a picture of the first draft done by Jordan.

Clips sketch

It’s in the details!

We went through several revisions with fairly minor tweaks to shadows, reflections, textures, etc. until we came to what you know as the Clips icon today. Jordan was extremely patient and very helpful in getting the icon exactly the way we wanted it.

The little things other people don’t notice are the things that make Mac users special. If you look closely in the clip, you’ll see the reflection of some office lights. It’s a minor detail, but it’s there for those looking. Here is the final Clips icon.

Clips icon

Tags: , , ,




Posted in by Nicholas