Creating a harmonized design system solution for all
With 120 production plants in 29 countries, the Volkswagen Group is one of the world’s leading automobile manufacturers and the largest carmaker in Europe. Headquartered in Wolfsburg, Germany, the Group is made up of 10 individual brands: Volkswagen, Volkswagen Commercial Vehicles, ŠKODA, SEAT, CUPRA, Audi, Lamborghini, Bentley, Porsche, and Ducati.
Today, the organization’s main business goal is to make mobility sustainable for future generations. And it’s striving to do this in two ways. One, by combining electric drive, digital networking, and autonomous driving to make mobility cleaner, quieter, safer, and more intelligent. And two, by creating emotional appeal for their new driving experience. In pairing these two initiatives, the Volkswagen Group believes the car will continue to be a cornerstone of contemporary, individual, and affordable mobility.
Recognizing the need for a strong brand that could sustain this forward-thinking approach to mobility, the Group joined forces with the Frontify family at the end of 2021. The goal was to consolidate, scale, and future-proof Volkswagen's global Design System.
We recently caught up with Thorsten Jankowski, Design & User Experience Strategist and UX Lead Group IT at Volkswagen AG, and asked him about his thoughts on VW’s brand today, VW’s ongoing collaboration with Frontify, and how he sees us working together in the future. Check out the Q&A below.
Frontify: What parts of the Volkswagen Group brand are you most proud of from a UX perspective?
Thorsten: Our design system is built on a strong cross-functional approach – where digital design is a holistic discipline – and so is our collaboration between the corporate design and design system teams. Our corporate design has developed from the implementation in real software products. The goal is, of course, to holistically implement corporate design across our entire application portfolio. A decisive factor here is the transfer of a broad knowledge base, which we cover with Frontify.
Can you tell us more about the multi-brand approach and the role it plays in your daily work?
Our team and our product only play a small (but important) role in the large brand landscape of the Volkswagen Group. But we know we deliver a good product, and we work hard to attract new people and new brands to join our vision of creating a central multi-brand framework for web-based applications across the Group.
How do Volkswagen Group´s brands interact and learn from one another?
Besides the actual product development, this is actually one of my main tasks – to work with our talented and competent design and frontend community stakeholders from the individual brands – to achieve a common and harmonized solution for all.
How did the brand get to where it is today, and what have been the main learnings for you, especially from a digital point of view?
We started this process in 2015 with the creation of a sketch-based design system for all Volkswagen Group applications. In 2016, we started with technical components that today led us to a fullstack design system from documentation (in Frontify) to design (perspectively in Figma) to code (web components created with StencilJS).
The most important realization we made was the need to focus on the quality and consistency of the design on the one hand, and broad communication on the other. No design system can exist without the acceptance of its users, designers, and developers. And another learning was that we needed to keep it flexible and open for contributions. Today, our design system, GroupUI, follows an “in-house open source” approach, which means it can constantly evolve and adapt to its environment.
For you, what have been the major milestones for the Volkswagen Group along this brand journey?
One of the key milestones for us was building our design system with an internal product team that was allocated and responsible for delivering a growing and consistent product. As design systems are never really finished, this consistency is crucial. By providing consistency, we have been able to see a growing number of teams using our design and code and working with us on developing new components and variants across the markets.
What milestones are you most proud of, and which ones are you most looking forward to in the future?
When we decided to go public, it had a massive push on our activities, as we were able to communicate to any team designing and developing an application for the Volkswagen Group. In the future, the most important milestone will be to have a consistent and integrated platform built on Frontify, Figma, and GitHub to establish a real single source of truth for all our target groups.
What have been the main challenges for you around brand consistency and brand engagement across Volkswagen Group’s multi-brand landscape?
The biggest challenge for a multi-brand frontend framework like ours is to implement the right flexibility and freedom while establishing the most efficient and effective processes of collaboration and contribution between the brands and our team. As you might know, our design is monobrand across the Volkswagen Group but the code is multi-brand for all of the Group’s iconic brands. So, we all need to agree on the tools, semantics, naming, and development principles first. Only then can we achieve the greatest possible synergies and leverage them sustainably.
Since implementing Frontify, what changes have you experienced?
We have gained high acceptance among our target groups because we can easily communicate consistency and scalability. Frontify supports the “always-beta” approach perfectly because it helps us to scale and revise certain elements of our design policy almost daily.
Do you have any nice anecdotes you’d want to share around our collaboration since we first connected over two years ago?
Not really; ask me again once we’ve met with the 100+ teams using our design system. That’s the ultimate goal moving forward – to have everyone using and contributing to the design system and future-proofing the way we work as a group across all the brands. Collaboration is key for all aspects of design, from ideation to implementation, regardless of brand or touchpoint.
Finally, if you had to summarize our collaboration, what would you say?
What I really love about working with Frontify is the close collaboration with all your stakeholders. I see a super motivated and pragmatic team that is always open for discussions on how to make Frontify even better and how to implement new features for its customers. We also love that you are curious about our feedback and new ideas for new content blocks, like our code showcase component that integrates seamlessly with the Frontify GUI. Let’s keep these close discussions going!
We’re excited to work closely with the Volkswagen Group, assist them in centralizing their design system, and support them in their quest to reach their ultimate goal of creating their one source of truth across teams, brands, and touchpoints. This collaboration will continue to grow to ensure we leverage the complete potential of their design system and, in the process, strengthen our relationship for years to come.
