Creating a Design System for India's largest grocery delivery app.

Overview

Design system for India's largest grocery delivery app, building shared standards across a sprawling e-commerce product.

Company
BigBasket
Focus area
Design System Foundations, Components, Documentation, Cross-Platform Patterns
The visual audit exposed duplicated patterns, inconsistent screens, and design debt across the app.
Color tokens from real screens.
A consistent, reusable type scale.
Elevation rules for every surface.
Spacing tokens for scalable layouts.
A unified system-icon library gave every product surface one consistent visual language.
Button variations and interaction states.
Semantic color tokens for ratings and status feedback.
One semantic palette across customer and assistant messages.
Special-offer card variants adapted one shared structure across timed, exclusive, seasonal, and unlocked promotions.
Native iOS and Android behavior, unified through Melon's typography and iconography.
A watermelon analogy made Atomic Design tangible: atoms became components, patterns, templates, and screens.
The Melon story deck I presented 20+ times to explain the system and earn organization-wide buy-in.
The shared component library used to create high-fidelity designs.
A repeatable template for component anatomy, usage, and behavior.
A clickable prototype connected every level of the system.
Guidance lived beside the components, so standards stayed easy to find and use.
End-to-end return, exchange, and cancellation flows tested the system against real customer journeys.
The same visual language carried into team onboarding and recruitment materials.
Impact

Adopted by 200+ product and engineering team members, improving design-to-dev handoff efficiency by ~35% across 250+ audited components.

© 2026 Mayank Kinger

↗ VIEW CASE