UI/UX Design

App for franchises
of coffee brand.

About

In a competitive market, relationships with business customers are key.

"Moka", one of the most recognized coffee and food brands in Argentina, faced a major challenge: optimizing the payment management of its franchises and wholesale customers.

The manual process, across multiple channels, was inefficient, prone to errors, and made it difficult to track orders and finances.

To modernize this interaction, we designed "Moka app", a mobile application that centralizes and streamlines the management of collections and payments.

This tool not only simplified the lives of merchants, but also strengthened the business relationship with "Moka", giving them greater autonomy and control over their finances.

Company

Globant

Equipment

María Cecilia Massano - Project Manager

Francisco Garat - Product Manager

Mariana Scoccimarro - Product Manager

Osar Monzon - Cybersecurity

Yonathan Daniel - DevOs

Gonzalo Petraglia - TL, Solution Owner, SME

Carlos Lillo - Architect, SME

Ariel Vila - TD

My role

UI/UX Designer

The challenge

The payment and order tracking process for "Moka" stores presented significant frictions that affected both parties:

For businesses:
- Lack of visibility: Merchants didn't have a centralized place to view the status of their invoices, due dates, or payment history. This created uncertainty and a constant need to contact "Moka" for information.
- Limited access to financing: There was no streamlined way to request invoice financing, which prevented them from accessing working capital at key times, limiting their growth potential.
- Manual and scattered payment process: Invoice payments were made manually through bank transfers, which caused delays, reconciliation errors and a lack of a clear record of what was paid.

For "Moka":
- Operational inefficiency: The management team spent a lot of time on manual payment reconciliation and collections management, which reduced their productivity and increased the risk of errors.
- Difficulty in monitoring: It was difficult to have a real-time view of the status of the customer portfolio, which made it difficult to make financial and commercial decisions.

Onboarding and security: We incorporate a simple and secure digital registration process, with biometric and two-factor authentication to protect user data and transactions.
Financing options: The app allows businesses to request financing for specific invoices with just a few clicks, offering pre-set amounts and installments. This empowers businesses to manage their cash flow more efficiently.
QR Payments: QR code generation was implemented so that businesses can receive payments from their own customers and use those funds to pay "Moka" bills, creating a closed financial ecosystem.

3. Product Roadmap (MVP and Evolutionary):

We defined an MVP (Minimum Viable Product) focused on the most critical functionalities: invoice viewing, payment calendar, and financing activation.
We've developed an evolutionary roadmap with new features such as the integration of loyalty programs, ensuring that the application continues to grow and add value.

Our solution

To solve these problems, we designed and developed "Moka app", a solution that acts as a financial control center for merchants, all from their smartphone.

How do we attack it?

1. Discovery and research phase:

We conducted interviews with key teams at "Moka" (Product Owner, Systems Management, Finance) and with a sample of businesses to fully understand their pain points, needs, and workflows.
We mapped the current payment journey, identifying friction points and opportunities for improvement.
We validated the technical feasibility with the development team, confirming the integration with existing systems (SAP, BIND) to ensure a robust and secure solution.

2. User Experience (UX/UI) Design:

Simplified payment flow: We created an intuitive flow that allows merchants to view their outstanding invoices and pay them directly from the app using a single CVU. This eliminated the need for manual transfers and the risk of errors.
Financial Dashboard: We designed an initial control panel that gives users a clear and quick view of their finances:

- Invoices and due dates: An organized payment calendar with automatic reminders.

- Transaction history: A detailed record of all transactions performed.

- Credit limits: Visualization of available financing capacity.

Impact & Results

The launch of Moka App transformed the relationship with merchants and generated a positive impact for both merchants and Moka.

For merchants:
- Increased autonomy: Users gained greater control over their finances, with the ability to view, manage, and pay their invoices anytime, anywhere, without relying on calls or emails.
- Improved cash flow management: Easy access to invoice financing allowed merchants to free up capital for other business needs, such as purchasing supplies or paying salaries.
- 24/7 visibility: Consolidated, real-time information eliminated uncertainty and strengthened trust in the brand.

For "Moka":
- Reduced operational costs: Payment automation and reconciliation freed up the administrative team to focus on higher-value tasks, improving internal efficiency.
- Improved business relationships: The application served as a customer retention tool by offering a modern, seamless user experience that set it apart from competitors.
- Strategic insights: The payment tracking and reporting system provided valuable data on customer behavior, enabling Moka to make more informed decisions about its financial and commercial strategy.