Our product is an internal web app for a 5-year-old start-up.
This project is about the process followed to re-factor the trade-in flow of a web app that helps workers to administrate, control and manage the flow of trading cars.
Product Lifecycle | Roadmap | User Research | UX Design | Interaction design | Facilitator | Prototyping | User testing
May 2020 - January 2021Our product is an internal web app for a 5-year-old start-up.
Being the Product Manager helps me get the business and the user view of the product status.
Trade-in cars are a regular paying method our clients use for buying our cars. At that moment, it wasn't a business need to improve, but it was for sure a user experience need to be re-factored.
Due to the start-up environment, requirements and priorities come and go within quarters or even weeks, so it’s quite hard to know when a fuctionality will be actually built. Specially in the 2020, the year COVID-19 attacked our world.
The Trade-in epic roadmap has been planned on April 2020, and after the whole work, this is how the final roadmap ended up being:
My work-flow process is based on the Double Diamond Theory and Lean UX process. I aim to incorporate the key stages of Discovery, Definition, Ideation and Implementation in all of my projects.
I spent a 4-month field study to alnalyse the effectiveness of this internal web app of the Trade-in process. Study participants were workers from every department involved on the duty.
For this stage of the research I decided to divide the Discovery stage on 3 phases:
We must communicate via email or slack with the teams involved to manage a trade-in quotation
It's hard to quotate Trade-in cars
Every time a client wants to trade-in his car I feel the sale is on risk for the lack of management on the application
It's time to start analysing the information from the Discovery stage. To do it so I decided to divide the Exploring in stage on 4 phases:
I created the interview questions to obtain qualitative information to define the the Affinity map. After mining the interview results I could list the data (one color per user):
To synthesize the data, I created 4 clusters of insights:
In my experience, using the Affinity map to create Personas is the easiest and most reliable method because of the use of qualitative data. The categories I included for the Personas definition were:
As the application was already built and so its UI, the goal of this phase was to compare and better understand the usability gaps in the existing process by my expert view.
The workflow I followed was:
As the trade-in process involved 5 different teams, I needed to understand the flow and user’s pain-points.
Messy flow
The flow defined in the platform does not fit with the real flow
Too convoluted
Users do too many interactions outside the platform. This leads to confusion and mistakes
Lack of control
So many departments involved with different priorities. Hard to control and management
Poor UX interface
There have been too many usability heuristics to be solved to improve the UX
Missing coherency
The current process assigns wrongly the work among departments
It’s time now to start working on solving the pain-points gathered on the research.
Wireframing & UX testingTools used
Thanks to the UX Diary and the heuristic evaluation, I designed Low-fi wireframes based on an initial and hypothetic user flow. To ensure worker’s productivity, my goals on this initial UX Testing were:
#1 Information architecture
To validate the IA of the new screens
#2 Usability
To detect usability fails
#3 Correct mistakes fast
To fastly discard UX hypothesis
#4 Confirm data request
To assure all data is necessary for the process
The UX testing helped me to validate the user interactions flow and to discard the information architecture and usability of the designs. The findings were:
Not clear IA
Users could know where they were but they didn’t know what to do first
Messy navigation
Too many inputs and tabs that could be reduced
Optimized user flow
The user flow defined matched with the key points of the process
Good duty assignments
Each user knew what, when and where it was expected from them on the process
Tools used
I continued iterating on the designs to clear the IA and the UX by testing more proposals with users.
User interactions flow:
Tools used
I had to build some new components on the Design System. Thanks to the continious UX testing we succeed on the firsts UX findings. These are the final screens for the initial part of the process (validation, initial quotation and initial agreement):
User interactions flow:
This is the screen of the Trade-in process where purchasers and sellers collaborate to propose a purchase price to the client:
Validating data is the first duty for purchasers to assure the car is a good buy for us (good hand car) or not:
Purchasers save the changes on the validation group “Data”
Purchasers save the validation
Purchasers validate the fields from the validation group “Photos”
When all fields are validated, purchasers can save the changes
Purchasers save the changes on the validation group “Photos”
Purchasers can now quotate the initial estimated purchase price
When the data is validated, purchasers can now quotate an estimated purchase price.
Purchasers can add directly to the proposal the calculator the estimated price
Puchaser must confirm the proposed estimated price by clicking on the CTA
The Trade-in quotation status is now “Waiting for client agreement”
The client has not accepted the quotation proposal and the process ends
The client has accepted the quotation proposal and the process continuos
Now deliveries must contact the client to set a delivery date and the type of delivery. On the delivery date the trade-in car would be mechanical certified and purchaser would set a final quotation price. If client agrees, the trade-in car would be added to the sale incomes; if not, the client would have to choose another paying method to buy our car.
This process took me nearly a year to be built because of 3 factors:
We have just developed it in our application and users are starting to use it.
User reseach never stops! Now it’s time to measure and listen to users to continue the iteration and the progress of a great application made by great people.