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.
The project
Latest articles
About projects that we build with strategy and creativity.
About projects that we build with strategy and creativity.