NEW RELIC / ONE CORE DESIGN SYSTEM
One Core, New Relic’s Design System
One Core Design System is a transformative asset for New Relic
To ensure a cohesive user experience and visual design throughout our product, New Relic has a design system under the name of One Core. One Core represents and systematizes decisions taken by designers, engineers, and product managers around how New Relic should work. This system is the source of truth to standardize our design language and interaction patterns to be simple, familiar, consistent, and powerful.
With a unified visual language and a comprehensive collection of reusable components, our design system enables us to expedite the creation of high-quality interfaces, resulting in faster time-to-market for our products. Moreover, it ensures brand consistency, reinforcing our company's identity and strengthening customer trust.
A documentation site to protect and surface Design System’s resources, knowledge and guidelines
After conducting various surveys, we uncovered an alarming statistic that revealed 50% of our consumers faced challenges while searching for the information they needed in One Core documentation site, with one of the main issues being the structure of our documentation. To address this issue, we initiated a comprehensive redesign effort, focusing on enhancing the site's architecture and user experience. Through this redesign, we introduced several key improvements, including a powerful new search capability, a more intuitive architecture, and the implementation of a contextual index. These enhancements have resulted in a more streamlined and user-friendly documentation experience, ensuring that our consumers can now effortlessly find the valuable information they seek.
Creating a way for everyone to help improve the Design System
One Core is designed to evolve. To achieve this, we welcome contributions, including UX and design patterns. Designers and engineers being able to contribute to the design system is vital for creating, maintaining, and evolving a coherent visual language across New Relic. We created a contribution process for formal contributions such as new components, changing existing components in a meaningful way, or important refactors (design or engineering).
For any contribution to be included in the One Core, it must be compliant with straightforward acceptance criteria:
It is Product generic.
It is Product-wise impactful.
It is reusable for any team to build a product experience.
It does not break an existing pattern.
It does not deviate without justification from industry patterns.
Providing tools: Figma libraries carefully matching our SDK
At the core of our design system is our UI Kit, which leverages the power of Figma libraries to streamline our design process and ensure visual consistency throughout our products. Our UI Kit consists of several key libraries that facilitate the creation of engaging and consistent user interfaces:
Color library: A comprehensive repository of semantic tokens that forms the foundation of our product interfaces.
Typography library: Includes all the typography tokens used to design product interfaces.
Component library: The component library has all the latest, up-to-date components and is kept in sync with the SDK.
Patterns and Experiences library: Contains a collection of commonly used patterns in the product like the headings, navigation, collecting user feedback, and more.
A matured Design System to elevate our product
As we continue to evolve and grow, our design system remains a cornerstone in driving user-centric design, elevating our products, and ultimately contributing to the success and competitive advantage of New Relic.
As of today, One Core continues to help designers and developers by providing
A documentation site
A contribution model to assess and promote collaboration and contributions to the design system
An SDK playground and Figma UI kits and foundational styling
A help channel, weekly office hours, and formal design reviews to ensure all the initiatives have a shared and coherent visual language across New Relic.