Maybe you’ve already met? It’s the font that’s used in wireframes made with all versions of Balsamiq Mockups since version 2.1. We’re now making the font free for you to use outside of Mockups as well!
The fonts we previously used in Mockups (Chalkboard for Mac, Comic Sans for Windows) were problematic for us from a technical standpoint (see the font faq for more info), and for our customers when it came time to do design reviews. It’s hard to take Comic Sans seriously, although, for a lot of people, that’s the point of using it. So Mike started a coffee-fueled journey into a space we’ve never gone before, creating a handwritten font. It was exciting and fun, and got Mockups out of Comic Sans land. You can preview the 942 glyphs in the font in our glyph viewer.
The main thing we wanted to do was create a font we could embed that had a hand-drawn look, but was cleaner, and less distracting compared to a comic font. Now we’re making the font available for free for anyone to use on their desktop or in web and software applications, as long as it is not in a tool that competes with Balsamiq’s.
We thought it would be fun to tell you how we made the font, in case anyone wanted to go out and make their own. So here’s the process Mike, the hand of Balsamiq Sans, undertook to make it happen. If you haven’t used Mockups before, you can try the web demo to see the font in action.
While the comic typeface made the point of low-fidelity unmistakable, we know that using it comes with a stigma akin to wearing socks under flip flops to a meeting with the Queen of England, and we didn’t want to impose that on our friends. So I began practicing my lettering, which is actually pretty neat to begin with. Then I started looking for a tool that would allow me to draw the glyphs cleanly, while still retaining some of that hand-drawn feeling.
I found two tools that helped make the process easy. I began by drawing each of the glyphs in both regular and bold weights using iFontMaker for iPad, a really easy to use app with editing tools and guides for drawing letter forms. This was the longest part of the process, and took several months. I was also doing a lot of testing of iPad styli at the time, and settled on using the Griffin Stylus, which is still my favorite sketching tool for the iPad.
After all the glyphs were drawn, I converted the TTF files for editing in FontLab’s TypeTool, another tool for modest font editing. We did a lot of tweaking of the diacritics and normalizing of line weights as a first pass, generated the oblique versions in TypeTool and exported as TTF fonts. We embedded them into all of our versions of Mockups and began testing with users, and adding more characters.
The font that we use today contains 942 glyphs in 2 weights with italics/obliques, and includes the basic and extended latin character set, Cyrillic, Basic Symbols and Dingbats, Math and Technical Symbols, and punctuation. You can preview the set we ship in our glyph viewer. Hat tip to Jason Cohen and Alexis Ohanian who helped us name the font as a fun riff on Comic Sans during the Business of Software 2011. :)
I hope you enjoy using it, it was fun making each glyph. We’re happy to provide it free of charge.
Hand-drawing the Balsamiq Sans font on iFontMaker for iPad
Wouldn’t it be funny if Balsamiq Sans became THE NEXT overused hand-written font that designers like to hate?
Help us get there by using our font in the most ridiculous places! Use it for your pizza shop sign, for your life’s will, or your wedding invitations!
Oh, and when you do, don’t forget to tell us about it. We’ll highlight you on this page. Email us and let us know! We can’t wait to showcase your sense of humor. :)