Project 3: Typesetting

Brandon Grotesque

Part 1

Crafting a Narrative

Among all the available options, I chose Brandon Grotesque as my typeface because of its modern, yet friendly and approachable appearance. Its rounded corners and mostly consistent stroke weights gave it a comfortable and versatile feel, which I hope will keep my options open in the context of this project. However, I was especially drawn to the lowercase “g” in the sample text; I feel that Brandon appears unassuming at first in letters like “T” and “y,” but hides little moments of surprise in letters like “g” and at the tips of “p”s and “r”s that give it a slightly quirky aura.

Brandon Grotesque

Adjectives:

Friendly
Concise
Simple
Geometric

Brandon used in a promotional flyer for Comedy Central

For my essay, I began by doing some surface level googling on the typeface and found that it was created in 2009–2010 by Hannes von Döhren. However, due to its young age, I wasn’t able to find as much information on its history as I’d hoped for. Thus, I turned to its creator, Döhren, hoping to find more context perhaps on how the typeface came to be. I was also able to find that Comedy Central used it as a corporate font–not to be confused with the literal show called “Corporate.” I found it interesting that other brands like Walmart had custom versions of the font made, and that it was also used for the unaffiliated Brandon University. Although not very commonly used, Brandon proves to be versatile in its applications, most of which have positive connotations.

Essay:

“It is the butterflies in your stomach and the glistening sparkle in your eyes when you see a well made ampersand,” remarks Hannes von Döhren, a German designer and typeface enthusiast. Early in his career as a graphic designer, Döhren found himself fascinated by the patterns, bends, systems, and surprises in the world of typography. Determined to make his mark on an ever-changing landscape of typefaces, Döhren established HVD Fonts in 2009, a type foundry driven to create typefaces that combine fun with functionality. Later that year and into 2010, Döhren took strong interest in the sans serif typefaces of the 1920’s and 30’s, thus inspiring him to pay homage to past geometric and structured typefaces.

Brandon Grotesque was then born as a collaboration between Döhren and Igini Marino of iKern, who developed the spacing and kerning. Despite being built upon the foundation of typefaces nearly a century old, Brandon was designed with legibility and modernity in mind, putting a contemporary spin on tradition. Whereas many sans serifs tend to take on sleek and sharp characters, Brandon’s rounded corners, low x-height, and humanistic curves convey a non confrontational persona that is friendly, simple, and concise. Slightly slanted stroke caps above letters like ‘p’ and ‘r’ break the otherwise consistent stroke weights, further contributing to Brandon’s approachable nature.

Featured as Comedy Central’s corporate typeface, Brandon’s subtle playfulness and versatility make it perfect for promotional materials and marketing campaigns. It also has a few variations, such as in the case of Bogle, a custom version made for Walmart. Other related typefaces include Brandon Text, Brandon Printed, Brandon Grotesque Condensed, and Brandon Text Condensed. It exists in 6 different stroke weights ranging from Thin to Bold with Italic versions of each, thus making 12 different styles that are fully equipped for displays of all types and sizes.

When condensing this information into 50 words, I tried to encapsulate the main points of its narrative and appearance/purpose:

50 Words

As a graphic designer
Hannes van Döhren discovered
a passion for typography
And started a type foundry dedicated to the craft
He develops Brandon Grotesque in 2010
Inspired by sans serif typefaces of the 20’s
But with a contemporary twist
A friendly, flexible, and functional favorite
Perfect for any display

Part 2

Thumbnails + Typeface Exploration

When beginning to dissect the anatomy of my typeface, I took a closer look at the rounded corners at the ends of each letterform. I was also interested in the wide-set kerning that gave the text a slightly quirky feeling, as well as the slightly conical stroke caps. Brandon also has a surprisingly low x-height that makes it appear approachable and unobtrusive.

Because Brandon was inspired by highly geometric sans-serif typefaces, I could see in my exploration of letters of interest (to the left) that many of the letterforms adhered to almost-perfect circles. However, stronger variations in this circular pattern such as in the bowl of the “a” would also give the typeface more readability and a human touch.

When I first began to create thumbnails, I was thinking very generally and quickly, not giving a lot of specific thought to each box. It started to feel routine: Title, text, image. I thought a little about creating curved image frames to match the curvature of Brandon’s letterforms, but the uncertainty of whether I wanted to use a photograph or create my own composition through letterforms was a little paralyzing in the beginning stage.

Initial loose thumbnails

After getting warmed up, I began to think more specifically, this time considering whether I could use the title in a major way. Looking back, I realize I started to get tunnel vision a little, as the title is pretty big in most of these. Taking inspiration from my explorations with geometry, I also thought about using circular shapes to emphasize the roundness and friendly nature of the typeface. Additionally, since I was interested in the lowercase “g,” I felt that it held value as a possible graphic component.

A second stab at thumbnails

After being introduced to the method of using letterforms to inform my body text proportions, I played around with the letter “B”, but later realized this made my text boxes too wide.

Explorations in body text proportion

I then moved my favorite 8 thumbnails into Figma to lay them out digitally:

My favorite 4 thumbnails

When laying them out digitally, I felt that I had more freedom in my ability to explore different ideas quickly and effectively, and being able to see the actual letterforms magnified accurately on the page helped me make more informed decisions.

Part 3

Moving into InDesign

As I looked for potential images to use, I kept in mind my adjectives: friendly, simple, and concise. Because I didn’t have a certain object or subject matter in mind, I used these adjectives to fuel my search queries. Some contenders I was interested in using:

Moving into indesign, I started putting together very quick and basic compositions, but still felt dissatisfied with the existence of a hard image border. Some examples:

Feeling hesitant to commit to a photograph, I began to experiment with enlarging the letterforms in the same way I did for some of my thumbnails. I also felt that because there were subtle characteristics that help define Brandon (rounded corners, geometric bowls, etc.), it would be important to emphasize its nuances. Some explorations:

Feedback from Vicki

General:

  • The rollercoaster image and how it’s cropped/placed is interesting and fits with the nature of the typeface, but the body text placement in those would need much more work
  • The other images are okay, but perhaps not as effective as the letterform composition
  • “Brandon Grotesque” should be presented as one unit; they should be the same size and weight with less of a gap — perhaps right align

About the letterform compositions:

  • The large arch going across the spread starts to unite the two sides; keep that working
  • The difference in opacities creates a good sense of scale and depth
  • Body text should all be in one text box
  • Pull out a statement line/callout
  • Try a warm color palette
  • Keep duplicating and iterating!

After cleaning up the body text and adjusting the rag, in my next few iterations, I kept adding, shifting, and troubleshooting with letterforms. I loved the boldness of the “g” and the way it created an interesting set of curves that could be balanced by the body text. I also developed a warm color palette that I felt could convey Brandon’s sense of friendliness and unobtrusive simplicity. Additionally, I began to cut down on the body text to free up space.

Looking for more advice and another set of eyes to help me decide between these different color combinations, I reached out to peers and met with Jaclyn to get more feedback:

  • The body text was still too wide, could be taken in a little more
  • In the yellow poster, the colors start to feel very grey and meshed together
  • The white arch could be balanced out by another white form, maybe in the bottom right

(Tentative) Final:

Final crit feedback:

  • The “g’s” form is nice
  • The title is a little low; it could be moved up (maybe to the counter of the “g?”)

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store