Sometimes it’s helpful to see a logo built from concept to finished product. There are many striking logos around, but not many tutorials on how designers create a logo from scratch. Here is my thought process from the germ of an idea to finished design.
I needed to create a logo for my new store, Miniature-Boxes.com. This is an online retail store that sells small keepsake and trinket boxes like this:
I knew that I wanted to use rich jewel tones for this website, using the colors in the boxes above as my inspiration. My first step was to open up Photoshop and create a new document 1000 pixels wide and 900 pixels high. I chose a 300 ppi resolution because I’ll need to print this logo as well as use it for the web. I like to choose a larger workspace when creating a logo so I can bring in inspirational elements like the box pictures above.
I typed out the words “Miniature Boxes” and set the color to 9900cc, which also happens to be a web-safe color. I then tried out various fonts to see what worked. A script font seemed to be a good fit for this logo since the items I’m selling are geared toward women.
I messed around with this for a while and finally found an ‘M’ that I liked. I set the entire word in the script font but it was too difficult to read so I picked a simpler font for the remainder of the words. I then moved things around a bit and added one of my boxes to fill in an empty space.
This looked okay. I was careful to square up my lines of sight, so that the words were justified at the right and bottom. But I didn’t like the photo of the box as part of my logo. I wanted something more general and abstract. I decided to draw my own. I picked the ellipse tool and drew a purple oval right over the upper part the the box in the picture. This was the lid. I then drew another oval underneath the first and gave it a slightly different color. This was the container part of the box. I then chose the ellipse tool again, held down my shift key to constrain it to a circle, and drew three dots for the feet and clasp. I turned off the layer with the photograph.
I liked this much better, and I spent some time pushing the words and the box around and trying them in different combinations. Unfortunately, the more I messed around with this, the less I liked it. The clean lines of the box didn’t seem to work well with the script font. I decided to start again with the font so I dragged the entire workgroup to the “Create a New Layer” icon on my Layers box to create a new set of layers.
I decided to go for a cleaner, more modern look this time, something more Web 2.0-ish. I found a cool font called “Geometr231 Lt BT” and set my text in it. Perfect. The curving lines of the font, especially in the letter ‘b’, echo the curving lines of the box I drew. I set everything in lower case to further make this connection. I replaced the letter ‘o’ in the word ‘boxes’ with the actual box to integrate the graphic into the logo. Then I added the tag line, being careful again to line up the edges of the words so that the logo fits into a even rectangle. In order to make the word ‘miniature’ fit properly, I had to increase the tracking (space between letters) to 200. This has the added benefit of making the word look more modern. The final result is below.
Miniature-boxes.com turned out to be kind of a sucky business idea so I’ve closed down the shop. I still love this logo though!