Atlas Design System Refresh
The U.S. News design system, Atlas, was launched in 2017. Since then, there have been several attempts to refresh it that were unsuccessful. I worked to acquire stakeholder buy-in from leadership team members to finally get this project off the ground. I also collaborated with our platform team and my design team members to develop a plan and timeline and begin the hard work of refreshing the entire design system organization and aesthetics.
Brief
Led a complete organization and aesthetic overhaul of Atlas, the U.S. News & World Report design system.
Challenges
Due to limited resources, the U.S. News design system had very few major updates over the years.
The design system is democratized, but teams committing new components rather than updating or deprecating old ones led to massive design system bloat.
Unchecked scaling had created major variations in the component aesthetics.
The organization was overall unhappy with the look and feel of the previous design system given how long it was in place without a holistic refresh.
Design system bloat and documentation gaps made it very difficult for new designers and front-end developers to learn the design system.
Solutions
Launched a major audit of the existing system, reorganizing our components into functional groups (moving away from atomic system) to allow for greater learnability outside of the UX team. In addition, I scoped out potential areas where component functions can be merged to streamline the system.
Collaborated with a team of development heads to explore other design system frameworks. Eventually settled on Google's Material.
Created a theme for the design system in Figma using Material's variable structure. Used this as the foundation library and began bringing Material components into the new organization.
Refreshed design and developer documentation and began retraining designers and developers in typography, color palettes, border and shape styles, spacing, and processes.
Used the first set of refreshed components to redesign the U.S. News homepage.
Created workflows and a project tracker for the task of merging old components into fewer, more flexible ones.
Hosted multiple sessions for leadership and general staff to keep them apprised of the redesign's status and make them aware of how it will affect their work.
Delegated individual component redesigns to my team members.
Project Gallery
