Customer Support Dashboard Redesign
Customer Support Dashboard Redesign
Enabling support agents to efficiently access customer information, manage device-related inquiries, and troubleshoot issues.
Enabling support agents to efficiently access customer information, manage device-related inquiries, and troubleshoot issues.
Project overview
Project overview
Our client, a smart water monitoring provider, needed to update their internal Customer Support Dashboard to align with new product launches and a refreshed UI. The redesign focused on improving the agent experience by supporting a new device and transitioning from a single-device-per-location model to one that allows multiple devices per location.
The update enables agents to easily search for customers, view their locations and associated devices, and access key device details, alerts, and notifications for efficient troubleshooting.
Our client, a smart water monitoring provider, needed to update their internal Customer Support Dashboard to align with new product launches and a refreshed UI. The redesign focused on improving the agent experience by supporting a new device and transitioning from a single-device-per-location model to one that allows multiple devices per location.
The update enables agents to easily search for customers, view their locations and associated devices, and access key device details, alerts, and notifications for efficient troubleshooting.
🙋🏼♀️ My role
🙋🏼♀️ My role
As the UX Designer in a two-person team, I was responsible for:
As the UX Designer in a two-person team, I was responsible for:
Conducting the initial discovery session with the client to gain insight into project goals, scope and design requirements
Conducting an audit of the existing customer support tool
Updating platform flows to integrate new features and product data
Creating wireframes to validate information structure and usability
Supporting the UI designer during the UI design phase
Conducting the initial discovery session with the client to gain insight into project goals, scope and design requirements
Conducting an audit of the existing customer support tool
Updating platform flows to integrate new features and product data
Creating wireframes to validate information structure and usability
Supporting the UI designer during the UI design phase
I collaborated closely with a UI Designer, especially during the final stages of the design process.
I collaborated closely with a UI Designer, especially during the final stages of the design process.
The design process
The design process
🔍
Discover
Discover
Aligned with the client on goals, user needs, and product updates through a discovery session.
Aligned with the client on goals, user needs, and product updates through a discovery session.
📌
Analyze and define
Analyze and define
Audited the tool, defined requirements, translated them into user stories.
Audited the tool, defined requirements, translated them into user stories.
✏️
Ideate
Ideate
Designed user flows and wireframes to validate core workflows, structure, and content.
Designed user flows and wireframes to validate core workflows, structure, and content.
🎨
Propose
Propose
Created final UI screens based on validated wireframes.
Created final UI screens based on validated wireframes.
The challenge
We conducted a discovery session with the client to align on business goals, product updates, user needs, and known pain points.
Our challenge was to update the Customer Support Dashboard to support a new structure with multiple devices per location and a recently launched device, while ensuring a smooth and efficient experience for agents.
Auditing the existing tool
Auditing the existing tool
I reviewed the existing Customer Support Dashboard to better understand current workflows and the technical content displayed across the main screens. This helped me identify usability issues, ensure no essential functionality was lost in the update, and surface enhancement opportunities related to the newly supported features.
I reviewed the existing Customer Support Dashboard to better understand current workflows and the technical content displayed across the main screens. This helped me identify usability issues, ensure no essential functionality was lost in the update, and surface enhancement opportunities related to the newly supported features.
Project planning
Based on what we learned during the discovery session and the product audit, we defined the design requirements and translated them into user stories to guide the design work. This was reviewed and refined with the Product Manager during a planning session.
Project planning
Based on what we learned during the discovery session and the product audit, we defined the design requirements and translated them into user stories to guide the design work. This was reviewed and refined with the Product Manager during a planning session.
User flows and Wireframes
User flows and Wireframes
I created user flows and wireframes based on the defined user stories, focusing on validating the layout and organization of technical data across screens. This was especially important for understanding how information should be grouped and displayed for clarity and ease of use.
I created user flows and wireframes based on the defined user stories, focusing on validating the layout and organization of technical data across screens. This was especially important for understanding how information should be grouped and displayed for clarity and ease of use.
Main flows included:
Customer Search and Account Overview
Enable support agents to search for a customer and access key account information, including user information, registered locations, associated devices, and alert history.
Locations Overview and Device Access
Enable agents to view specific customer locations and access the list of devices installed at each property to support customer inquiries.
Device Detail and Alert Monitoring
Enable agents to access device details, clearly identify status, and review alerts or notification history to assist with troubleshooting and customer support.
Device Search and Direct Access
Enable support agents to quickly search for a device by ID and go straight to its detailed view, bypassing customer and location navigation when needed.
Device Search and Direct Access
Enable support agents to quickly search for a device by ID and go straight to its detailed view, bypassing customer and location navigation when needed.
Main flows included:
Customer Search and Account Overview
Enable support agents to search for a customer and access key account information, including user information, registered locations, associated devices, and alert history.
Locations Overview and Device Access
Enable agents to view specific customer locations and access the list of devices installed at each property to support customer inquiries.
Device Detail and Alert Monitoring
Enable agents to access device details, clearly identify status, and review alerts or notification history to assist with troubleshooting and customer support.
Device Search and Direct Access
Enable support agents to quickly search for a device by ID and go straight to its detailed view, bypassing customer and location navigation when needed.
Customer account information
Location detail
Device detail
UI designs
UI designs
Once the wireframes and flows were validated with the client, I handed them off to the UI designer who led the creation of the UI concepts and design system updates. I supported this phase by helping with the creation of multiple UI screens, applying the defined visual style.
Once the wireframes and flows were validated with the client, I handed them off to the UI designer who led the creation of the UI concepts and design system updates. I supported this phase by helping with the creation of multiple UI screens, applying the defined visual style.
UXUI Design・IoT, Home Automation Industry
UXUI Design・IoT, Home Automation Industry
2023
2023
Project planning
Based on what we learned during the discovery session and the product audit, we defined the design requirements and translated them into user stories to guide the design work. This was reviewed and refined with the Product Manager during a planning session.
The challenge
We conducted a discovery session with the client to align on business goals, product updates, user needs, and known pain points.
Our challenge was to update the Customer Support Dashboard to support a new structure with multiple devices per location and a recently launched device, while ensuring a smooth and efficient experience for agents.
Related Projects
Related Projects
This project builds on previous work with the same client, where I designed a web app for property managers to manage devices across housing units and updated the mobile app to support the new device and features.
This project builds on previous work with the same client, where I designed a web app for property managers to manage devices across housing units and updated the mobile app to support the new device and features.
Smart Water Monitoring for Property Managers
Smart Water Monitoring App