Development of a comprehensive website and font testing platform for Kimera, a Munich-based type foundry requiring effective showcase capabilities for their typeface collection and design portfolio. The platform features an in-browser font testing tool with OpenType features and glyph explorer. Node.js scripts were implemented to streamline font file processing and preparation for web use and distribution, while smooth page transitions with intelligent preloading enhance user experience through a flexible design system accommodating both portfolio and typography presentation needs.
Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Website development for a Munich-based type foundry. The project involved creating a comprehensive website and font testing platform that effectively showcases their typeface collection and design portfolio.

Details

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Mobile version of the home page.

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Mobile version of a type page.

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Custom type tests are preserved across sessions via Vuex.

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Glyph explorer! Glyphs and font meta data are set up in Storyblok CMS.

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

The website features a wide variety of Lottie based and FLIP based animations.

Video ready
Keyboard shortcuts: Space or K to play/pause, Arrow keys to seek and adjust volume, M to mute, F for fullscreen

Portfolio pages are modular and can be customized.

design & art direction:

  • Michael Clasen

development & UI/UX:

  • Artur Neufeld

Technologies used:

Nuxt 2, Vuex, SSR, Storyblok CMS, GSAP, Lottie, Node.js, Netlify