Maruti Suzuki App
UX design, visual design, and component work on a large-scale automotive super app. Delivered as part of a multi-disciplinary team at frog, working on a product that consolidated vehicle management, accessories, services, and connectivity into a single experience.
A super app for an Indian automotive brand — intended to be the primary digital touchpoint between the vehicle, its owner, and the broader ecosystem of services, accessories, and connectivity features around it. The scope covered vehicle management, connected car features, an accessories store, and service booking.
I worked on this project at frog as a designer focused on the accessories experience. Product strategy and user research had been conducted by an external partner before I joined. My work was execution — UX design, visual design, and component-level thinking within a structured brief and an emerging design system.
I did not conduct user research, define product strategy, or set the direction for the broader app. Those decisions were upstream. I worked with what existed, contributed where I was asked, and tried to add clarity and craft at the execution layer.
What I worked on
Accessories UX
Led UX design for the accessories experience within a small pod.
- Wireframes for browsing, product detail, and purchase flows
- Interaction patterns for variant selection — especially color and configuration
- Focused on decision clarity in choice-heavy screens
- Reduced cognitive load across accessory selection flows
Pod Coordination
Coordinated UX output within the accessories team.
- Helped break down flows into structured wireframe deliverables
- Reviewed and aligned design output across the pod
- Ensured screen-level consistency across the accessories journey
- Facilitated handoff-ready documentation for the broader team
Visual Design System
Contributed to the early visual design system for the super app.
- Helped define reusable UI components: cards, selection controls, layout modules
- Translated visual direction into structured, scalable UI patterns
- Ensured visual consistency across multiple areas of the app
- Worked within and extended the emerging design language
Component Design
Designed individual UI components for high-variation scenarios.
- Product cards, variant selectors, and selection states
- Designed for clarity when options are numerous (accessory colors, trims)
- Maintained visual consistency with the broader system
- Iterated on interaction states: default, selected, disabled
Accessories flow — structure
The accessories experience covered three primary surfaces. Each screen had to balance discoverability with specificity — a wide catalogue that narrows to a single, configured choice.
Browse
Category navigation, filters, surface-level product cards. Primary challenge: reducing the visual noise of a large catalogue into something scannable.
Product Detail
Variant selection, configuration, compatibility. Primary challenge: making complex option sets feel manageable without hiding important information.
Purchase
Cart, confirmation, and fitment details. Primary challenge: maintaining confidence at the point of commitment — especially for high-value accessories.
Design focus areas
Decision clarity in variant-heavy flows
Accessories are choice-dense. A single product might have a dozen color options, multiple fitment variants, and compatibility constraints — all of which need to surface clearly without overwhelming the user. Most of the design work here wasn't about adding more information. It was about deciding what to show first, what to hide behind a tap, and how to signal that a choice has been made.
Component thinking before screen thinking
At frog, the approach was to define components before layouts. A well-defined product card or variant selector travels across many screens — browse, search, cart, recommendations. Getting those atoms right meant the screens that used them could be assembled quickly and confidently. This thinking shaped how I approached every new UI element in the project.
Working within a research-led brief
The product strategy and user research were provided by an external partner. My role was translating that foundation into design — not starting from scratch, but from structure. That constraint pushed me toward execution quality: if the what was defined, the work was making the how as clear, usable, and systematic as possible.
Component-level design
Product Card
Thumbnail · Name · Price · Quick-addDesigned for browse and search grids. Handles long names, sale states, and OEM badge variants.
Variant Selector
Color swatches · Trim options · State managementSelected, unselected, disabled, and out-of-stock states. Swatch sizing calibrated for touch.
Selection Summary
Chosen config · Edit trigger · Price updatePersistent confirmation of the user's current configuration before add-to-cart.
Fitment Indicator
Compatibility · Vehicle match · Warning statesInline component that surfaces compatibility status without interrupting the browse flow.
Layout Module
Grid · List · Featured rowFlexible container for accessories browsing. Adapts between dense grid and editorial list views.
CTA Block
Primary action · Secondary action · Disabled stateReusable action area used at the base of product detail and cart screens.
The app is now live
The product has since launched publicly on the Google Play Store.
View on Google Play →This project was completed at frog in 2024 and is covered by a non-disclosure agreement. Screens, flows, and client details cannot be shared publicly. What I can say is that the work was delivered as part of a larger engagement, went through multiple rounds of design review, and contributed to a design system that was handed off to the client's internal team.
The product had not been publicly released as of the time I left the project.
Want to see the actual screens?
The full case study — wireframes, UI screens, and flow documentation — is available on request. Send me an email and I'll share what I can under NDA.
Working within a structured, research-led brief taught me something I hadn't fully appreciated before: execution is its own kind of creative problem. When the what is defined, the work shifts entirely to the how — and that's where most design decisions actually live. Every component, every selection state, every piece of microcopy is a small judgment call about what matters and what doesn't. Getting that consistently right, across a large product surface, with a team — that's the craft.
