Device Management Dashboard
Payment terminal admin
2017.01 - 2017.04
The objective of this project was to revamp the admin dashboard for the company's estate management system. Significant problems were that multiple drill-down menus, complex architecture, search, and overall design needed to be revised. Through this project, the product team wanted to have a new design dashboard.
Type
Web-based admin dashboard
Team (10)
Working with Project Management Stakeholders, Product Managers, Product Marketing, Engineering Directors, and Designers
Capacity
Full-Time UX/UI Designer
My Role
I created a new design concept and built the design system library for other designers. - collaborated closely with fellow designers, developers, and product managers.
What I most accomplished
1. Presented new design to the team
2. Created the end-to-end flows of the demo site
3. Produced all design from flows to final visual and interaction specs
4. Redesigned dashboard home screen for quick implementation
Problems
More than 400 tickets related to bugs/customer complaints of the dashboard. I researched all the existing content and reviewed feedback, and I found the following significant problems :
Hierarchical drill-down navigation was ineffective due to excessive drill-down hierarchy levels.
Complicated search
Unclear UI
Complex UX
Design Sprint
Based on the research discussions and goals, the team together to flesh out many solutions to find the right one. I sketched out all the possible ideas for one flow. Then, we progressed into 10-minute wireframes to select a picture and do different concept versions.
After Design Sprint
We shared some basic look and feel design ideas with the design working group and shared with stakeholders to get feedback to determine the design direction and put it into the final design mockup and prototypes.
Proposed design
Final design
Design Objective
This design was to demonstrate the next version of the existing administration dashboard to enhance productivity and effectiveness in managing devices.
Updates
1. Simplified navigation to find the users' needs quickly.
2. Intuitive search interface with keyword tag to filter
In this project, I realized that search is an essential feature for estate managers to manage their devices. I emphasized the search box on the top and simplified the search experience. I got inspired by Google image search and Pinterest search. When a user enters a keyword in the search box, we show relevant keywords as well to filter the result quickly.
3. Refined search result view mode
The existing search result is displayed in a table view. It looked very boring and complicated. I created the result page in the image view, map view, and list view. It provided a better user experience.
4. Clean and straightforward charts and graphs
I redesigned various chart templates such as bar charts, line chart, and number carts.
5. For a short-term solution, the home screen and left navigation redesign
The demo design required dramatic changes from engineers and designers. It would take more than a 1-year project, so I kept the existing layout but redesigned only the home screen look and feel based on the new design concept.
design guidelines
What I learned
Early incorporation of engineering considerations is crucial to prevent rework. While sharing a demo product with the product manager and engineers, I realized that the conceptual design overlooked the system architecture and required significant changes that would impact the engineers' sprints. After stakeholders approved the demo design, I redesigned the dashboard to expedite the implementation of changes.
When creating a dashboard, it is important to use actual data to improve UX and account for unexpected use cases that may break the design.