Setting up and scaling a Design System across Freeletics products — from brand alignment to a shared component and asset library.
Problem: the brand refresh was messy — our challenge was to align Marketing and Product in one clear vision and make the change create less friction for the user. Solution: an approach that delivered the new branding while letting us improve and change the experience at scale through a Design System implemented across all platforms — Acropolis DS.
Fig. 01 — Acropolis DS, structured across Component Library, Exercise Assets Library, and Service Map.
The Acropolis DS mark comes from a piece of the company's logo that scales — bold, consistent, intuitive, memorable. Applying it in a grid became a way to show the value of consistency, inspiring the team to build creatively within the system.
Fig. 02 — Logo evolution and Design System principle posters.
We implemented a system that could adapt to users' preferences, increasing the feeling of personalization — built on a simplified color palette optimized to work in both light and dark mode.
Fig. 03 — System colours, built to work across light and dark mode.
Beyond light and dark, the color system was built to support entirely new themes — including a playful “Ancient Greek mode” exploration — without touching the underlying component logic.
Fig. 04 — Light, Dark, and an exploratory “Ancient Greek mode.”