HOVR Admin
Product Design
UX/UI Design
Internal Tools
Internship @ HOVR
Team
HOVR Design Team
Role
UX/UI Designer
Timeline
4 Weeks
Tools
Figma
My role involved conducting user interviews, research, and competitor analysis as needed. I designed key features of the admin panel, including Driver Approval, Payout History, Support Tickets, Dashboard, Fare Settings, Fare Calculator, Dispatcher, and Trip Receipt, as well as Ad & Promotion Management and additional screens as the team expanded.
Project 1: Driver Approval System
Project Objectives
Restructured the flow to give permissions all required documents for driver approval.
Organized a vast amount of driver data to ensure it was easily scannable at a glance.
On the original website, the driver approval process took 48.08 seconds. This lengthy process was reduced to 7.26 seconds, achieving an 84.9% time savings.
Process
The process began with Task Assignment, focusing on simplifying the website and reducing the driver approval time. Through Product Analysis and User Interviews, I identified key pain points from the support team.
Developer Meetings provided insights into the automation process and document accuracy. Using these findings, I created a Solution Sketch and refined it through design team discussions.
Once validated, I completed the UI Design with high-fidelity screens. Finally, the design was Presented to stakeholders, including the support team, and received highly positive feedback.
The Goal
The goal is to improve efficiency and reduce the time required for approvals.
In the existing admin panel, support staff must manually click on each uploaded document to review them, making the driver approval process time-consuming.
Let's look at the product we have
To speed up the approval process, document images should be visible without requiring a click, allowing for quicker verification.
The support team currently has to click the "Click to View" button to access each driver's document image, requiring them to repeat this process for all nine documents per driver. This results in significant time loss when reviewing multiple drivers.
Driver List ⭢ Driver Information
Approving one document requires THREE CLICKS (which is A LOT)!
We need to approve 9 DOCUMENTS per person.
Clicking the "View" button opens a popup displaying the document information, where the support person decides whether to approve or reject it.
Driver Details ⭢ Approval Pop up
User Interview with HOVR Support team
What is the Pain points and Needs from the primary user?
CUMBERSOME DOCUMENT REVIEW PROCESS
Support staff repeatedly emphasized the inefficiency of manually clicking each document to review them. Even with automation, they must verify the documents manually, making the process too time-consuming.
CONCERN ABOUT AUTOMATIC SCANNING ACCURACY
While developers stated that the automatic scanning technology has over 90% accuracy, support staff worried about potential errors.
MORE EFFICIENT REJECTION PROCESS
The current rejection process requires opening a popup and scrolling to the bottom to find rejection reasons, making it inconvenient.
DESIRE FOR BULK APPROVAL
Support staff expressed the need to approve multiple documents at once. If all scanned and manually entered data match, they suggested an option to approve all nine required documents in a single action, significantly reducing approval time.
Key Features of the Potential Solutions Can Be…
During this process, I consulted technical parts with development team to make sure it works properly when it's coded.
CARD DESIGN
All documents should be displayed as card without requiring a click so they remain visible for easy review.
VISUAL CUES FOR CHECKING INFO ACCURACY
A visual cue or indicator showing whether the typed and scanned information matches will help users verify the document's accuracy before approval.
BULK APPROVAL & APPROVAL ONE BY ONE
A checkbox or multi-selection option should be available for bulk approval. However, users must still verify the legitimacy of each document before approving in bulk.
SIMPLE REJECTION PROCESS
Support staff suggested separating the rejection process from approval to allow for a more efficient and streamlined rejection flow.
Solution Sketch
Aiming to Minimize Clicks and Simplifying Approval and Rejection System.
After meetings with the support team (primary users) and developers, I gained a clear understanding of both technical feasibility and user pain points.
The support team needed a way to review all nine submitted documents with minimal clicks. Additionally, with the upcoming auto-scanning technology, they wanted to quickly verify whether the scanned and manually entered information matched, and if not, easily identify the discrepancies.
Card-Based Design for Clarity and Efficiency
To address this, I proposed a card-based design to present document information in a clear and concise manner.
Each card displays document status and whether the information matches or differs at a glance. If more detailed verification is needed, users can click a card to view the document image on the right panel for closer inspection.
This design improves efficiency by reducing unnecessary clicks while ensuring the support team can quickly review and validate documents within the same screen.
One suggestion arose from my team:
"What if we add a document thumbnail to each card? It would make it easier to recognize the document type at a glance.”
However, as a designer, I felt that adding thumbnails wouldn’t provide real value. Given the small size constraint (98 x 77px), the images would be too small to be legible, creating unnecessary visual clutter. Additionally, the support team were experts who could already identify documents by name alone, making thumbnails more of a space-consuming distraction than a useful feature.
I explained this reasoning, and after discussion, the team agreed. The design remained as originally proposed, ensuring a clean, focused interface optimized for efficiency.
FINAL SOLUTION
Bulk Approval
The support team can quickly review all submitted documents at once.
If the information appears correct, they can select all documents and approve them in a single action.
The support team can still edit documents after approval if needed.
Approve Documents Individually
Support team members can review and approve documents one at a time as needed.
If the scanned document and manually entered data don’t match, users can click each document card on the left to compare and verify the information.
Then, if the document looks legitimate, the support team can approve it directly on the same screen without seeing a popup or navigating to another page.
Rejection Process
The support team can reject submitted documents individually. To prevent mistakes, the rejection process includes a few additional steps.
If a document is invalid, users can reject it by clicking the Reject button located above the document images.
A rejection reason must be provided to complete the process. Users can either select a reason from a predefined list or enter a custom reason manually.
The rejection reason is then sent to the driver via SMS, guiding them to resubmit the document correctly and avoid repeating the same mistake.
Takeaway
Understanding Users’ Needs and Identifying the Right Pain Points is Key to Product Design.
Unlike public-facing products, an admin website is designed specifically for internal teams, meaning efficient workflows take priority over aesthetic UI. The driver approval process was the biggest pain point for the support team because they had to manually review a massive number of submitted documents, making the process extremely time-consuming. Their need for a better workflow was more urgent than I initially expected, which I only fully realized through direct conversations and user empathy.
Additionally, at the design team’s request, the support team provided a clear list of essential features and design requirements, which greatly streamlined the solution development process. This experience reinforced the importance of direct user communication and collaboration in UX design, particularly in a fast-paced startup environment where rapid problem-solving is crucial.
© 2025