The TNT design system is comprised of libraries of shared colors, styles, components, and corresponding documentation and principles. This project involved auditing that design system, migrating it to Figma, creating documentation, and keeping our components up to date in dev.

Design Systems

UI Design

TNT Design System

2018

Project brief

The TNT design system is comprised of libraries of shared colors, styles, components, and their corresponding documentation and principles. We originally created this design system leveraging Sketch Libraries + Abstract for consumption by designers and for design spec hando ff to developers. This project involved auditing that design system, migrating it to Figma, creating documentation, and keeping our components up to date in dev.

timeframe

16 weeks

industry

Agency

Findings

Moving our design libraries from Sketch+Abstract to Figma ended up turning into so much more than a simple change of design platforms and library migration. By challenging ourselves to rethink each principle and component of our design system, we ended up creating a much more robust product that could scale at the rate we needed. Making our documentation more visible and ensuring that it could stay up to date with ease was another major win for the team. Teams outside of development can now see the core of our applications, become engaged with the system, contribute, and make it better.

View Case Study