The Copycopter logo process

The Copycopter logo process

My process for designing logos isn’t much different than the process that I use to design for the web. It starts with a bit of research and sketching and then a whole lot of refinement. The Copycopter logo will serve as a case study as I travel through my process.

Stage 1: Research & information gathering

I start by gathering information, a description and a list of adjectives, about the company, product, etc. As the client talks, I take down notes of words or phrases that I feel are important themes. I ask a ton of questions ranging from stupid to hard to answer. Why do they need a logo? What kind of personality should it have? Where is it going to be used?

Then I start looking for real world examples—photography, illustration, typography and design—that convey the attitude, personality, and any relevant visual elements. I stay away from looking at any other logos as it tends to give me tunnel vision on those examples. When I’m done, I’ll throw all these files in a folder for reference later in the process.

In the case of Copycopter, this was a bit easier. I had already designed the interface for the app so I already knew a good bit about what it was and the personality we wanted associated with it. It needed to have a helicopter or at least part of a helicopter in some way since it wasn’t reflected in the apps interface. This direction allowed me to really focus my search.

Stage 2: Sketching & idea generation

Sketching is the most important step in the logo process for me. It allows me to document a bunch of logo ideas really quickly. I get rid of the attachment that I have for my first idea and get all the bad ideas out of my head.

I fill up between two to four pages in my sketchbook with concepts. It’s a habit that I picked up at my first design gig, my art director demanded at least three pages. Each sketch should only take a half a minute and it should only take you an hour or two to get all your ideas down. While sketching I usually have the reference material that I just collected in-front of me and often continue the research while sketching. Don’t worry about the quality of your sketches or the quality of the concept while doing this. The time it takes to do one sketch allows for a shotgun approach. I’ve found doing this dump of ideas produces a better overall product.

I stop when the ideas that I am generating seem consistently useless. If I am struggling with ideas or want to dig deeper into an idea, I’ll start word association drills. This, then, leads to more sketching and research.

Stage 3: Selection

At this point, I narrow down the sketches to 3–5 of my best concepts and fire up Illustrator (my vector tool of choice) to mock them up. I’m still trying to work through these quickly so I’m not being exact with my vector points just yet.

I’ll stick to a dark gray usually during this process, which makes me concentrate on quickly seeing which concept could be the one that I really want to move forward with instead of focusing on color. This process also assures the logo will work in one color. If I do need two colors, I will use shades of gray. If the logo is a symbol, I will also start to pair it with typefaces.

In the case of Copycopter, I thought that one of my sketches was so on target that I took a photo of it with my phone and traced it in Illustrator. For the type, I was sticking to chunky sans-serifs and handwritten scripts. Both have a quirky friendly feel which is what the goal of the logo was. I used the color scheme that had already been defined in the web app instead of starting with gray.

At the end of this stage, when I have something that I think resembles the direction I want to go, I show the client. I only show the client one concept—the one I know is the best choice. The client was in-house for Copycopter and I was already showing the concepts that I had going.

Stage 4: Refinement

The refinement stage is all about fine-tuning the nitty-gritty details. I start adding color, refine the vector points and hone in on the other details in the logo. I really focus on the type, editing any characters that I don’t like or think could fit better with some simple edits. Most importantly, all the characters in the logo need to be kerned properly.

I really tried to refine the angle of flight for the Copycopter logo. The copter needed to be somewhat dynamic but not so much that it looked odd. It started out on a more drastic slope so I rotated it slightly. Getting the right angle and thickness right for both the blades and the tail made big improvements to the symbol.

This is of course an ideal process flow, it rarely is as linear as I have made it sound here. For example if I don’t feel any of my mockups I did in Illustrator are working, I’ll go back to sketching. I did this multiple times while trying to do the Copycopter logo. Also, because this was a thoughtbot project, I did not have to deal with the demands of a client. Dealing with demanding clients and the feedback they provide, the logo design process will often change from the example stated above.

If you haven’t already, check out the Copycopter logo in its environment at copycopter.com.

Kyle Fiedler Designer

Hound reviews Ruby and CoffeeScript code for style violations and comments on your GitHub pull requests. Free for open source repos.