Zing

Design Systems, Product Development

Zing, based in Bangalore, is transforming workplace dining by offering authentic, customisable Indian meals that combine convenience with culinary richness. Through curated offerings from the city's top restaurants, Zing brings affordable luxury to professionals. Design and implement a scalable design system that brings visual and functional consistency across Zing’s Android app, web platform, and B2B applications. The system should support rapid development cycles and adapt to the distinct needs of both end consumers and enterprise users.

Brief:

Design and implement a scalable design system that brings visual and functional consistency across Zing’s Android app, web platform, and B2B applications. The system should support rapid development cycles and adapt to the distinct needs of both end consumers and enterprise users.

Roles:

User experience, UI and Visual, Prototyping, 
Game development & Packaging

Timeline:

6 months - Full Time

The Journey in a nutshell.

Challenge

The primary challenge was addressing long waiting times and limited physical space at high-traffic university cafeterias during rush hours. Secondary challenges included creating a seamless transition from web app to mobile app download, ensuring users could quickly access restaurant information and place orders efficiently, and overcoming user resistance to app adoption. Key pain points identified included navigation difficulties, slow loading times, lack of customisation options, inconsistent design, and limited third-party integrations.

Process

The design process began with identifying the target audience of college students aged 18-25 across major Indian cities. Five detailed personas were developed representing different student profiles from various academic backgrounds. The web app was designed with a minimal interface featuring no navigation bar, focusing on essential elements including homepage categories, restaurant listings, search functionality, and three key action buttons for recent orders, logout, and app download. User journey mapping was conducted to track the complete experience from QR code scanning to potential app download.

Methodology

The approach utilised user-centered design principles with extensive persona development and user journey mapping. A 5 Whys analysis was conducted to identify root causes of user adoption issues, examining factors from ordering process confusion to interface appeal. The methodology emphasised rapid prototyping and user testing to gather feedback on user experience, functionality, and performance. Backend architecture consideration ensured seamless integration between the web app, mobile app, and business management system.

Insights

Research revealed that college students value convenience and time-saving solutions but face barriers including unclear instructions, poor information organisation, inadequate marketing of app benefits, and unappealing user interfaces. The 5 Whys analysis uncovered that user resistance stemmed from confusion in the ordering process, lack of restaurant information accessibility, insufficient awareness of app benefits, and poor visual design. User testimonials emphasised the importance of efficiency, organisation, and technology integration in daily student life.

Outcome

The final Zing web app solution features a streamlined interface optimised for quick QR code access, displaying essential restaurant information including average "zing time" based on the last 5 orders and current offers. The app successfully bridges the gap between immediate ordering needs and comprehensive mobile app features. Recommended improvements include implementing a more intuitive interface, streamlining navigation, offering customisation options, improving performance speed and reliability, and providing real-time support. The solution addresses the core problem of cafeteria wait times while strategically driving mobile app adoption through a frictionless web experience.