At ConectCar, I was redirected to the team responsible for our product for public pj, to redesign the dashboard where the user can consult their registered vehicles and the status of each tag and monthly fees.
Our page of vehicles registered in the PJ portal currently does not have a fluid experience, having obstacles and lack of clarity in some essential information for users. Generally, the point of greatest attention is the fact that there are no details about the validity and status of the monthly fee, and this value can be observed in the “Monthly” column without any more detailed identification, making the user believe that his current monthly fee is what is in the system.
Another point of attention is the lack of visual consistency about other screens that have already been created and structured taking into account our Design System.
1 × Product Designer 1 × Engineer 1 × Product Owner 1 × Scrum Master
First of all, we study and analyze the pains that we need to consider in this demand, such as:
- There is no data and information in the Type and Brand/Model/Year columns, being necessary to remove these columns;
- Customers usually have doubts about the status and validity of their monthly fee, and there is no type of complementary information about it;
- There is no need to create two types of views for the desktop version;
- There is no explanation about what the Cost Center field would be;
- Currently blocked tags only appear in red color, no longer having any type of identification.
For this demand to be delivered and completed correctly, we stipulated the main tasks with the help of the UX Team and the PO, which are analyze current screens and components that will be needed in the Design System, redesign screens, flow, and prototypes in mobile and desktop versions, in mobile-first, contemplating business rules, such as removing and adding items, taking into account the main pains and focusing on accessibility and usability.
Analyzing current screens
Analyzing the current screens of the PJ portal of the desktop and mobile versions, we can observe other points of improvement that will be covered in this documentation.
In addition to listing the components that will be needed from our Design System, we also have a small Benchmark of references that will be taken into account when creating new components and screens.