Among the many new features in Bear 2 is our own custom font, Bear Sans. Being a writing (and reading) app, we have quite a few users who care about how their text looks while they work. We thought it would be fun to explore the how and why Bear Sans came to be the new face of Bear.
To get these answers, we interviewed Pete Schaffner, Shiny Frog’s own Pixel Wrangler, who led this project.
What is Bear Sans?
Bear Sans is a customized version of Clarika by Brandon Knap. It originally comes in two flavors—geometric and grotesque—which we combined to create a custom typeface that optimized for legibility. For example, the foundation was built atop the geometric design, but many of the glyphs were pulled from the grotesque—the most noticeable being
G, K, Q, a, k, t, u and
y. We also completely redrew
M, g, 3 and
4, and adjusted the vertical metrics to meet our typographic requirements.
Bear Sans also has a beautiful italic that, like its upright counterpart, is optimized for legibility, while maintaining a beautiful style that is all Bear.
P.S. Nothing about Bear Sans is “grotesque”. That is a typographic classification used to describe some of the earliest sans serif typefaces.
What inspired you to design Bear Sans?
We wanted a typeface that was easy to read—both in the editor and the application’s user interface—but that was reminiscent of our original typeface, Adrian Frutiger’s Avenir, which had been the foundation of our brand and style since the very beginning of Bear.
“Form follows function” is a popular (and wise) mantra in the world of software. But we obsess over them both at Shiny Frog. We wanted a workhorse font that didn’t sacrifice personality or beauty.
How do you think the use of Bear Sans enhances the overall user experience in Bear?
Bear is all about text—both writing and reading it—so it made sense to create something that would make those two things a pleasure. As mentioned before, Avenir was our chosen typeface since the beginning, but it didn’t always fit the bill.
Avenir can be fatiguing to read at smaller body text sizes. We wanted something that kept Avenir’s geometric spirit, but was more legible in the editor and better suited for Bear’s UI. The changes are subtle, but they make a cumulative difference as you write and read your text.
For type nerds in the audience, here were some of the issues we had with Avenir in the context of an editor:
- uniformity in glyph width and shape (harder to discern individual letters)
- lack of contrast in strokes (again, harder to discern individual letters)
- loose letter spacing (in text it looks more like a block of letters rather than words)
…thus, Bear Sans features:
- More variation in character width (e.g. counters are oval: b d p q)
- More contrast (stroke variation) in the letterforms
- Larger apertures: e c s
- Tighter letter spacing
- Larger x-height
- True italics
Can you walk us through the process of creating the Bear Sans font? Were there any other fonts or designs considered, and what factors contributed to the final decision?
Because we wanted to keep the style of Avenir, we started researching geometric fonts, old and new, which kept that vibe while offering superior legibility.
At first we considered drawing our own or working with a foundry to design one from scratch. In the end, we opted to use an existing, battle tested design that we could augment to meet our specific needs. We found all that in Clarika.
As luck would have it, Brandon is a fellow Bear user and was willing to help us turn Clarika into the perfect typeface for our editor.
However, choosing the perfect, existing font to modify was not an easy process. We combed through hundreds of specimens before landing on Clarika. For the curious, some of our final candidates were:
Were there any specific challenges or obstacles when creating Bear Sans?
One of the biggest challenges was to create a typeface with personality, but not so much as to detract or distract from the process of writing. Just as Markdown helps you focus more on your words than on the formatting, so should Bear Sans sit silently, supporting your prose without taking from its meaning.
This isn’t an easy thing to pull off with geometric style typefaces, whose strengths usually shine in headlines, bold signage, and short bits of text. In order to make something that would look great for both short and long form writing, we spent countless hours combing over every detail—reading, writing, tweaking, reading, writing, tweaking—to ensure your eyes (and brain) don’t waste any energy and your thoughts can flow freely.
Any plan of polishing or changing the font in the future? Maybe more Shiny-designed fonts?
Typography and type design are evolving crafts, and we are perfectionists, so you can be sure we will improve Bear Sans over time. Type nerds might notice when we make changes, but hopefully most people won’t. We would also like to expand our character set to support more languages!
As for other shiny fonts, I (Pete) would love to make a Bear Serif and Bear Mono eventually. I’d also like to draw them from scratch… so maybe they will be ready for Bear 3. 😉