One central change in Figma. Automatically updated and transferred directly into the CMS — including all defined effects on components, states, and output channels.
Five brands can look completely different while still being built on the same underlying system. New websites can be launched faster. Changes no longer need to be discussed and implemented hundreds of times. They are decided once, centrally, and rolled out everywhere in a controlled way.
Used consistently, a design system is therefore far more than a tool for visual consistency. It becomes the central control logic for digital platforms — and a powerful driver of speed, scalability, quality, and cost efficiency.
In this masterclass, we provide a comprehensive and accessible demonstration of the true potential of a consistently structured design system.
Even companies that already work with a design system usually leverage only a small part of its potential. Key relationships are often not addressed systematically, while inheritance mechanisms and automation are missing.
As a result, significant value remains untapped.
We show what design systems are truly capable of. Step by step, a fully integrated system emerges: from atoms, molecules, and organisms to their practical application within a digital platform.
“I’m a button — and I can trigger 450 different discussions.”
Everything that should remain identical is systematically connected. Differences are created intentionally through defined values — rather than uncontrolled copies, manual adjustments, and individual one-off solutions.
This results in:
• far less maintenance and coordination effort
• significantly greater consistency
• manageable technical complexity
• reliable quality and testability
• faster continuous development
• significantly lower operating and development costs
Using a real-world example, we demonstrate how brands with very different visual identities can be based on shared components, which properties are centrally shared, and which values are deliberately defined for each individual brand.
This makes it clear how functionality only needs to be developed and tested once, while each brand retains its own distinct visual identity. The company can control its digital platform down to the smallest detail while remaining flexible enough to respond to new requirements, websites, and brands.
“Figma-to-CMS Pipeline”?
The transition from design to technology is particularly exciting. Using our “Figma-to-CMS Pipeline,” we demonstrate how changes made in Figma can be transferred automatically into the CMS design system. We explain which information is transferred, how it is processed technically, and how design and development become part of one integrated process.
We demonstrate the technical implementation partly through general principles and partly using Neos CMS as a practical example. However, the principles, ideas, and tools presented are relevant regardless of the CMS being used. They can also be applied to TYPO3 and other modern content management systems.
At the heart of the masterclass is one fundamental question: How should a design system be structured so that a company can continuously develop its digital platforms in a manageable, scalable, and cost-effective way?
The masterclass is led by Sven Ditz, Managing Director of sitegeist, and Martin Ficzel, Neos core developer at sitegeist. Alongside insights, inspiration, and practical examples, the instructors will also dedicate time at the end to individual questions, discussions, and conversations about participants’ own design system challenges.
Anyone managing multiple websites, platforms, or brands who wants to do more than simply document their design system — and instead use it as a truly systematic foundation — should not miss this masterclass.