Hubject Invoices - Hadass Sternberg

Financial Services — 2024
End-to-end invoicing system

I designed the end-to-end invoice management experience for a new B2B financial services product.
The new system solution automates invoices creation, directly connected to charging data, and simplifies disputes handling for users.

Hubject Financial Services offers a platform and service that helps EV charging companies manage B2B invoices, payments collection and distribution, and financial data. It streamlines processes, ensures compliance with regulations, and reduces errors in billing.

My role: Product designer (end-to-end UX reseach to UI design)
Project duration: 4 Months
Team: 1 Product designer, 1 Product owner, 2 FE developers, 2 BE developers
Credits: Hubject GmbH, Hubject Financial Services GmbH

All copy and content on this project are fictional and used solely for display purposes

The new invoicing tool solution

The project in numbers

💵 Financial challenges in the EV Industry

B2B sellers in the EV charging space face frequent conflicts with their B2B clients due to a lack of invoice data transparency and slow dispute resolution, resulting in delayed payments and revenue loss.

🚩 The Problem

B2B Seller companies faced challenges when managing invoices in the EV industry. They attempt to streamlining the charging to invoicing processes, but building internal solutions is costly, complex, and mostly suited for large corporates.

Key problems for the 'B2B Seller financial manager' persona

🎯 Business goal

The business requested a new product offering a complete financial solution tailored for the EV charging industry.
The product goal is to streamline the entire invoicing and payment lifecycle for B2B sellers, from charging data to final payout, while ensuring partners remain compliant with payment regulatory standard.

🏃‍♀️‍➡️ Project kick-off

I began tackling the invoicing project in depth together with the dedicated Product Owner, after we as a product team (3 Product Owners and 2 UX/UI designers), had refined the overall product concept, defined the initial scope and user flow, and clarified the data structure in collaboration with the development team.

The full 'Hubject Financial Services' product flowchart

⛰️ My Challenge

The biggest challenge was designing a unified solution that supported combined tasks of two different roles in the current invoicing workflow: financial managers and charging managers.
Another constrain was limited access to the legal team, so we had to find alternative ways to meet legal and regulatory requirements.

The HMW statement guiding my research

🔎 Discovery and research

I used UX research methods to better understand financial flows and invoice structures.
While conducting SME interview and task observation with a financial employee, I observed their workflows to learn the common tasks and behaviour. In addition, I conducted an extensive competitor analysis of B2B billing, invoicing, and payment systems, to study best practices of financial teams.

Competitor analysis on B2B billing software, highlighting key insights and comparisons.

Summary of SME financial user tasks and steps, outlining key processes and actions.

Team alignment on project progress and system flows to ensure shared understanding and coordination.

💡 Key insight

I discovered users place a strong emphasis on data verification, given the legal nature of invoices. After uncovering this core users need, I began drafting the information structure for the invoice view, focusing on clarity, accuracy, and traceability to support the verification process.

📝 Validate flows with users

As a team, we conducted concept testing to validate key flows, such as invoice approval, revocation, and credit note creation. I prepared and facilitated some of the tests, participated in the sessions, and took detailed notes. User feedback provided valuable insights, which we used to refine interactions and improve clarity for the final MVP design.

Concept testing with users

Quotes from tests with B2B Seller users

Tests findings in numbers.

Figma view displaying wireframes organized by user flow.

🚀 The solution

We decided to focus on automation to reduce manual work and minimize errors, while keeping key manual touchpoints where users can review and confirm the ongoing workflow. This approach balances efficiency with user control.

The final design solution is a centralized invoice view that automates data handling, ensures clarity, and supports human edge cases.

The value of the invoicing solution

🖥 The design

The design solution brings together all key information—line items, recipient details, revenue breakdown, and linked charging sessions—within a clear and organized layout.

The system also includes features that enable users to track invoice status, export data in various formats, and resolve disputes faster through a credit note process based on individual charging sessions.

New invoicing workflow: Track invoices and view detailed invoice information.

1️⃣ Key solution - Streamline validation task

The new solution significantly resuces manual work, ensures more reliable invoicing, and supports smoother collaboration and accurate docomentation for audits.

Financial managers benefit from:

Automatic monthly invoice generation: saves users' resorces and time on manual work, reduces human errors by creating invoices automatically by the system.
Easy invoice approval flow: users only need to review and approve, making the process faster and lighter.
Prioritized key data for faster checks: The most important billing details (based on user feedback) are highlighted, both in the approval table and invoice view.
Internal comments on actions: users can leave internal comments, improve team communication and makes audit tracking easier and clearer.

An overview of all invoices, categorized by status for easy tracking.

Invoice detail view highlights key data for quicker validation.

Users can approve invoices directly from the list view, streamlining the approval process.

The product lets users add internal comments with each approval, addressing the need for documentation.

2️⃣ Key solution - All-in-One invoice view

By centralizing all invoicing related data, the process becomes faster, more accurate, and less dependent on back-and-forth between teams.

Financial managers can now:

Easily track invoice status and key details: with the invoices overview categorized by statuses.
Quickly access original charging session data: resolve questions and disputes faster without relying on other departments.
Validate B2B client information directly in the invoice view: fix billing data issues immediately, saving time and preventing costly mistakes.
Export invoice data in multiple formats (CSV, PDF, JSON): to easily integrate with external systems for smoother operations.

The new solution designed to solve real user pain points—faster, more accurate, and easier invoicing.

Invoice data can be exported in multiple formats, making it easier for users to validate and integrate with external CRM systems.

Users can view the official invoice by clicking 'Download preview'.

3️⃣ Key solution - Instant credit note based on charging data

The new solution provied a faster, easier, and more accurate dispute handling.

B2B Seller finance teams can now::

Create credit notes instantly: users can generate credit notes either based on a specific charging session or a manual amount, directly from the invoices overview.
Credit base on charging data: No need to rely on data transfer from the charging department — users can now create credit note based on the accurate charging data accesible in the product solution, speading up dispute resolution.
Seamlessly integrates into the invoice cycle: Credit notes are automatically assigned to the next invoicing cycle and can be tracked easily under the 'Credit note' tab.

Users can create a credit note refund directly from the charging data table using a quick action on the relevant line item.

The credit note is automatically assigned to the next invoice cycle and deducted from the total amount.

📣 Spreading the word

To promote the new solution and advocate for UX culture, I led the creation and presentation of a company-wide product demo showcasing the end-to-end concept and invoice flow, with support from my UX colleague. I presented it company-wide and in product-sales workshops to share user insights and demonstrate the product's value.
I also created visual materials that were later used at an international eMobility conference to help promote the product externally.

Showcasing company-wide the product demo

📈 The outcome

The solution was successfully released at the end of 2024, with 4 partners onboarded for the pilot phase at the point of writing this case study.
A partner who had been using the product for 2 months emailed us with positive feedback, praising the simple and user-friendly design (see quote below).
This feedback, along with follow-up interviews, shows the solution meets users' needs for clear data and saves them hours by automating processes that used to be done manually.

🌱 Key learning

Working on this complex, large-scale project with tight deadlines taught me the importance of staying flexible and open-minded when uncovering user needs. Since I couldn't always talk to the right experts, I got creative - talking to internal finance colleagues with similar tasks and researching similar products. It eventually led to discovering valuable insights that shaped my design decisions.

New invoicing tool

↖ Go back to

Home page

Next project →

Hubject: Partner finder

Top