Umami Taste Experience Logo

Umami
Sushi

For Umami Sushi, we created a mobile application for online order management.

Services:

Branding; UX/UI Design; App Development

Technologies:

Figma; MSSQL; .NET5; Flutter; Azure DevOps

2020 – 2021

Umami Services Mockup

Customer request

In April 2020, Umami,a renowned sushi restaurant chain, found itself facing the restrictions imposed by the COVID-19 pandemic. To address this challenge, they entrusted us with the task of designing and developinga mobile application to automate and manage online orders (takeaway and delivery) for all their locations.. The decision to introduce in-house riders and develop a proprietary application was motivated by the desire to protect profit margins from the high commissions charged by external takeaway and delivery services.

Umami App Mockup

UX/UI Design

The application was designed to integrate the numerous restaurant locations, allowing users to select the nearest location to place orders through the various services offered (takeaway, delivery, boat service, and catering).

For each location, we designed specific color palettes to associate each location with its own branding and provide users with immediate feedback when switching between locations.

A distinctive feature of Umami is the ability to create customized sushi boxes.. Our challenge was to make the rules for composing the sushi boxes easily understandable for users and configurable on the management side.

After completing the order, users can pick it up by showing the staff their QR Code associated with the order.. The staff, in turn, can read and retrieve the information of the specific order by scanning the code with their own device.

Purplesoft - #1 App development for restaurants and sushi clubs
Umami UI Mockup

Software Development

For this project, we developed an integrated system consisting of a SQL Server database, C# .NET 5 Web APIs, a mobile app for iOS and Android built with Flutter (Dart), and a web administration panel using Angular 12.

The architecture was designed to be highly flexible. The database was configured to handle a wide range of locations, each with specific services. Additionally, each location can offer multiple menus,each of which can be categorized into different types such as kids’ menu, set menu, à la carte menu, etc. The system was also designed to handle different languages and time zones,as Umami’s locations are spread across various countries.

Moreover, we have created a QR code generation system to be displayed on the tables of different locations, which dynamically shows the menus available on the website in real time. This allows for efficient menu management and provides a seamless user experience for customers.

To optimize development and improve system efficiency, we have integrated our proprietary SDKs:

Purple.sdk.authentication: a tool that facilitates user access by supporting authentication methods such as email, Google, Apple, and other common providers.

Purple.sdk.media: allows for simplified management of multimedia content, giving the client the ability to independently update images and videos in the app.

Purple.sdk.translation: server and client components that allow the user to change the texts in the app, website, and notification emails from the administration panel.

The use of these SDKs has accelerated the development process while providing the client with self-sufficient tools for content management and localization. This has resulted in a more efficient and scalable system.

The technologies

We used a series of modern technologies to develop the system, each chosen for its specific strengths:

Database: MSSQL Server 2019 – Chosen for its robustness and scalability, ideal for handling a variety of data, from different locations to various services and menus.

Web API: .NET 5 C# – Chosen for its efficiency and security, essential for connecting the different components of the system.

Mobile App: Flutter (Dart) for iOS/Android – This cross-platform development platform allowed us to create an app that runs smoothly on both operating systems.

Administration Panel: Angular 12 (TypeScript) – This framework made it possible to create an intuitive and robust management environment for the client.

Conclusions

Our system allowed the client to better manage its business during the period of ministerial restrictions caused by the global pandemic. However, once that period ended with a drastic reduction in take and delivery orders, the client decided to return to using classic platforms, Uber, etc.). The motivation for this choice was that it was too costly to maintain an in-house team of riders and to bear the costs of maintaining the application. We are proud of the work we have accomplished and the synergy with which all these components interact, creating a cohesive and impactful whole for our client.