The Klim Type Foundry launched a completely redesigned site to put the designer at the heart of the type browsing, buying, and learning experience. An integral part of the redesign is Söhne, a collection of new typefaces described as “the memory of Akzidenz-Grotesk framed through the reality of Helvetica”.
Inspiration for the redesign came from mainly places, but primarily classic Swiss design principles as well as practitioners Josef Müller-Brockmann, Wim Crouwel, Romek Marber and Karl Gerstner.
Inspecting the browser console reveals an homage to Josef Müller-Brockmann’s book Grid Systems in Graphic Design. Ctrl+Alt+Shift+g displays the underlying grid of the site, and on type specimen pages you can toggle page colour by the icon in the navigation or with Ctrl+Alt+Shift+t. Experimenting with these commands results in recreating the book cover if you can find the right specimen and theme.
“Ahhh this JMB throwback theme + grid easter egg on the @klimtypefoundry Klim/Söhne website is awesome (as is the typeface)!”
— Thomas Lowry
Alongside the inspiration for the site, the redesign was further informed by extensive research into other type foundries as well as interviews with existing and potential customers. It also included usability testing of the old site and prototypes of initial concepts (in design software and code) to validate numerous design details and approaches. This research and testing helped to discover what challenges people face when licensing fonts and the expectations they have of a foundry site.
After a year of near constant design and development the new site showcases the breadth of Klim’s work in type design, but also the foundry’s gallery exhibitions, collaborations, publications, goods, photography, animations and videos that have been created to take type to wider audiences.
A personal highlight and somewhat hidden detail of the redesign is the random generation of type specimens. Each time a page loads a set of predefined rules for how typefaces should be presented is parsed over a corpus looking for words, sentences, and paragraphs to programatically display as unique specimens. The redesigned specimens encourage experimentation before purchasing; people can view OpenType features, change alignment, add columns, adjust line-height and letter-spacing with an interactive type tester, and review and test full character sets in the form of a glyph inspector was a ‘bézier view’.
Speaking of specimens, after much hard work it has been humbling to see the response and feedback from the design community.
“The Söhne type specimen from @klimtypefoundry is a delight. A masterclass in considered interaction design, usefulness, and inspiration.”
— Mark Boulton
The site’s writing sections have also been brought to the fore and extended. The blog aggregates and displays the word count for each category currently on the site. For example, there are 27,544 words about letters in the interview category and 25,386 words in the font information category. The in use section, which shows the extent of Klim typefaces ‘in the wild’, has an improved filter to allow design work to be reviewed by typeface, and by category, and retail font specimen pages also now display related in-use examples.
Finally, under the hood there is a statically-generated Gatsby Web App front-end and a GraphQL API back-end as well as a custom e-commerce experience that connects with Stripe for transactions, Django for managing fonts, orders, and upgrades, and Wagtail for content management.
Awards & Recognition
- Red Dot Award — Best of the Best: Website, Typography (2020)
- Certificate of Typographic Excellence from the Type Directors Club (2020)
- D&AD Shortlist: Digital Design, Digital Products (2020)
- Webby Award Nominee (2020)
It's Nice That, Communication Arts, Muzli By InVision, AIGA: Eye On Design, Creative Boom, AGI, The FWA, CSSDSGN, CSS Tricks, CSS Winner, CSS Boutique, Type Wolf, The Gallery, Httpster, The FWA, Awwwards, SiteInspire, North East, The Brand Identity, UI Jar, Mindsparkle Mag, Design Assembly, Crafted By Code
I currently lead a talented team of pragmatic problem solvers at Springload, an independent design and development agency. We’re a team of 70-ish (plus a dog or two) who work with clients like ACC, DIA, Klim Type Foundry, Museum of New Zealand Te Papa Tongarewa, and NZ On Air.
Previously I was Head of Design at Koordinates where I obsessed over contours, maps, and geospatial data from the likes of LINZ and Stats NZ. With the team in Wellington, Auckland, and Edinburgh, we helped people around the world “Discover Earth’s Data”, or more close to home, the Wellington Wind Zones (it’s called the ‘windy city’ for a reason).
Prior to Koordinates I was Creative Director at Xero where I led the design of xero.com, Xerocon, and all things brand. With a team spread around the world in New Zealand, Australia, England, and the United States, we helped convince hundreds of thousands of small businesses to “Try Xero for Free”.
Before all that, I designed skeuomorphic mobile and tablet applications for clients like The Economist, Al Jazeera, and American Express at Tigerspike in London. Even longer before that, I was creating sites for clothing made from merino sheep and interactives for museums with colossal squids while at Flightless in Wellington. Finally, right back at the beginning I ran a little design company, The D.A., while studying in Whanganui.
I have a Masters Degree in Computer Graphic Design from the Whanganui School of Design and the University of Waikato where I also gained a scholarship to study abroad as a visiting researcher at FH Oberösterreich in Austria and Nottingham University in England.
I still use capital letters and full stops.
- Springload, Creative Director (2017—Present)
- Koordinates, Head of Design (2015—2017)
- Xero, Creative Director (2012—2015)
- Tigerspike, Creative Director (2010—2012)
- Flightless, Designer / Front-end Developer (2007—2009)
- The D.A., Founder (2004—2007)
- Misc., Designer (2000—2004)
- Lighting Lab, Startup Mentor (2013—2014)
- BGI, Youth Mentor (2008—2009)
- Whanganui School of Design & Waikato University, Masters Degree (2001—2006)
- Nottingham University & FH Oberösterreich, Scholarship (2005—2006)
- Under The Hood, Design Assembly (2020)
- Pioneer, Creative Mornings (2017)
- Geospatial Design, Tech Week (2017)
- World of VexilLOLogy, Design Meetup (2015)
- Science of Design, Gather (2014)
- Buy Experiences Not Things, UX Design Day (2014)
- Design Decisions, Design Meetup (2012)
Interested in hearing a few words and seeing a few pictures. Get in touch.