is a blog about design, technology and culture written by Khoi Vinh, and has been more or less continuously published since December 2000 in New York City. Khoi is currently Principal Designer at Adobe, Design Chair at Wildcard and co-founder of Kidpost. Previously, Khoi was co-founder and CEO of Mixel (acquired by Etsy, Inc.), Design Director of The New York Times Online, and co-founder of the design studio Behavior, LLC. He is the author of “Ordering Disorder: Grid Principles for Web Design,” and was named one of Fast Company’s “fifty most influential designers in America.” Khoi lives in Crown Heights, Brooklyn with his wife and three children. Refer to the advertising and sponsorship page for inquiries.+
Type Sample is like Instapaper for web fonts, and it’s one of the handiest new design tools that I’ve added to my toolbox in the past year. It debuts to the public today.
Here’s how it works: a bookmarklet allows you to easily identify any web font you might come across during the course of your browsing. The bookmarklet creates a clipping of that web font—with your own text, even—and saves it to a hosted samples file under your own account at typesample.com. The interface looks like this:
The result is like a scrapbook of your favorite web type that you can call upon for later reference—incredibly useful for remembering great typefaces that, from one source or another at least, are available as web fonts. Here’s what my Type Sample page looks like:
The service is simple, efficient and narrowly focused, and as a result it does its job very well. Its creator is Justin Van Slembrouck, a friend and a designer who, appropriately, works on Instapaper and Digg. I was lucky enough to get access to Type Sample a few months ago as it was maturing into a real product very close to its launch form. As the release date neared, I asked Justin to do a brief interview to talk about how it came to be.
Where did this idea come from?
It started out as just a tool I built for myself. Beyond just trying to identify the name of a font and what foundry it’s from, I often found myself using “Inspect Element” to test out a given font in different sizes and even type in my own text. This happened often enough that I decided to figure out how to automate all those steps.
As a designer, was it hard for you to get it built, to bring this side project to life?
The hardest part was actually keeping it simple. I sort of figured out what Type Sample was through the act of building it. There have been many “cool” features (like a full WYSIWYG editor) that I’ve added and ended up tearing out along the way to keep it focused on identifying and sampling web fonts.
You have some coding ability I know, but did you deliberately set out to code it yourself?
It’s been a completely iterative process. I built the bookmarklet with my pretty limited coding skills by just hacking away. I ended up on Stack Overflow quite a bit during the process.
But I’ve had a lot of help too. After I had the bookmarklet working, a friend, Jake Levine, helped me put the initial Web app together. That was a cool moment because I saw that it had potential to be more than just an isolated tool. Then another friend, Paul Barnes-Hoggett, a really talented programmer, rewrote a lot of our code to make it more stable and easier to build on. Paul and I now have a long list of things to improve and add, especially on the data side.
Does that mean that you see Type Sample as a business, or is it a long-term passion project?
It’s been a hobby thus far, but the response from other designers who’ve been using Type Sample has been really positive and many of them have encouraged me to charge for it. For now, I’m hoping to cover the cost to keep the site running, but I can forsee it becoming a business down the line.+