How We Designed a Typeface for Our Brand

Bronwyn Gruet
Building Creative Market
6 min readAug 8, 2017

--

Over the last year, the design team at Creative Market has been hard at work finding opportunities to push our brand and product design forward. So far, upping our typography game has been at the center of improving our design system.

1. We cleaned up our logoscript.

2. We said goodbye to Museo Sans and implemented a brand spankin’ new system font: Averta.

….And for our third act? We designed a hand-drawn brand font.

But…Why?

There’s a substantial segment of our community that discover Creative Market through the huge catalog of handmade products our shop owners create and sell on the marketplace. When we built our new brand illustration system, we wanted to honor the value of that handmade aesthetic, and make sure we were creating a style that incorporated bespoke touches and textures.

A couple of examples of Creative Market’s updated brand illustration style

Once we found our new illustration voice, it felt like we should take the natural next step to create a complementary typeface that shared the sensibilities of our brand illustrations. Our goal was to to design a unique, hand-crafted typeface that reflects our marketplace, exudes our brand voice, and pairs well with our brand illustrations.

Setting the Ground Rules

Even though we all got very excited about whipping out our brush pens to start creating this branded typeface, we didn’t want to design anything that would draw too much attention to itself. This new asset shouldn’t distract from or compete with our shop owners’ work when used within the marketplace. With that in mind, we set a few ground rules for the role our new typeface would play in our brand design:

  1. Simple is best
    We have some fun plans in the works to expand on this initiative in the future, but for our immediate purposes, we decided to keep things simple by focusing on a sans serif typeface, all upper case.
  2. Hand-drawn, not handwritten
    This typeface isn’t going to serve as our hero typography. It’s more like a fun and friendly sidekick within our brand design work. Instead of making something highly stylized, we were aiming for a structured sans that tastefully exudes a hand-drawn, friendly feeling.
  3. Keep it clean
    As a supporting brand asset, this isn’t a typeface that will carry huge headlines. We decided to keep texturing in the letterforms to a minimum to make sure it’s legible at small sizes, and to keep it optimized for embedding on the site.
  4. Slightly condensed
    Our system font, Averta, is a geometric sans. Steering the proportions of this typeface toward a more condensed sans would open up more possibilities for the role that the new brand font can play in our design system.
  5. Complementary to our illustrations
    This initiative spun out of our illustration system revamp, so we wanted to make sure the choices we made with type were informed by the characteristics of our new illustrations. Our brand illustrations and new typeface needed to carry the same energy and spirit.

Get sketching!

To get the ball rolling, we experimented with different tools to find gestural qualities that felt right. We wanted to honor the handmade aspect of the work. Any edge inconsistencies or small angles should come from an analog application of pen to paper. We ended up really liking some of the low contrast, bold marks these pens created.

A few of the pens we used for initial sketches

We tested a few different stylistic directions: condensed and rounded, low contrast condensed, high contrast letterforms, stylized terminals, and super simple monoline letterforms. We conducted a group critique the get the team’s gut take on the different styles, and decided to move forward with a simple, mid-weight, low contrast condensed style.

Next, we shifted focus to find the right proportions in a condensed style. Instead of starting with individual letters, we picked a phrase to use across the experiments. Each style was paired with a couple of our brand illustrations to get a sense of what kind of type felt good when in the same context as an illustration.

We also experimented with different cross bar heights against the cap heights, different levels of low contrast, and a couple different glyph styles for the letter A.

A few of the micro-tweaks we tested for our low contrast letterforms

After narrowing down to two final directions, we moved on to tweaking the weight, cross bars, and tiny personality characteristics. We kept the very slight angles in the terminals of some of the letterforms, since it provides a nice visual connection to the physical drawing medium. We ended up building out two lean fonts to test our final two directions in more contexts.

In context, our slightly less condensed option was feeling right at home with illustration work and at small sizes. We built out a set of diacritics, numerals, and refined some of the personality touches in the full set of letterforms.

Letterforms and a sampling of symbols & diacritics

After finishing out the set of vector letterforms and symbols, it was out the door for kerning.

Power to the Creators

After a few rounds of feedback and some fine tuning, we exported our brand font 1.0. We’ve got big plans for future phases of this asset, which will help us add a handmade touch to the design work we do in marketing and product.

Keep an eye out for this friendly little sans in brand design work!

P.S. — If you enjoyed this article, be sure to go back and read Goodbye Museo, Hello Averta, where Noah talks through the process of how we updated our site typography!

We’re always looking for amazing people to join the Creative Market team. We value our culture as much as we value our mission, so if helping creators turn passion into opportunity sounds like something you’d love to do with a group of folks who feel the same way, then check out our job openings and apply today!

--

--