Design System and Qt components by Ergosign for BSH

Increased efficiency and brand consistency with the design system from Ergosign

Bosch Siemens Hausgeräte GmbH (BSH) unites globally recognized brands such as Bosch, Siemens, Gaggenau and NEFF in the household appliance market. BSH was faced with the challenge of increasing the efficiency of product development in the area of graphical user interfaces and creating synergies between the brands. Ergosign was commissioned to set up, establish and further develop brand-specific design systems that combine design assets and Qt development through integrated components.

Concept
Organizational Design
Design System
Design Token
Qt Development

BriefCross-functional and agile to the goal

Bringing all stakeholders to the table at the beginning and jointly collecting and prioritizing the requirements and goals is essential for a successful project. Ergosign initiated a comprehensive analysis phase to help understand how design and development interact at BSH. The first step was to develop a design system for the Bosch brand. Ergosign was asked to convert the existing design into consistent Figma components to avoid redundant code development. This provides the internal design and development teams with a toolbox with which graphical user interfaces can be designed in a consistent and user-orientated way.

BSH provided the cross-functional team from the entire organization - with the skills required to fulfill the order. Ergosign's switch to agile working methods encouraged collaboration and made it possible to improve existing processes.

ApproachDesign tokens for flexibility and scalability

The main challenge for the BSH design system was to create a flexible system that could cope with the variety of brands, products and hardware configurations to be supported without restricting brand identity and design freedom.

The central component of the BSH design system is a flexible token system. The tokens enable simple switching of color worlds and display sizes, both in Figma and in the Qt source code of the design system.

User interfaces that use the design system can thus be designed quickly and easily in Figma for the corresponding combination of brand, product, display size and hardware configuration. By providing the corresponding Qt components, the interdisciplinary handover effort between design and development can be made much more efficient and robust with a modern release concept across the entire BSH product development cycle. These releases are optimized and tested for the respective hardware right from the start. This improves the quality of the end product and makes a significant contribution to reducing development costs. Parallel release management, which combines design and development components, ensures the standardized use of the design system in all products.

OutcomeImproved design and development processes

The establishment of the BSH design system was accompanied by changes at all levels, with the main focus on increasing efficiency and quality in design and development. The central provision of components that fulfill all requirements for the end product avoids redundant development work.

The integration of the design system into BSH enables more efficient utilization of design and development budgets: resources for product-relevant and future-oriented decisions can be better planned and used in a targeted manner. This results in increased design and development maturity and enables the scalable design of graphical user interfaces on the products.

Bosch has taken on a pioneering role here. Another brand, Siemens, has already been integrated into the system. Other brands are currently planning to be integrated into the design system with additional embedded technology. Ergosign has enabled BSH to further develop the design system independently, paving the way for the next generation of BSH products.

More about Qt for MCU
Viele verschiedene Anzeigeoptionen des Ring UI, wie Temperatur, Dauer, Off.

Quelle: Bosch User Interface Generation Digital Ring | Robert Bosch Hausgeräte GmbH, Bosch Design

The Bosch Ring UI is the flagship of the current generation of Bosch appliances. With the "Digital Ring", Bosch has succeeded in creating an unmistakable user interface that serves as a recognizable brand element for all household appliances.

Das Ring UI mit der Temperaturanzeige und Dauer.
Viele verschiedene Anzeigeoptionen des Ring UI, wie Temperatur, Dauer, Off.
Screenshot aus dem Design System mit der Skalierung für das Zieldisplay.
Screenshot aus dem Design System mit dem Theming für unterschiedliche Anwendungen.

About the clientBSH Hausgeräte GmbH

BSH Hausgeräte GmbH (BSH) is a leading global manufacturer of household appliances with brands such as Bosch, Siemens and NEFF. The company is committed to providing high-quality products for everyday use. With over 60,000 employees worldwide, BSH focuses on developing innovative solutions for everyday life. Its appliances are used in millions of households and help to make people's lives more convenient and efficient. BSH endeavors to continuously improve the quality and user-friendliness of its products while offering sustainable solutions.

More Case Studies