Design System
Overview
During my meetings with designers, managers, and developers, I identified a significant inconsistency across the teams. Following our initial discussions, I received the green light to spearhead a design system initiative. The only stipulation was that it needed to run concurrently with other projects to ensure our team’s existing roadmap remained on track.
My Role
In this project, I was responsible for establishing the design system team and collaborating with key stakeholders to identify overlapping design patterns. I built the Figma design system and facilitated seamless handoff to developers. I defined the design patterns for future projects and created a modular design system based on atomic design principles, ensuring easy integration into our design team’s existing workflows.
Audit Version
I began with a comprehensive audit, collecting all work from the past few years, including desktop, mobile, email, and widget designs presented to our users. I organized these designs into a single Figma file, categorizing each component into its appropriate section. This served as the interim version of the design system, providing a foundational update while the new style was being developed.
Updated Version
After completing the audit version, I focused on enhancing our design system to increase functionality, detail, and efficiency. I developed design guidelines and best practices based on extensive online research and collaborative working sessions. To improve accuracy for developers, I created Figma tokens that aligned with the design system. Additionally, I collaborated closely with developers to create a Storybook, providing them with clearer guidance throughout the development process.
In Conclusion
A design system serves as a valuable resource for both designers and developers. This project underscored the importance of thorough documentation and effective collaboration with various stakeholders. Additionally, the insights I gained in UI and visual design have significantly enriched my product design process.