How we created Mobility Pro, a super app for mobility, delivery, and services.

By

Rebeca Sousa

3

min reading

Aug 8, 2024

When I was invited to participate in the Mobility Pro project, developed for 704 Apps, I understood from the beginning that it was not just another application. The proposal was bold: to unite mobility, delivery, and service hiring in a single customizable platform, adaptable to the visual identity of partner companies. A true super app.

This challenge involved thinking about multiple user journeys, ensuring fluidity between different types of services, and also creating a robust enough design system to support all the necessary interfaces — all while maintaining the flexibility for future customizations. In this article, I share how I conducted this process, from conception to final delivery.

Understanding the proposal: a super app with customizable DNA

The initial briefing indicated that Mobility Pro would be an evolution of the previous version of the Mobility app. However, this time, it would be offered as a premium solution for companies wanting to have their own mobility, delivery, or service app — with their brand, colors, typography, and customized functionalities.

In other words, in addition to developing the standard interface, the project needed a modular structure and adaptable design that allowed variations without compromising the coherence of the experience.

I then started with a deep analysis of references, benchmarks, and analysis of the journeys of drivers, couriers, customers, and service providers. It was from this initial dive that I defined the foundations of the design system and the information architecture.

The design system as the basis for scalability

To ensure visual consistency and ease of maintenance over time, I created a complete design system, which would serve as the foundation for all the app's modules. This included:

  • Neutral color palette with customizable accent points

  • Scalable typography for screens of different sizes

  • Reusable components such as buttons, cards, modals, and forms

  • Icons and illustrations with a clear communicative function

With this system in hand, I was able to quickly build the interfaces for each segment of the app, ensuring visual unity even in different contexts, such as a courier's screen or a customer looking for a plumber.

Interfaces designed for each audience

Mobility

The mobility module was divided into two fronts: passenger and driver. For the drivers, I designed a lean interface, focusing on essential information: active rides, navigation, communication with the passenger, and earnings summary. Usability and navigation fluidity were a priority.

Delivery

In the delivery part, the challenge was to design distinct experiences for consumers and couriers. For end users, I created screens that facilitated the discovery of restaurants, reading reviews, and completing orders with just a few taps. For couriers, I kept the logic similar to that of the driver: focus on routes, schedules, and order management.

Services

The section of on-demand services was the one that required the most structuring. It allows users to find professionals such as dog walkers, babysitters, plumbers, etc., with filters, reviews, and direct contact methods. For the providers, I designed a dedicated panel within the app, with resources to create offers, manage services, and send proposals directly to clients — all in an organized and transparent manner.

Final result

At the end of the project, what we delivered was more than just an application: it was a white-label platform, with a solid visual structure flexible enough to serve different market niches — all with a focus on efficiency, customization, and a good user experience.

Mobility Pro stands out for integrating multiple services into one app, with a design that respects the particularities of each journey, without sacrificing coherence. It was a challenging project, but extremely rewarding to participate in — both due to its complexity and the impact it has the potential to generate for companies and end users.

When I was invited to participate in the Mobility Pro project, developed for 704 Apps, I understood from the beginning that it was not just another application. The proposal was bold: to unite mobility, delivery, and service hiring in a single customizable platform, adaptable to the visual identity of partner companies. A true super app.

This challenge involved thinking about multiple user journeys, ensuring fluidity between different types of services, and also creating a robust enough design system to support all the necessary interfaces — all while maintaining the flexibility for future customizations. In this article, I share how I conducted this process, from conception to final delivery.

Understanding the proposal: a super app with customizable DNA

The initial briefing indicated that Mobility Pro would be an evolution of the previous version of the Mobility app. However, this time, it would be offered as a premium solution for companies wanting to have their own mobility, delivery, or service app — with their brand, colors, typography, and customized functionalities.

In other words, in addition to developing the standard interface, the project needed a modular structure and adaptable design that allowed variations without compromising the coherence of the experience.

I then started with a deep analysis of references, benchmarks, and analysis of the journeys of drivers, couriers, customers, and service providers. It was from this initial dive that I defined the foundations of the design system and the information architecture.

The design system as the basis for scalability

To ensure visual consistency and ease of maintenance over time, I created a complete design system, which would serve as the foundation for all the app's modules. This included:

  • Neutral color palette with customizable accent points

  • Scalable typography for screens of different sizes

  • Reusable components such as buttons, cards, modals, and forms

  • Icons and illustrations with a clear communicative function

With this system in hand, I was able to quickly build the interfaces for each segment of the app, ensuring visual unity even in different contexts, such as a courier's screen or a customer looking for a plumber.

Interfaces designed for each audience

Mobility

