Zataak Se

Three separate product surfaces - a consumer app, a merchant app, and an operations/delivery app - were being built in parallel with no shared design language. During UAT, inconsistencies kept surfacing: components looked different across apps, developers were rebuilding the same UI elements from scratch for each surface, and bugs were slipping through because there was no single source of truth. On top of that, payment reconciliation was a fully manual process costing hours every day.

There was serious pressure to keep shipping features - timelines were tight and stakeholder expectations were high. But I kept seeing the same problem repeat in UAT: inconsistencies that ate up developer time and pushed back releases. I made the call to pause feature work briefly and build a proper design system - but with a deliberate split. The consumer app needed its own polished, user-facing system since it was the product end-users would judge us on. The merchant and operations apps shared a common component library, since they had overlapping use cases and the same dev team. That two-tier approach meant developers could reuse components across the back-end apps and focus their energy on features and APIs instead of recreating UI.

A unified design system with two tiers: a consumer-facing system for the customer app and a shared operational system covering merchant and delivery surfaces. Wrote PRDs for the payments flow and geo-fencing features. Partnered with engineers on Kafka integration and Google Maps API implementation for real-time delivery tracking. Also drove an AI automation layer that eliminated manual payment reconciliation.

20% increase in user engagement within 3 months. 80% reduction in manual payment reconciliation through AI automation. 30% fewer UI inconsistencies across the product suite. Developer velocity improved significantly once the design system removed the rebuild cycle.

Design system built in Figma with two tracks: consumer (polished, brand-forward) and operational (functional, shared components). Tech stack involved Kafka for event streaming, Google Maps API and geo-fencing for delivery tracking, and a payments integration layer. The AI reconciliation tool was built on top of the existing payments data pipeline to auto-match transactions and flag exceptions.