Invoice management application

Summary

CMA CGM, one of the world’s leading maritime shipping companies, needed a complete redesign of its Invoice platform. This business-critical tool allows customers to manage shipping invoices, make payments, raise disputes, and export billing documents.

The legacy platform, developed in the early 2000s, was outdated both in terms of user experience and technical performance.

I led the redesign as Lead Product Designer, working closely with two designers, product owners, developers, and end-users.

The objective was to deliver a modern, accessible, multi-device platform (desktop, tablet, and mobile) aligned with CMA CGM’s new design system.

Role

Role

Lead Product designer

Duration

Duration

3 months

Client

Client

CMA CGM

Industry

Industry

Solution

Solution

Desktop - Tablet -
Mobile

Key skills

Key skills

UX - UI - Research

Problems Identified

Outdated UX/UI

  • Legacy platform had no visual identity, no brand consistency, and an outdated interface

  • Basic elements such as CMA CGM’s logo
    or visual guidelines were missing.

Lack of User Research

  • The original application was built without user input

  • As a result, many features were irrelevant, while critical customer needs were ignored

Performance Issues

  • Unused features slowed the system

  • The search function was inefficient, and the app struggled with heavy invoice loads

Limited Functionality

  • No ability to export invoices in multiple formats (PDF/Excel)

  • No dispute management process

  • No archiving system for long-term invoice tracking

Low Customer Autonomy

  • Customers could not easily self-manage payments

  • This increased the workload of support teams and caused frustration among clients

Goals

  • Modernize the application for responsiveness across devices (desktop, tablet, mobile).

  • Improve usability and accessibility, following WCAG standards.

  • Introduce missing key features: disputes, exports (PDF/Excel), invoice history, archiving.

  • Streamline the experience by removing unused or outdated features.

  • Apply CMA CGM’s new design system for consistency and scalability.

  • Enhance performance to make the platform faster and easier to use.

Results & Impact

  • Faster performance: Reduced unnecessary features and optimized user flows.

  • Higher usability: Clients could complete tasks like paying invoices or exporting data in significantly fewer steps.

  • Brand consistency: The new design system created a professional and unified look across all CMA CGM platforms.

  • Positive client feedback: User testing after launch showed improved satisfaction and reduced support requests.

  • Business impact: Streamlined billing processes led to quicker payments and reduced invoice disputes.

Lessons learned

  • Involving real users early was essential—many pain points had never been documented internally.

  • A design system is a strategic asset: it allowed consistency and efficiency across multiple platforms.

  • Removing features is as valuable as adding new ones: simplification boosted speed and adoption.

  • Continuous collaboration with developers ensured the product matched the vision without last-minute compromises.

Connect with me to explore
your project's potential.

Schedule a call with Farouk

Farouk GRAMI © 2025

Upgrade your Web presence with Framer

Schedule a call with Farouk

Farouk GRAMI © 2025

Connect with me to explore
your project's potential.

Schedule a call with Farouk

Farouk GRAMI © 2025