I Increased
Efficiency by
40% with A
New Design System!
Project Summary:
I helped reduce design redundancy by 60% and increased team efficiency by 40% by creating a new Design System for *Company B.
The team and I did this by establishing a modular and scalable structure for the design system, creating a comprehensive library of reusable UI components with clear documentation and usage guidelines. We also implemented standardized design tokens for consistency across all elements.
0
%
0
%
Outcome Statement
The new design system boosted efficiency and consistency in both design and development workflows, fostering heightened satisfaction and productivity among designers and developers.
Collaboration between designers and developers enhanced by 40%, accelerating product iterations. Ultimately, this project was a smart long-term investment in the company, products, services, brand standards, and clients.
We invested the resources and time into this big project because as *Company B’s team grew and their app became more complex, challenges like maintaining consistency across the application, team alignment, and timing on delivery became a problem.
Through collaborative workshops, we worked with project stakeholders and the Product and Development teams to empower them to conquer this important project.
My Role in the Project
As the Team Lead on this project, I collaborated closely with the CEO, Product Manager, Lead Software Engineer, and Business & Development Manager to understand the business objective goals for the project and create an iterative process within the design team.
We each had specific responsibilities. My job upfront was to understand the business objective goals, get to know the current design system really well, and make sure that our new design system proposal aligned with the business goals. Once that was set, I focused my efforts on conducting UX/UI audits of the application and its current design system, as well as developed new components for the updated components library.
Constraints, Processes & Activities
Phase 1.
We began the project by conducting a comprehensive UX/UI audit of the current application and analyzing the application with key metrics such as: consistency, components used, quality of error messaging and user feedback, and overall user experience.
In addition, we conducted interviews with designers, developers, and stakeholders to grasp their needs and pain points, while studying industry-leading design systems for valuable insights and best practices.
Phase 2.
Once the project KPIs and goals were set, the team participated in facilitated brainstorming sessions with the UX Manager to spark innovative ideas for new components, patterns, and guidelines, while also assessing the effectiveness of existing UI components through a thorough inventory and evaluation process.
In addition, I crafted comprehensive personas representing diverse user types, including designers, developers, and end-users, to inform and drive the development of the design system, while also constructing scenarios to deeply understand user interactions and optimize the system’s usability and effectiveness.
Phase 3.
After that, the team and I worked together to establish a modular and scalable structure for the design system, creating a comprehensive library of reusable UI components with clear documentation and usage guidelines, and implemented standardized design tokens for consistency across all elements.
The redesigned design system offered a comprehensive set of UI components, patterns, and guidelines covering all aspects of the application, documented in an accessible format with implementation examples and best practices.
