From fragmentation to scale: Building FYERS' first scalable design system
How I identified a scaling problem, built the system to solve it, and reduced design-to-development effort by ~66% while driving 90%+ adoption across teams.
Role & Ownership
DS architecture
Design tokens
Component library
Accessibility
Documentation
Dev collaboration
Implementation
Component reviews
Team
4 designers
5 engineers
Timeline
Jun 2025 - Dec 2025
Impact at a glance
01
~66%
Reduction in design-to-dev effort
02
90%+
Adoption across ~8 product verticals
03
64+
Reusable components shipped
04
18+
Designers using FDSG daily
Rising Star award — organizational recognition of system-level impact.
PROBLEM
The challenge wasn't inconsistency.
It was coordination at scale.
As FYERS expanded across products and teams, maintaining consistency became harder.
With 50+ engineers and 15+ designers working across 8+ verticals, the lack of a shared foundation started to show in three ways
1. Consistency:
Similar experiences looked and behaved differently.
2. Collaboration:
Design and engineering spent too much time clarifying decisions.
3. Reuse:
Teams often solved the same problems independently instead of building on shared patterns.
FOUNDATION
Most design systems start with components.
I started with foundations.
The goal wasn't just to build a component library. It was to create shared rules, language, and patterns that teams could rely on everyday.
Foundations
Color system · Typography · Spacing · Accessibility · Platform conventions
Creates the
visual language
Tokens
3-layer model: primitive → semantic → component · Platforms & themes
Makes the system
scalable
Components & patterns
64+ reusable components ·
Interactions · Empty states · Documentations
Enables consistent
implementation
Products
Web · Mobile · Trading terminal · Research tools · Internal dashboards
Powers experience
across FYERS
