Emerson Design System
A Design System for Industrial Products
- Design System,
- UX Design,
- Accessibility,
- Foundation
About the project
When Emerson set out to create a more unified and efficient user experience across its software products, we worked together to build a design system that brings everything together — from visual guidelines to fully functional components. The goal was to establish a shared foundation that unites design, technology, and accessibility, making it easier for global teams to work consistently over time.
A Shared Foundation for the Entire Product Portfolio
When the collaboration began, Emerson faced a familiar but complex challenge: each software team worked in its own way, using different codebases, interaction patterns, and visual expressions. Similar functionality was built multiple times, in multiple ways. What was missing was a shared foundation that could provide better structure and a more consistent user experience across the product portfolio. With a shared design system, a distributed product family can be transformed into a cohesive digital experience. Users recognize familiar patterns and behaviors, making new products feel familiar from the start. What was needed was not just new components, but a clear structure for how Emerson’s digital interfaces should be built, used, and evolved over time.
The design system is built in Figma and uses variables as the foundation for all core attributes — spacing, typography, colors, themes, and interaction styles. This provides a scalable and consistent structure that makes the system easy to evolve and ensures that design behaves consistently across products. The comprehensive component library supports both light and dark modes and can be adapted to different environments and use cases.
By working with variables, the connection between design and code becomes clearer: Figma serves as a source of truth, allowing development teams to translate design decisions into code in a fast and predictable way. All documentation is published in Supernova, making the system easy to learn, easy to use, and simple to keep up to date for teams around the world. This creates a living platform that enables design and development to work consistently and efficiently together.
Results — A Foundation That Grows with the Products
Idag är designsystemet grunden för de digitala produkter som utvecklas inom Rosemount Tank Radar AB och har redan använts för att effektivisera och höja kvaliteten i utvecklingen av flera mjukvaror. Det gör utvecklingen snabbare, kvaliteten jämnare – och produkterna enklare att förstå, använda och lita på.
words from the team
❝ Genom ett skalbart och modulärt designsystem skapades tidigt en gemensam grund för både design och utveckling. Systemet är flexibelt och binder samman Emersons varumärke över produkter, plattformar och team, samtidigt som det fungerar som en katalysator genom hela produktprocessen. Resultatet är högre kvalitet, snabbare iterationer och ett mer effektivt samarbete från start till slut.
Do you like what we do?
Don't hesitate to share your next idea with us. We'd love to learn more about you and what we can create together.
