Divoora

The first delivery platform in the Canton Ticino expands its ecosystem with the new iOS and Android apps by Rawfish.

Divoora is a food delivery platform based in Lugano (Switzerland), active since 2017, able to reach any customer target. The service was created to establish itself in the Ticino’s market, which is currently competitor free. The platform carries out delivery services for large partner restaurant and supermarket chains such as McDonald’s, Burger King and Despar.

Rawfish as a technological partner for the expansion of the digital ecosystem. The new app can be found on the App Store and Play Store.

The involvement of Rawfish as a technological partner made possible to materialize the Client’s strategy. Design and develop iOS and Android apps to increase active users through the new mobile touchpoint.

We took care of

Service design
UX/UI design
User test
React native development

Tecnologie

Figma
Bubble

Rawfish Team

Duration

12 months

Published on

December 2023

We use a Data driven approach to understand the current context of the web touchpoint, analyze data, user flows and ROI to guide the project.

Divoora, which is already present online with a web version of the service, shared with Rawfish their access to the platform’s analytical data. This is useful both for taking a deep dive into the demographics and related intentions, and for analyzing the UX of the program in its present condition and in particular the behavior of purchase.

Img 1. : Data analysis from Google Analytics

We divided of the project into 4 phases:Service Design, UI UX Design, Testing and Development

The Wave: Our virtuous and iterative approach.

The surfing wave metaphor is based on a User Centered approach that focuses on the user needs, not forgetting concrete business objectives. Alignment, research, design, qualitative testing, development and post-release data collection allow us to ride the project and arrive on the market with an already validated product / service.

Service Design

The first phase of Service Design made it possible to define the functions of the MVP version and the “nice to have” functions to trace the evolutionary path of the touchpoints and make the project scalable.
We worked both independently and with the Divoora team, organizing benchmark and research activities on Italian, Swiss and international players, analysis of user personas, customer journeys.

Img 2: Map of the Divoora ecosystem
Img 3: Discovery phase: evidence from the market and project scoping

User Personas

The definition of user archetypes allowed us to draw realistic profiles with clear identities, needs, frustrations and objectives.
The process allowed the project team to define which functions were already indispensable in the MVP to satisfy the target users.

User Story Map

Mapping user stories allowed us to visualize and prioritize product requirements. Thanks to this activity, we defined together with the customer which features to include in the MVP and to define a backlog for future releases of the service.

“Together with the Divoora team we have defined a first phase of alignment and definition of the service - through qualitative and quantitative research tools.”

Cristina

Head of Service Design

User experience and interface design

Wireframe phase

The first interface design phase focused on defining the information and navigation architecture of the app through the grounding of wireframes of all the service flows.

Definition of the first atomic Design System

After having implemented the Divoora brand guidelines, the design team extended the interface components by organizing a scalable Design System applicable primarily to the mobile app but also potentially useful for a future update of the web version.

Validate the choices made.Flow prototyping and test writing.

The creation of figma prototypes combined with the use of the Maze platform for usability testing allowed us to validate the UX and UI in a short time. Through remote unmoderated tests we were able to easily collect the test evidence, immediately refining the experience, avoiding development costs to correct post-launch problems.

"The creation of figma prototypes and the use of the Maze platform for usability testing allowed us to validate the UX and UI in a short time".

Annalisa

UI UX Designer

Img 4: Discovery phase: evidence from the market and project scoping

Final user interface design development

The entire range of services just a tap away

Divoora offers end users numerous services that require specific navigation flows. The home includes a carousel with news and offers as well as product categories to guide the user in their choice.

A simple, frictionless flow: from research to purchase

Divoora offers end users numerous services that require specific navigation flows. The home includes a carousel with news and offers as well as product categories to guide the user in their choice.

A simple, frictionless flow: from research to purchase

The app organizes points of sale and products for each category. It highlights waiting times, timetables, promotions. It also allows you to set your geolocation to sort the points of sale according to proximity.

In-app suggestions at the user's service

To ensure the correct receipt of orders, users are encouraged to activate push notifications in specific contexts within the purchase flow.

The cart is a clear and immediate view of products, quantities and prices

The user can enjoy the precise preview of his order, clearly view the products. You also have the possibility to modify the respective quantities, keeping an eye on the total cost.

Widget for order tracking... while you make other purchases!

In order not to interrupt the exploration of Divoora services, a widget has been designed that contains essential information on the current order. The solution allows the user to compose other orders while remaining updated on the status of the previous one.

We developed the project in React Native. Here is why.

React Native was chosen for the development of a hybrid app, in order to keep costs down. Thanks to its ability to share code between iOS and Android, the framework allows significant savings in time and resources. React Native’s flexibility and broad library support offer an efficient, cost-effective, and scalable solution. This strategic choice balances product quality with financial needs.

“React Native's flexibility and broad library support offers an efficient, cost-effective and scalable solution.”

Mattia

Head of Front End