@djrrb Look what I came across at the thrift store just now! pic.twitter.com/10Zxk7Kubv
— Nick Sherman (@NickSherman) June 2, 2018
June’s Font of the Month: Merit Badge
It’s hard to talk about recent developments in font technology without mentioning two hot topics: variable fonts and color fonts. As support for these two technologies has been improving over the past year, a natural question arises: “Can you have a variable color font?”
Well, as you can see with June’s font of the month, Merit Badge, the answer is a resounding “Yes! But...”
Before we get into the technical nitty-gritty, let’s start with the design. The inspiration for Merit Badge comes from a Boy Scout guide that I found at a fantastic used bookstore in Shelburne Falls, Massachusetts (not too far from my new house!). It featured a blocky slab serif with a striking inline stroke. Because of its modularity and relative simplicity, I thought it could be a fun (and manageable) starting point for experimentation at the intersection of color font and variable font technologies.
Many color fonts out there rely on embedded image data (SVG or PNG), which is great except that images don’t respond to OpenType glyph variations (only glyphs do). Fortunately, the COLR/CPAL approach takes normal glyphs and layers one on top of the next, making it perfect for a color variable font. Color font enthusiast Roel Nieskens used this same approach to turn my silly drawing into a variable color font proof-of-concept, and he provided invaluable feedback on Merit Badge as well.
Variations-wise, the standard weight axis plays with the relative thickness of the interior/exterior and inline strokes (try animating it!). Meanwhile, the custom SANS axis will reduce the length of the slab serifs until they disappear, just in case this design wasn’t already basic enough for you (see also the recent Foreday which has a similar feature).
Color-wise, I’ve included a handful of color palettes in the font, but most software won’t let you see anything but the default palette of turquoise, blue, and yellow. With the help of Chris Lewis, I put together a simple minisite where you can customize the default palette of your font and make it whatever colors you want!
As of June 2018, Merit Badge seems to work nicely in recent versions of Safari, Chrome (depending on the operating system), and Edge. Firefox gets you the color font, but no variations (for now). Photoshop and Illustrator get you variations, but no color (they support SVG color fonts, though). But have no fear: you can always use OpenType Stylistic Sets 1–3 to access each of the layers, and then color and stack the text blocks yourself.
So, is Merit Badge the most usable or versatile font I will send you as part of Font of the Month Club? Probably not.
Is it a bit early to be considering variable color fonts for production-level work? Probably.
But I wanted to release this font to you now because, A) experimenting with this stuff can be fun, and B) hopefully it will result in better support for these kinds of fonts in the future. (I am proud that the development of Merit Badge has already yielded bug reports for Safari, Chrome, Firefox, and Illustrator!)
For those of you who have signed up for the club and got your copy, let me know if you hit any speed bumps, and I hope you enjoy playing with this font in all of its blocky simplicity and technical complexity. Have an excellent June!
Wow, a full embrace of Hobeaux Rococeaux Borders. And fonts in use by @sunhelen @djrrb @richard_lipton @jessicahische and others. Love it!! https://t.co/9XrqYjjAZ9 pic.twitter.com/105qxKtxQL
— OH no Type Co (@OHnoTypeCo) May 8, 2018
New weights for Roslindale, this month at fontofthemonth.club.
April’s font of the month: Rumpus
Distinctive serifs can be a blessing and a curse. The shape of the serif can get repeated so many times in a line of text that it can easily come to be the defining characteristic of a typeface, and consequently the glue that holds that line together.
But serifs don’t go everywhere. In typefaces that rely on distinctive serifs to be that glue, there is always a problem: How do you get unserifed letters like O to feel like they are speaking the same visual language as the rest of the typeface?
One of the things I love about Stephenson Blake’s 1883 Wide Latin is that it lets pointy stuff get super pointy and it lets round stuff get super round, but it all seems to kinda work. But I’ve been wondering what all this wonderful sharpness and roundness would be like if it just weren’t so...circus-y. And that’s where April’s Font of the Month Rumpus comes in.
I started drawing Rumpus years ago in a variety of widths, and to be honest, I’m still not sure that I have a handle on the design. It abandons Wide Latin’s modern structure for a more humanist one, and is more consistently wide across both caps and lowercase. It also plays the round/pointy game a little differently than its predecessor, losing some of the extra serifs on letters like V and W, but making up for it with diamond dots and interior corners.
Rumpus is stilly very much a work in progress, and I think pieces of the design are still unresolved. Still, I find that it is an excellent choice if you don’t have a lot to say but have lots of room to say it!
