


From scattered styles to structured systems
From scattered styles
to structured systems
From scattered styles to structured systems
Role
Design System Architect
Skills
Design Systems,
Design Documentation
Figma, Mockup
Type
Self-Initiated Internal Project,
Design System Foundation
Context
When I joined the Ask Smarty team, the application had been serving retail businesses successfully for several years. However, the product's design infrastructure had accumulated significant technical debt that was impacting our team's efficiency and the user experience.
The application had undergone three major design tool migrations—from Adobe Photoshop to Adobe XD, and finally to Figma. Each transition, while necessary for staying current with industry tools, resulted in lost components, missing documentation, and broken design patterns.
The inconsistencies weren't immediately obvious to end users, but they created friction throughout the development process. Different modules displayed varying button sizes, typography scales differed across features, and color usage lacked systematic logic.
When I joined the Ask Smarty team, the application had been serving retail businesses successfully for several years. However, the product's design infrastructure had accumulated significant technical debt that was impacting our team's efficiency and the user experience.
The application had undergone three major design tool migrations—from Adobe Photoshop to Adobe XD, and finally to Figma. Each transition, while necessary for staying current with industry tools, resulted in lost components, missing documentation, and broken design patterns.
The inconsistencies weren't immediately obvious to end users,
but they created friction throughout the development process. Different modules displayed varying button sizes, typography scales differed across features, and color usage lacked
systematic logic.
When I joined the Ask Smarty team, the application had been serving retail businesses successfully for several years. However, the product's design infrastructure had accumulated significant technical debt that was impacting our team's efficiency and the user experience.
The application had undergone three major design tool migrations—from Adobe Photoshop to Adobe XD, and finally to Figma. Each transition, while necessary for staying current with industry tools, resulted in lost components, missing documentation, and broken design patterns.
The inconsistencies weren't immediately obvious to end users,
but they created friction throughout the development process. Different modules displayed varying button sizes, typography scales differed across features, and color usage lacked
systematic logic.
Problem Statement
To build a scalable design system that:
Established consistency across the entire product
Streamlined collaboration between designers and developers
Reduced duplication of effort
Could evolve smoothly as new features were added
To build a scalable design system that:
Established consistency across the entire product
Streamlined collaboration between designers and developers
Reduced duplication of effort
Could evolve smoothly as new features were added
Solution