Anna Schoderer & Maximilian Franzke

DB UX Design System – How we’ve open sourced our largest inner source project

How can one design system serve React, Angular, and Vue? See how Deutsche Bahn open-sourced its largest internal project to solve cross-framework compatibility.

DB UX Design System – How we’ve open sourced our largest inner source project
#1about 1 minute

Unifying Deutsche Bahn's digital landscape with a design system

Deutsche Bahn faces complexity from diverse applications, multiple frameworks, and non-functional requirements like accessibility across internal and external teams.

#2about 2 minutes

Why open source is the solution for collaboration and quality

Open source principles enable collaboration with external partners, improve component reusability, and serve as a quality gate for the entire system.

#3about 2 minutes

Fostering a supportive open source culture at Deutsche Bahn

The company supports open source through leadership backing, dedicated time for contributions, architecture guilds, and active internal developer communities.

#4about 1 minute

Moving the design system from inner source to open source

The DB UX design system was moved from a private inner source model to public open source to better include external partners and agencies.

#5about 2 minutes

The technical stack for a multi-framework component library

The system uses Sketch and Zeplin for design tokens via Style Dictionary and Mitosis to generate components for multiple frameworks like React and Angular.

#6about 1 minute

Establishing quality gates in the development process

A cross-functional process involves community, accessibility, and brand teams, using pre-releases, Playwright for visual regression testing, and GitHub Actions.

#7about 2 minutes

Managing community feedback and contributions

Feedback is gathered from a large internal web development community via MS Teams before being migrated to public GitHub issues for transparency.

#8about 3 minutes

Q&A: The decision to move away from Storybook

While previously used with Stencil.js, the team is not currently using Storybook due to challenges with their Mitosis-based mono-repo and documentation integration.

Related jobs
Jobs that call for the skills explored in this talk.

Featured Partners

Related Videos

See all videos
Bridging the Gap06:16

Bridging the Gap

Philipp Kremer

Breaking Down Silos Between Design and Development 54:22

Breaking Down Silos Between Design and Development

Erica Rider & Stan Carrico

UX is a fullstack job!27:01

UX is a fullstack job!

Marcel Bagemihl & Miriam Becker

Unlocking Seamless Collaboration: Design-First APIs for UI Components28:35

Unlocking Seamless Collaboration: Design-First APIs for UI Components

Lucien Immink

Bridging the gap between design and development29:53

Bridging the gap between design and development

Jade Jiang & Noga Mann

Design Systems and how to develop consistent and scalable products with them32:21

Design Systems and how to develop consistent and scalable products with them

Michael Siregar

Design as an algorithm, not as a feature39:27

Design as an algorithm, not as a feature

Kaya Sohyun Kim

Empowering Thousands of Developers: Our Journey to an Internal Developer Platform29:26

Empowering Thousands of Developers: Our Journey to an Internal Developer Platform

Bastian Heilemann & Bruno Margula

From learning to earning

Jobs that call for the skills explored in this talk.

Rust and GoLang

Rust and GoLang

NHe4a GmbH
Karlsruhe, Germany

Remote
€55-65K
Intermediate
Senior
Go
Rust