The secret life of a banner

When Dr. Becca announced that she wanted a new banner for her new blog, my response was simple:

“Designing a banner sure beats working.”

She liked what I did. Hooray! So let me take you through the  design process. The first step was reading the directions. I fired up Corel Photo-Paint, and set the dimensions to a new page to her specifications.

The picture

Almost everything was dictated by the title, “Fumbling towards tenure track.” The key word to me was “fumbling,” which immediately has some possibilities for a graphic interpretation. When I hear the word “fumble,” I think of the most famous fumble in Canadian history.

Robert Stanfield has sometimes been described as the best prime minister Canada never had. On the campaign trail in the 1970s, he was playing a little football with some of the reporters, firing off several nice passes. He dropped the ball once. And guess what picture made the front page of the most widely circulated newspaper in the country the next day? This one:

The picture is credited with harming, if not destroying, Stanfield’s chance of winning a federal election. Read more about this picture here.

To me, no other picture so completely captures the frustration of a fumble. So I wanted to use that in the banner. The shape wasn’t right to use the whole photo, but I was able to crop it to show just the fumble.

The typeface

Again, the word “fumbling” played into the choice. The typeface couldn’t be something rigid. It needed to have a bit of the unfinished, slightly haphazard, hand-drawn look to it. I simply scrolled down through the list I had, and found about three that fit the bill. I settled on Ripe, a free typeface I’d found through this article. It wasn’t hand drawn, but it did have some of the variation in letter shape I wanted. And I liked the roundness of it, which suggested a little of the playfulness implied by a fumble. (It has some problems with descending letters, like g, p, and q, though.)

The colours

Dr. Becca wanted something that matched this:

(Why she has this as her avatar... well, I suppose that’s her story to tell.)

I used a trick Garr Reynold talks about in Presentation Zen Design (which I reviewed here): use the colours in the photo. Corel Photo-Paint calls this tool the “eyedropper,” while others call it a colour picker or something similar. It measures and copies the colour at a point in the image. The text and background match the avatar, because the colours were literally picked from the avatar’s photo.

The dark yellow lifted from Dumbo’s hat highlighted the key word, “fumbling,” which I also emphasized by making the text larger and by jiggering the placement a little. Dark blue from Dumbo’s skin for the rest of the title, and light blue for the background, and, as the French say, “Voila!”

The result: