SPI Dinner, 2020

Contact less Dining System

Website & App Development Social Media Content Digital Media
By Deepsense Digital
Client Brief

ID is a renowned brand by, 'Satyam Cinemas'. ID is a modern, yet contemporary quick service restaurant conceptualized for the traditional food lovers. This pure vegetarian restaurant serves a host of south Indian delicacies. In the midst of the novel COVID-19 pandemic, people are bound to follow safety measures issued by the government such as self-isolation, social distancing and, frequent handwashing, which makes a hard hit on the restaurants as well as other businesses. So, SPI wanted to enhance its dining experience by developing a user-friendly dining app, where all the safety measures have been followed along with amiable dining experience.


Hence, we came up with an idea of building a contactless dining for their dining system without compromising on the users experience. They wanted to develop an app that can be fully functional to cater from table reservation to payment.


We created a contactless dining app for SPI enabling the dine-in experience that allows a guest to view menu, place orders, and make payments without interacting closely with a server or touching shared public surfaces. It is enabled via technology such as QR codes, in which a customer scans a sticker to access the restaurant menu or payment system online.


1)UX Phase:
The project was initiated with competitor analysis and understanding the needs and wants of the user through user-research. Upon collecting some insights, we then started to devise the user-flow and architect wireframe concepts and iterated on the feedbacks. Finally, it has then proceeded to UI.

2)UI Phase:
UI is where a concept comes to life. Here we applied branding and created interface components to design. This includes everything from pages to small buttons and toggles.
For the UI colour, we decided to go with a dark tone to accompanying their restaurant interior while familiarizing the user experience.
After crafting all the screens, we then prototyped using Adobe XD which was forwarded to developer.

Development was carried out on the pixel-perfect conversion of design to code. Our main focus was to create a fast and responsive progressive web app (PWA) which can work efficiently even on low bandwidth network. User has the ability to install PWA just like any app and can be launched from an app launcher.

4)Technology Stack:
Frontend – ReactJS and Bootstrap.
Backend – Django and REST API.

• Lightweight Progressive Web App
• Table Reservation
• Order Placement
• KOT Processing
• Billing Management
• Payment Management
• Feedback Management


Just as it is designed, the App works perfectly enhancing the users’ experience along with following the safety standards.


SPI Dinner

Projects you might be interested