Harmonizing Website and App Styles for a Consistent User Experience

Wüstenrot Austria wanted to launch a new bank and selected us to deliver their new vision via an app that combines banking, insurance and home loans in one engaging ecosystem. We consolidated all their existing products in one brand, starting with a brand new design system. We then tackled, in record time, the whole product design for mobile, tablet and desktop.

Challenge:

Unified design system for a seamless user experience across all products

Outcome:

Consistent UX & efficient digital product management through design system

Results and value creation

Outcomes

Learnings

Developing a Comprehensive Design System for Efficient Digital Product Management

In order to effectively manage a digital product with a diverse range of products and services, it is crucial to develop a comprehensive design system. This system provides a framework that enables the easy implementation of future additions and changes, while still maintaining a cohesive and consistent user experience. By establishing clear structures and rules, designers and developers work according to a unified understanding of the brand identity and a product’s desired look and feel. A well-defined design system not only streamlines the design and development process but also ensures a seamless and harmonious user journey across various offerings.

Background and context

Intro

Initial situation and core problems

Challenge

Wüstenrot has a substantial array of products and services that are frequently characterized by varying UI and UX designs targeted at diverse audience segments. The challenge was, therefore, to deal with these different brand experiences and visual identities within the Wüstenrot world. It meant our primary objective was to seamlessly integrate the styles of their existing websites and applications and, thereby, forge a cohesive visual identity for this new digital ecosystem.

Approaches and realization

Solution

In Depth Design System to Differentiate Between Banking and Insurance

We started by crafting a style guide based on the Atomic Design system. To lay the foundations of the products, we worked on both branding and UI. As there is a lot of depth to the service portfolio, we invested a great deal of work on color coding, for example, leveraging a monochromatic palette per product category as a vehicle for orientating users. It was also important to highlight the differences between banking and insurance products.

Creating an age- and usecase-responsive design for different user profiles

Each user – from insurance contracts to bank products – has very specific needs, on top of having a different demographic and browsing habits. We designed a product that remains user friendly for accounts with dozens of contracts as well as profiles with a single service. We also realized a product that matches the age of the target group by adapting the color codes, visuals and copywriting tone. As Wüstenrot has a fun and friendly mascot, Sten, we tried to use it as much as possible to emotionalize the experience, tell stories and lighten up the product.

What other people say

Quotes

Nina Tamerl

Head of Innovation & Marketing

 /

Wüstenrot Austria

ENNOstudio implemented the UI design and style guide for our vision in just six months. They showed an incredible sense for user-centric flows and designs and adapted to our workflows extremely fast. Thanks to great collaboration, we managed to create a completely new type of banking/insurance app.

Growth, efficiency and innovation

Business benefits

Core statements and key findings

Management Summary

We'd love to hear from you

Our experts take a deep dive into your case to understand your requirements, assess your infrastructure alongside your IT team, and develop tailored solutions. With our knowledge and expertise, we enhance your team’s skill set - driving speed and efficiency. Ready to take it to the next level?

Contact us
A young woman taking part in a video call in a bright office