Service Center Dashboard

Revamped Home Depot's service provider dashboard, slashing page load times by 65%

Lead UX Designer  /  2022

Overview

Home Depot is well known for being a DIY (do it yourself) home improvement retailer, providing millions of people with the right tools and materials for whatever project they can imagine for themselves.

A large number of people would rather defer to a professional for more complicated projects, like HVAC, cabinet, fencing, and other installations. For a lot of the installation services Home Depot offers, they’ve partnered with third-party service provider companies of all sizes and from all over the country to help people get these installations done.

I worked as the lead UX Designer on the job management platform, Service Center, to help these service provider companies manage and stay on top of the jobs that come in from Home Depot. Recently, I was tasked with redesigning the home page to reduce the amount of time it would take for the page to load (latency). The loading time of the home page dashboard has affected some of these service provider’ abilities to efficiently perform their jobs (Over 80% of the people we surveyed).

We cut the time-to-interact by 97%, 70%, and 67% for large, medium, and small service provider companies' dashboards, respectively.

The Problem

The dashboard of the Service Center takes a considerably long time to load due to the large number of metrics that are presented on it. On top of that, every company has a number of different roles of varying capacities, and we can't design a separate experience for all of them (yet).

For many users, most or all of this information on the home page is of no relevance to them, but for many other users, being able to quickly access all of this information is absolutely critical to how they perform their jobs. It was really a one man’s trash is another’s treasure kind of deal.

So how might we redesign the dashboard to drastically reduce the loading time, while still keeping all of the same information available to those who may need it?

How might we balance the need for reducing latency with the goal of improving the experience for a large number of different roles?

How might we accommodate both ends of the spectrum, from niche roles at large companies like a lead scheduler or contract writer, to a managerial level role at a small company who needs to see a high-level overview of everything, every day?

How might we design this platform to scale and include other business programs in the future?

Initial Discovery

To get started, we used existing insights from a previous discovery. Based on what we learned from that discovery, we put out two concept test surveys with follow-up questions to 30+ service providers. The goal was to gauge if we were on the right track, and to understand what parts of these concepts resonated with the service providers.In the initial discovery, we learned:

Over 80% of the respondents felt that the loading time of the home page dashboard has negatively affected their ability to do their job.

46% of all users who go into Service Center just go right to search for some job, and don't even bother with any of the metrics we are making them wait for.

Most users of Service Center do not use many of the metrics on the home page, but still a large portion rely on at least some of them.

A majority of service providers use their own 3rd party system, and just go to Service Center to upload documents and pull information from new jobs

If we can reduce the time the home page takes to load while finding a way to keep all of the information readily available to those who need it, then it will improve all users' workflow efficiency as it relates to using Service Center.

Refinement Through Collaboration

Using the insights from the surveys, we iterated on the designs and worked closely with development to ensure that the new home page dashboard would reduce the latency enough to justify development efforts and also be scalable. Most importantly, we needed to make sure that whatever approach we took to reduce latency would not negatively affect any user's ability to do their job (slow it down, make it more confusing, add too many steps, etc).

This proved to be quite difficult, with so many different use cases and potential user flows. Here are a few of the iterations we went through to reduce latency and work towards a more tailored approach.

After a few iterations and conversations internally and externally, we came up with an effective solution to reduce the latency considerably. It tested very well with 8 users of varying job responsibilities at their respective companies, with nearly a 100% task completion rate and SUS (system usability scale) scores all above 97.

The New Dashboard

Our new design uses a widget-based interface. It loads fewer metrics up-front and allows the user to interact immediately instead of waiting until everything finishes loading. As seen below, there are still some metrics loading in, but the search and labels and status drop downs are already interactive within seconds.

The new home page dashboard still provides a high-level overview of all the information that managers were used to seeing and need to do their jobs efficiently.

More information is just one click away in a "by status" dropdown. This defers the loading of additional, more granular statuses until the user prompts the system to do so. So people who just need to get into search don't need to see and wait for 30 granular metrics, but people who want to see how many consultations are not quoted can load in those additional metrics with one click.

The new design also consolidates "Quick Actions" into one area and has received positive feedback from providers.

Results

I worked with the product manager to get benchmark numbers for two large, two medium, and two small service provider companies, and how long it takes for all of the information to load on their current dashboard. After the new dashboard went live, we remeasured the same companies' dashboards.

Large companies: Decrease in 97% for time to interactive, and a 50% decrease in time for the page to finish loading.

Medium companies: Decrease in 70% for time to interactive, and a 59% decrease in time for the page to finish loading.

Small companies: Decrease in 67% for time to interactive, and a 51% decrease in time for the page to finish loading.

We additionally dispatched a survey to all Service Providers for feedback post-launch. There were 112 respondents at the time of creating this writeup. Here are some key findings:

66% of respondents were overall very or somewhat satisfied with the new home page, while 20% of responded neutrally, and 14% were dissatisfied. Some dissatisfied respondents cited issues with seeing the wrong data, which is an issue development prioritized and worked on immediately.

57% of respondents reported that the new home page very or somewhat positively affected their ability to perform their job, while 30% responded neutrally and 13% said it somewhat negatively impacted their ability to perform their job. The neutral responses are positive for us, because we reduced the page loading time without impacting their ability to effectively do their job.

Much of the positive feedback was related to the page loading more quickly, the screen being easier to understand and navigate, search being more quickly available, and that is is resulting in "significantly less downtime." Respondents also appreciated the "tile" format which resembled the legacy system they were familiar with.

Most issues come from providers that are part of one particular business program, and are related to incorrect metrics showing up for Purchase Orders on the home page versus the list view pages (page with data tables for all jobs), or links pointing to the wrong results. IT has worked to address these bugs.

Another mention was of errors being harder to find, since they live within the drop downs instead of outside of the widgets. The reason IT placed errors within the Orders dropdown was to maintain the integrity of the display structure; however, we are now collaborating to design a solution that will address this issue and make errors more prominent.

Opportunities and Next Steps

One big opportunity that we didn't get to implement this first time around was customization. I had a hypothesis that if we gave users control of what they see and don't see on their screen, they will naturally remove excess metrics which will reduce the loading time. I created a four phase plan that the PM approved to work towards dashboard customization, which will further our goal of a more tailored experience for both the niche roles and high-level managerial roles.

The loading time metrics are not as low as we want them yet. For example, loading the store notes still takes a considerably long time to load. There is also still plenty of room for improvement in the end to end experience itself. We will relate to the survey responses for immediate feedback.

Biggest Takeaway

It was key for us to keep the development team involved throughout each step of the process, so we knew as soon as possible when we needed to pivot or if new technical constraints needed to be introduced. It helps foster a sense of trust when you can keep them in the loop, explain your process and justification for each decision with data, and work within technical constraints.

If you’d like to hear more detail about the process and the journey of the project, and the solution I came up with, please contact me.

Next Project

Your Change Concept to Launch

Designed a new way for younger audiences to make meaningful contributions to non-profit organizations.
Read More