Dashboard UI Customer Support

Customer Support Dashboard

Optimized internal workflows and reduced call volume for account representatives through a redesigned dashboard.

Online Customer Support
PROJECT DURATION

16 Weeks (Q3 2020)

From foundational user research to wires and prototyping.

TOOLS & TECH STACK
Adobe XD IBM WCM Contentsquare OpinionLabs
CORE ACTIVITIES

User Interviews, Usability Testing, Stakeholder Reviews, Architecture Review.

Overview

In collaboration with the Online Support Center and “My Account” development teams, the objective was to create a seamless support experience that enabled customer representatives to efficiently assist users with a wide range of account-related issues.

Through stakeholder workshops and cross-functional discussions, the support and engineering teams identified several critical user flows that needed to be supported, including:

List

The Challenge

Eliminate the "fog of war" created by poor data hierarchy, and create an easy to use dashboard for account representatives.

  • Simplify complex and fragmented account data into a clear, intuitive hierarchy that enables representatives to quickly locate critical customer information.
  • Reduce cognitive overload by surfacing the most relevant actions, statuses, and support insights within a centralized dashboard experience.
  • Improve efficiency and decision-making for account representatives by creating a streamlined interface that minimizes navigation friction and accelerates issue resolution.
Screenshot

Design Process

Following collaborative workshops with both support stakeholders and the development team, I was provided with a comprehensive architectural document detailing each identified user flow and system requirement. After analyzing the material, I organized the experience into 11 core sections, using the existing platform structure as a foundational reference point.

Because the platform was still in its early stages, this presented an opportunity to establish a more cohesive and scalable user experience. To achieve this, I aligned the interface with Canon’s updated style guide, ensuring the product felt both brand-consistent and intuitive for internal support teams.

Once the initial designs were completed, they were shared with stakeholders and developers through multiple review and feedback cycles. After several refinements, the finalized Adobe XD prototype and supporting architectural documentation were handed off to the development team for implementation.


1. Emphasize & Define
Conducted 3 user interviews to map out an admin's typical journey.

2. Ideate & Prototype
Created mid-fidelity wireframes in Adobe XD, testing them with the interviewed admins. Iterated based on their feedback.

The Outcome

The redesigned experience received strong positive feedback from support stakeholders, particularly for its clarity, usability, and alignment with internal workflows.

The success of the internal support experience also sparked discussions around extending the same design patterns and workflows into a future customer-facing dashboard experience.

-27% Decrease in Turnaround Time
-61% Decrease in Call Volume
4.7/5 Site Score

Ready to explore the prototyped designs?

Inspect the designs and information architecture on Adobe XD.