It has been nearly a century since the Bauhaus school changed how we collectively think about art and architecture. It’s revered for its cool use of typography, geometric shapes, and simple yet impactful designs. While its brand of modernism is not new, some of the style’s key principles still feel impressively at home in the modern day. To celebrate Adobe’s Hidden Treasures campaign, where typographers revitalize and share traditional Bauhaus fonts with Creative Cloud members, we tasked talented UX designer Melanie Daveid to take one of those fonts and apply Bauhaus elements and principles to 21st century product design. This weekend, jump into Adobe XD with this UI kit to travel back in time and create your own digital Bauhaus masterpiece.
Melanie Daveid is a Berlin-based designer that lives not too far from Dessau, Germany, the birthplace of Bauhaus. She says the fusion of UX design and Bauhaus principles, found in her free MY500 UI Kit, have the power to create stunning and effective apps.
“Transferring the Bauhaus principles into a modern product design setting means to be brave enough to remove noise,” she said. “This could be visual details and fancy animations that don’t make sense and barely-used features. The Bauhaus principle ‘form follows function’ could be reinterpreted as ‘solution follows need’ in that case.”
You can download MY500 for free here, and keep reading to learn more about its multiple navigation patterns, tons of elements, and the inspiration behind its iconic design (featuring the Reross font).
The Bauhaus inspiration behind Melanie’s UI kit
The MY500 UI Kit is a modular system, like Adobe XD’s dozens of other free UI kits on offer, and comes complete with tons of UI elements you can use in your own prototypes. The ‘hidden treasure’ of the app, however, is its typography; the kit uses the Reross font originally conceptualized by Bauhaus master Reinhold Rossig and recreated by Elia Preuss. It is a quintessential Bauhaus element, and everything revolves around it.
“Bauhaus is the ultimate form of designing with focus; it’s thoughtful and uncompromising at the same time. That’s why the navigation concepts in MY500 are straightforward; they have a flat hierarchy. The content itself brings everything to life and smoothly wraps around the heavy font, Reross,” said Melanie.
Reross itself is a true testament to Bauhaus. Of all the student work produced in master teacher Joost Schmidt’s Bauhaus classes, Reinhold Rossig’s alphabet designs were closest to his teachings. The font consists of monolinear, geometric lettering, constructed on grids using compass and ruler.