Building a Scalable Design System for Heliyatra’s Multi-State Expansion
Due to a non-disclosure agreement, some confidential information has been omitted.
Background
Heliyatra is IRCTC’s official helicopter booking platform for pilgrimages to destinations like Kedarnath and Hemkund Sahib. As the sole booking provider for these tours, the platform is a popular and trusted choice for thousands of travelers.
IRCTC was now looking to expand this offering to other states, adding more destinations and increasing tourist accessibility. This required a major overhaul of the platform to make it scalable, flexible, and modular.
My Role
I led the design efforts for this redesign project, working with
1 additional designer
2 front-end developers
1 product manager
This case study comprises why and how we worked on the design system to create a scalable design of the product.
Approach
Audit and Prioritization
We began with a platform audit to identify pain points and improvement areas. With a tight deadline, we prioritized features and design needs accordingly.
Modular Design Thinking
We adopted a modular design approach, enabling the system to scale with new offerings without fragmenting the UI/UX.
Bringing Principles of Atomic Design
I worked closely with the dev team to:
Understand existing design tokens already being used
Identify mismatches between design and implementation
Clarify component states that were confusing or undocumented
Instead of starting from scratch, we reverse-engineered what was in development and brought it into design, then iterated with clear documentation — ensuring smoother handoff and understanding.
Designers & Developers using the same language
A screenshot from a presentations that I did for design system
What Needed Fixing
Design tokens were inconsistent or unused
Developers had difficulty identifying design changes or component states
The design files lacked a single source of truth and structure
Modular Design Thinking
We adopted a modular design approach, enabling the system to scale with new offerings without fragmenting the UI/UX.
Outcome: The Design System
We built a clean, scalable design system with:
A clear set of design tokens and naming conventions
A well-organized Figma file structure for easier collaboration and onboarding
Reusable components with well-defined states
A governance model to keep the system maintainable long-term
Examples of atoms we created
Molecules
Design Principle of Simple, Easy, Authentic
I love setting design principles for any project, this project's principle was not only for the end users but rather the development team as well (The Figma File users),
Simple, easy to use/navigate, authentic
