FOSS@Porsche
Porsche Design System
30th August 2023 · 5min reading time
The Porsche Design System provides all the fundamental UXI guidelines and pattern-based web components to build brand driven, consistent and intuitive designs for digital Porsche products. Marcel Bertram, Specialist Digital Marketing UI/UX at Porsche, explains why this project was published as an open-source project and what his team learned along this way.
Tell us a little more about yourself, your role at Porsche and what topics drive you.
Being part of the company for more than twelve years, I had the opportunity
to be part of the very first agile product teams at Porsche. During my
journey through various roles in marketing with a focus on digital products,
we started a strategy for pushing the practice of qualitative UX design with
the first shared service and inner-source system product: The digital
Porsche Design System. The main goals are to ensure an efficient but still
high-quality, brand-consistent implementation of our design language across
all our digital touchpoints.
You are currently maintaining Porsche's open-source project Porsche Design System on GitHub. How would you explain your project to a five-year-old? What problem does your project solve for Porsche?
The Porsche Design System is comparable to a Lego set that offers
ready-to-use building blocks (coded and designed components) and a clear
manual on how and where to use them. This set allows us to build
high-qualitative frontends, ranging from marketing pages to digital
applications. By supporting multiple popular frameworks such as React,
Angular and Vue, continuously testing for compatibility with a wide
range of browsers and creating a growing set of re-usable components, we
made a huge step ahead in the industry, which I am still proud of.
Our design system unlocks capacities among all Porsche design and
development teams that otherwise would have to reinvent the wheel by
adapting, implementing, and verifying the design guide on their own –
multiplied by all our available teams. We have an extremely high
standard regarding quality, performance, and aesthetics for our
products. The PDS standardizes our digital products and creates one
single system we can collectively optimize.
By publishing the Porsche Design System as an open-source project, you have made a big step ahead in our FOSS movement. What was your initial motivation to take this path? Can you tell us why you have chosen to release your project on GitHub?
There are several reasons why we agreed on open sourcing the Porsche
Design System. We wanted to drastically lower the barrier to access and
use our system and thus lift the adoption and engagement. The Porsche
Group encompasses many subsidiaries and has a broad partner network.
Instead of hiding our repositories on an on-premises platform, we made
it publicly available, allowing every single team, partner, and supplier
to access and use the PDS without any hassle. At the same time, we have
removed the complexity of having to worry about access and
authentication – saving us time and effort and lower the risk of
frustration with our consumers.
But this step was also a model of success from a not purely pragmatic
standpoint. We are already receiving the first code changes from individual
contributors outside of the Porsche Group. Bringing the Porsche brand to a
developer portal such as GitHub is a brilliant side-effect of this move.
Our fans and customers can directly connect with us, join a growing community,
and experience the Porsche brand in a totally new way. It is thrilling to see
how the number of stars on GitHub is growing and people really liking what we
are doing.
What did you learn along the way? What were the benefits of this strategy for you, your team and Porsche?
Publishing the Porsche Design System under a free and open license simplified a
lot of things for us. Not only did we reduce the complexity of access
management, as stated previously, but also communication is drastically
simplified. While questions and issues around the PDS have reached us through
various channels, everything can now be found on one single platform, allowing
others to search for already solved problems or give feedback on our components.
One thing we learned is the importance of automation and a high test-coverage
within our repositories. Ensuring both enabled us to reduce the time needed to
review and merge new pull requests. We are therefore looking forward to
receiving further contributions – both from inside and outside of the company!
Ultimately, coding and collaborating in the wild also proved that we are paying
more attention to ensuring compliance, quality, and security of our projects.
Transparency is thus not only a freedom, but also a precursor for advancing in
our field.
With a glimpse into the future: What are your further plans regarding FOSS Contributions? Who would you like to see next joining our FOSS Contributor community?
We already discussed the idea of generalizing the Porsche Design System.
Currently, PDS is limited to creating Porsche-branded applications. In
the spirit of FOSS, we would like to extend our design system to a
framework that can incorporate any arbitrary corporate identity. It
would be cool to see other brands facilitating, contributing and
collaborating based on our system.