Publishers of technology books, eBooks, and videos for creative people

Home > Blogs > Designing the DesignThink logo

Designing the DesignThink logo

By  Sep 30, 2010

Topics: Design

The project: Design a logo for our DesignThink blog. Two sizes needed: 250 x 250 pixels and 75 x 75 pixels.

We were given the name "Robin & John's DesignWorld" and a graphic designed by Peachpit Press of a globe resting on a green leaf. Sort of a micro-macrocosm concept. Unfortunately, the logo used Helvetica. Before we published a single article, Robin decided the name DesignWorld was too ordinary and boring. "Dorky" might have been the exact adjective she used. After bouncing ideas back and forth we decided on "DesignThink." When we asked Peachpit if it would be OK to change the name and logo, they said "Sure, no problem, especially if you design the new logo."

Robin suggested we do something with hand-lettering to present a casual, fun approach to the blog. "How about something like that lettering you use on your fine art prints, or for The Shakespeare Papers," she said.

A very important point to make here is that I'm probably one of the worst calligraphers in the world. Being left-handed doesn't help at all, having to push pens and brushes across the page instead of pulling the brush in a flowing motion like right-handed people would do. For years I avoided the mere thought of calligraphy.

But with the advent of the digital age, I had two epiphanies. First, I realized that if I use a Wacom tablet, the surface of the tablet is so smooth and slick that even left-handed me can create brushy letter forms that can pass as calligraphy. Second, calligraphy doesn't have to be beautiful and perfect. It can be goofy and funky, even ugly. Add in the convenience of being able to undo, copy, paste, reposition elements and suddenly calligraphy becomes fun instead of stressful and traumatic.

A casual hand-lettered example from an issue of The Shakespeare Papers, about proverbs that appear in the Shakespeare plays.

I started by experimenting with the calligraphy brushes in Corel Painter, trying different casual styles of lettering.

Eventually I began concentrating on a playful rendering of "design" and a sketchy version of "think."

At this point in the process, I cleaned up the letterforms in Photoshop, then opened the Photoshop file in Adobe Illustrator to use the "Live Trace" feature. This gave me a vector file of the letterforms that could easily be resized, stretched, or condensed without affecting the resolution.

After adding a square container, our names, and a tag line, I began experimenting with ways to make the extra text stand out more. The splotchy black shapes were made with a blobby ink brush in Corel Painter.

With all the elements in place, I added a glow around the black shapes to separate them from the background, and resized the graphic to the 250 x 250 pixel size.

We also need a 75 x 75 pixel size, so I re-sized the file again. The small text looked pretty bad (below), but I tried to convince Robin, and myself, that it was still readable.

Oops, bad news. I'm told the small version of the logo is actually supposed to be 55 x 55 pixels, not 75 x 75. Resizing the art again made it obvious that this design wouldn't work (below).

Time to fall back to Standard Emergency Plan B: Simplify.

I removed the tag line, set "Robin & John" line in a condensed font and made it as large as possible, then cleaned up the word "think" using mostly straight vertical and horizontal lines. For the small 55 x 55 pixel version I set our names in an aliased font (FFF Executive) to improve legibility.

Even though we've simplified the original design for use on the web site, we'll leave open the option of using the more complex version for certain special applications.