140 Brands, One System:
Our Secret Weapon
Responsive • News • Multimedia
INTRO
Our design system is a one-stop shop for consistent design across our 140 brands. By providing a library of reusable components and guidelines, the system simplifies our design workflow, allowing us to create cohesive experiences that enhance the overall user experience
MY ROLE
UX Lead
TEAM
UX Designers, UX Lead
PROJECT SCOPE
Always Ongoing
TOOLS
Figma
The Problem
Design systems are always a work in progress, and tools like Figma are constantly levelling up our design game. The aim is to keep our design system up to date with all the latest features and products we release as a team. We want our designers to focus on solving company problems while their designs reflect the awesome capabilities of Figma
The Structure
To ensure a design system's success, it's crucial to set it up properly from the start. In my opinion, the atomic design structure developed by Brad Frost is the way to go. This approach breaks down design components into smaller, reusable building blocks, allowing for greater flexibility and scalability in creating consistent and cohesive designs.
The Foundations
To ensure a design system's success, it's crucial to set it up properly from the start. In my opinion, the atomic design structure developed by Brad Frost is the way to go. This approach breaks down design components into smaller, reusable building blocks, allowing for greater flexibility and scalability in creating consistent and cohesive designs.
Interactive Components
We used Figma to create interactive components proved to be a game-changer in the design system project. With its robust prototyping capabilities, Figma allowed us to seamlessly transform static UI elements into dynamic and interactive experiences. By leveraging Figma's powerful features like component states, interactive overlays, and animations, we were able to bring our design system to life. This enabled us to showcase the behaviour and functionality of our components and gather valuable feedback from stakeholders.
