OVERVIEW
OBJECTIVE
Problem Statement
In order to define the problem we asked 4Ws questions, to reach the point of the problem to then arrive at the solution.
WHO?
App user and Client
WHAT?
Create a client profile.
Be able to send invoices to clients.
WHERE?
Mobile app and in the future an external place to receive the invoice.
WHY?
The App user has their clients organised in the app and can better manage their invoices.
Save App user time with tax processes.
Following the research we clearly realised what is the main focus of the objective:
Benchmarking
After realising the statement, we proceed to benchmarking, to understand the features that the competition practices in order to make our journey stand out and get the metrics already established in the market.
This company separates clients and invoices into labels. The functionality is clear and user-friendly, in the sense that you create a client with his data and add it to the database to then associate to invoices.
Some of the key functionalities:
- Client portal for invoices;
- Late Payment Reminders;
- Recurring Invoices;
- Tax Preparation.
Some of the key functionalities:
- Possibility to customise invoice;
- Invoice share options via email, text or social media;
- Status tracking and reminders for invoices.
Some of the key functionalities:
- Possibility to customise invoice;
- Receive payments with QR code;
- Payment links.
findings
For that we created use cases in order to build the user flow.
This gives rise to use cases for both the app user and their client.
Main section
– Be able to create a client profile with their fiscal data;
– Be able to search for added clients;
Use cases for invoices
– Be able to automatically send invoices to the client;
– To give a clear and quickly accessible format to the client for the invoice sent by email (pdf);
Future use case:
– In the email sent to the client with his invoice, have a link with access to a portal where he can see the past, current and pending invoices.
usability test
- I didn’t understand why the “send” button was in the same hierarchy as the “clients” button. I feel there should be a logical separation between the two.
- The whole interaction was simple to understand, but I’d like to see an idea on the home screen of what the invoice labels would look like according to the customer’s profile.
(*Maze is an platform where you can create user testing projects to get user insights and prototype reactions.)
Low fidelity journey screens
After gathering the necessary information and realising which path we wanted to take, we moved on to building the wireframe. At this stage we realised the most usual and logical way to create this functionality.
High fidelity journey screens
Taking into account the low-fidelity construction and the interactions discussed, the final design was created. The UI rules were applied, such as an 8px scale grid, a 60% / 30% / 10% colour scheme, fonts suitable for mobile and figma construction using auto-layout.
prototype
Final considerations
On a personal level, it was interesting to build a project in this sector, because as I explained at the beginning, I was curious to be able to realise product design with this type of service, which is so in demand today.