Rebuilding the Back Office for Scale

Company: AREX· Role: Lead Product Designer · Date: 2021-2023

Scope and Business Value

In 2021, I joined AREX as Lead Product Designer, becoming the first designer hired since the company’s founding in 2014. It was an exciting challenge: until then, user experience had not been a formal priority.

One of the most significant projects I led was the redesign of the Backoffice, the primary tool used by the Operations team.

Role
and team

As Lead Product Designer, reporting to the Head of Product, I was responsible for UX, UI, and Research. I worked in close collaboration with several teams:

• Product Managers, depending on the BO area: Clients and Investors, Products (Invoice, Credit Line), Trades, Payments, and Platform.
  
  
• Frontend Leads and Tech Leads, for technical implementation.
  

Challenges

Until then, the Backoffice had been developed without a clear design direction. The information architecture lacked a defined structure. Key problems identified included:

• Confusing navigation: No logical hierarchy or consistent usage patterns.
  
  
• Multiple frameworks in use: A mix of different versions of Vue (Vuetify.js) and Bootstrap, complicating maintenance.
  
  
• Duplicate components: Visual and functional inconsistencies with no shared component library.
  
  
• Redefine the navigation architecture to improve workflow.
  
  
• Optimize the user experience in critical sections.
  
  
• Set up a modular process to redesign existing sections while adding new features.
  
  
• Unify the visual interface by creating a UI Kit to serve as the foundation for a scalable Design System.

Empathizing with Users

Operations Team

The main user of the Back Office

Platform Developers

Managing permissions and user settings in the Back office

Chief Operating Officer and Finance Operations

Responsible for trading-related configurations

The key users of the Backoffice are:

• Operations team is the main user of the tool.
  
  
• Chief Operating Officer and Finance Operations, responsible for trading-related configurations.
  
  
• Platform Developers, managing permissions and user settings in the Back office.

The first step was to deeply understand the needs of the Operations team. 

• I organized collaborative workshops with key users from the Operations team and Product Managers. Together, we mapped how the tool was used, identified pain points, and prioritized improvements.
  
  
• We built a trust-based relationship, which supported an iterative process. To validate ideas, I presented low-fidelity wireframes during user testing sessions, gathering valuable feedback before handing off flows to developers.

Redefining the Navigation Architecture

Diagnosis

I conducted a comprehensive analysis of the existing navigation and created a map to represent the current structure. Based on the real workflows of the operations team, I proposed a new architecture with clear hierarchies and reorganized sections.

Implementation

Before the redesign, all pages in a section opened in new tabs with no linear navigation. We implemented a new structure that allowed users to move fluidly between main and secondary pages, removing friction and reducing cognitive load.

Visual Unification and Creation of the UI Kit

I carried out a complete audit of components and styles, consolidating visual elements and eliminating redundancies. I designed a new UI Kit in collaboration with the Frontend Lead, which served as the seed for a basic Design System, enabling consistent and scalable development.

Components Audit: Buttons.

Making the Back Office a Stronger Tool

I identified processes happening outside the Backoffice that caused a loss of focus. For example, invoice tracking relied on external chats, fragmenting the experience. I proposed integrating these channels into the interface, improving traceability and reducing management time.

The timeline feature was a communication thread designed to log and track external client calls or investigations related to invoices or credit line installments. This ensured all relevant information was centralized within the Back Office system.

These sections of the Backoffice already show a more consistent interface, with unified components and a more intuitive navigation structure.

Results and Learnings

The Backoffice redesign allowed the Operations team to work more efficiently, smoothly, and with less frustration. Improvements in navigation and user experience facilitated onboarding of new team members. Visual unification brought consistency and professionalism, laying the groundwork for scalable product growth.

Involving the Operation team from the start builds trust and leads to higher-quality design.

Small iterations and early validations are key when designing internal tools.

Documenting and systematizing from day one accelerates growth.

María Rey. Based in Barcelona, working remotely.