The mobility module was divided into two fronts: passenger and driver. For the drivers, I designed a lean interface, focusing on essential information: active rides, navigation, communication with the passenger, and earnings summary. Usability and navigation fluidity were a priority.

Delivery

In the delivery part, the challenge was to design distinct experiences for consumers and couriers. For end users, I created screens that facilitated the discovery of restaurants, reading reviews, and completing orders with just a few taps. For couriers, I kept the logic similar to that of the driver: focus on routes, schedules, and order management.

Services

The section of on-demand services was the one that required the most structuring. It allows users to find professionals such as dog walkers, babysitters, plumbers, etc., with filters, reviews, and direct contact methods. For the providers, I designed a dedicated panel within the app, with resources to create offers, manage services, and send proposals directly to clients — all in an organized and transparent manner.

Final result

At the end of the project, what we delivered was more than just an application: it was a white-label platform, with a solid visual structure flexible enough to serve different market niches — all with a focus on efficiency, customization, and a good user experience.

Mobility Pro stands out for integrating multiple services into one app, with a design that respects the particularities of each journey, without sacrificing coherence. It was a challenging project, but extremely rewarding to participate in — both due to its complexity and the impact it has the potential to generate for companies and end users.

When I was invited to participate in the Mobility Pro project, developed for 704 Apps, I understood from the beginning that it was not just another application. The proposal was bold: to unite mobility, delivery, and service hiring in a single customizable platform, adaptable to the visual identity of partner companies. A true super app.

This challenge involved thinking about multiple user journeys, ensuring fluidity between different types of services, and also creating a robust enough design system to support all the necessary interfaces — all while maintaining the flexibility for future customizations. In this article, I share how I conducted this process, from conception to final delivery.

Understanding the proposal: a super app with customizable DNA

The initial briefing indicated that Mobility Pro would be an evolution of the previous version of the Mobility app. However, this time, it would be offered as a premium solution for companies wanting to have their own mobility, delivery, or service app — with their brand, colors, typography, and customized functionalities.

In other words, in addition to developing the standard interface, the project needed a modular structure and adaptable design that allowed variations without compromising the coherence of the experience.

I then started with a deep analysis of references, benchmarks, and analysis of the journeys of drivers, couriers, customers, and service providers. It was from this initial dive that I defined the foundations of the design system and the information architecture.

The design system as the basis for scalability

To ensure visual consistency and ease of maintenance over time, I created a complete design system, which would serve as the foundation for all the app's modules. This included:

  • Neutral color palette with customizable accent points

  • Scalable typography for screens of different sizes

  • Reusable components such as buttons, cards, modals, and forms

  • Icons and illustrations with a clear communicative function

With this system in hand, I was able to quickly build the interfaces for each segment of the app, ensuring visual unity even in different contexts, such as a courier's screen or a customer looking for a plumber.

Interfaces designed for each audience

Mobility

The mobility module was divided into two fronts: passenger and driver. For the drivers, I designed a lean interface, focusing on essential information: active rides, navigation, communication with the passenger, and earnings summary. Usability and navigation fluidity were a priority.

Delivery

In the delivery part, the challenge was to design distinct experiences for consumers and couriers. For end users, I created screens that facilitated the discovery of restaurants, reading reviews, and completing orders with just a few taps. For couriers, I kept the logic similar to that of the driver: focus on routes, schedules, and order management.

Services

The section of on-demand services was the one that required the most structuring. It allows users to find professionals such as dog walkers, babysitters, plumbers, etc., with filters, reviews, and direct contact methods. For the providers, I designed a dedicated panel within the app, with resources to create offers, manage services, and send proposals directly to clients — all in an organized and transparent manner.

Final result

At the end of the project, what we delivered was more than just an application: it was a white-label platform, with a solid visual structure flexible enough to serve different market niches — all with a focus on efficiency, customization, and a good user experience.

Mobility Pro stands out for integrating multiple services into one app, with a design that respects the particularities of each journey, without sacrificing coherence. It was a challenging project, but extremely rewarding to participate in — both due to its complexity and the impact it has the potential to generate for companies and end users.

Latest articles

About projects that we build with strategy and creativity.

About projects that we build with strategy and creativity.

Belin Design

Designer focused on generating value and visual impact, breaking the barriers of web design in every detail.

©2025 • All rights reserved

Belin Design

57.030.823/0001-87

Belin Design

Designer focused on generating value and visual impact, breaking the barriers of web design in every detail.

©2025 • All rights reserved

Belin Design

57.030.823/0001-87

Belin Design

Designer focused on generating value and visual impact, breaking the barriers of web design in every detail.

©2025 • All rights reserved

Belin Design

57.030.823/0001-87