top of page
UX CASE STUDY
Billing App for a Super-Market
QG 12.png
Project Type
Mobile App Design
Design Challenge
Role
UX Designer
Timeline
7 Days
January 2023
Tool
Figma
Marvel App
OVERVIEW

Background

Quick Grab is an online billing app designed to enhance the shopping experience by allowing customers to avoid long queues at the billing counter of a supermarket.

 

This project was part of a design challenge where I had the opportunity to work on an engaging design solution aimed at streamlining the billing and payment process in a bustling supermarket environment. The primary goal was to find an innovative and user-friendly design approach that would reduce the challenges typically associated with managing payments at the checkout counter.

We've all encountered that frustrating situation – rushing to a supermarket for a quick purchase, only to find ourselves trapped in an endless queue at the billing counter. Quick Grab, a fictional supermarket situated in a densely populated area, welcomes hundreds of customers daily who face this exact problem. The Quick Grab mobile app provides a seamless solution by enabling customers to swiftly scan their selected items through the app and conveniently make their payments online.

RESEARCH

Interview and Questionnaire

To understand the needs and pain points of customers, I conducted user research through interviews, surveys, and observations. The research revealed that long waiting times at the billing counter were a significant inconvenience for shoppers. Customers expressed a desire for a convenient and efficient way to complete their purchases. Additionally, I also gathered insights from a nearby supermarket staff to understand the challenges they faced during peak hours.

Based on the research, the following data points were gathered:

Frame 1.png

These data points helped shape the design and development of the Quick Grab app, ensuring that it addressed the specific needs and pain points identified during the research phase.

User Journey Map

Based on the research findings, a user journey map was created to visualize the entire shopping experience and identify key touchpoints where the app could be integrated.

Desktop - 3.png

Design Question

I formulated the following design question/problem statement based on the research and the user journey map:

I formulated the following design question/problem statement based on the research and the user journey map:

"How might we provide a seamless and efficient self-billing experience for supermarket customers, allowing them to avoid long queues at the billing counter and make online payments?"

DESIGN PROCESS

Ideation

I brainstormed ideas and potential solutions to address the problem statement. I considered features such as product scanning, real-time cart updates, and payment integration. This was done through individual brainstorming sessions where I explored various possibilities and innovative ways to enhance the self-billing experience for supermarket customers. I also researched industry best practices and gathered inspiration from successful mobile apps in the retail and payment sectors. By combining my creative thinking and knowledge of user needs, I generated a range of ideas to drive the design of the Quick Grab app.

Information Architecture

The app's information architecture was designed to ensure easy navigation and access to relevant features. It included sections for product categories, cart management, payment options, an online store etc.

Desktop - 5.png

Wireframes

Wireframing is one of my favourite aspects of the design process because it allows me to indulge in sketching, which is an activity I thoroughly enjoy. Personally, I have a preference for paper wireframes over their digital counterparts. I find paper wireframes to be not only easy to create but also cost-effective and quick to develop. And, needless to say, they bring a sense of joy and fun to the design process!

20230206_124817.jpg

Lo-Fi Prototype and Usability Test

Additionally, I utilized the Marvel app to construct a lo-fi prototype for the Quick Grab app. Subsequently, I conducted thorough usability testing sessions with a diverse group of users, allowing me to gather valuable feedback on the prototype's functionality, user experience, and overall effectiveness.

Quick Grab 3.png

Visual Design

I find great enjoyment in this phase as well. As an artist myself, visual designing grants me the freedom to explore unlimited colours, fonts, and design elements. Commencing with the selection of a carefully curated color palette, fonts, and icons for this project, I proceeded to design the mockups while utilizing the wireframes as a guiding reference. It was essential for me to incorporate necessary alterations based on the feedback acquired during the usability testing phase.

And here, I proudly present the results of my efforts—the final design:

Key Features

1

Scanning Products: Users can easily scan the barcode or QR code of each product using their smartphone's camera. This feature eliminates the need for manual entry, ensuring accurate and efficient product selection.

2

Adding Products to the Cart: Once a product is scanned, it is automatically added to the user's digital shopping cart within the app. Users can view and manage their cart in real-time, allowing them to keep track of their purchases and make adjustments as needed.

Quick Grab 5.png
Qucik Grab 6.png

3

Online Payment: The app provides secure and convenient online payment options, such as mobile wallets, UPI or credit/debit card integration. Users can complete their transactions directly through the app, eliminating the need for physical cash or card swiping at the billing counter.

Takeaways

This project made me realize how challenging it can be to handle everything when working on a time-sensitive project. Since it was part of a design challenge, I only had one week to complete the entire project. I had to do everything, starting from research to final deliverables, within this short timeframe. Thankfully, I planned everything on the first day and followed the plan. Of course, there were moments when things didn't go as planned, but I managed to overcome the difficulties I faced during the process. This project taught me how to manage time and stay calm during tough situations. It also helped me improve my problem-solving skills.

THANK YOU
bottom of page