Web App | Research, UX/UI

Portal for Dealers to Monitor the Health of HVAC Systems

Scope: Two iterative design sprints that included qualitative user interview sessions to inform the and design and overall build of the new MVP design of the portal.

My Role: UX Research Lead & UX Designer

Client: HVAC Company

The Challenge

The contractor portal is a consolidated platform that dealers and distributors use to manage their sales and service operations for consumers' HVAC systems. The client wanted to increase efficiency and user satisfaction, and reduce time on troubleshooting.

Business Goals & Intented Outcomes

+ Understand existing pain points, processes and gaps the current portal has in supporting Dealers and Distributors

+ Gather feedback on the new connected portal user experience to inform next design iterations and strategy

+ Increase user satisfaction to managing Dealers by making in easier and saving time needed to troubleshoot

Methods Used

Qualitative Research: Concept Testing, Usability Testing

Key Research Questions for Portal Re-design

+ What are the current pain points for Distributors and Dealers when managing the service and maintenance of their customers’ HVAC systems?
+ Does the new connected portal experience help dealers better support their customers, and distributors better support their dealer based and service opportunities?

Solution Overview

The final portal re-design featured a way for distributors and dealers to see trends across customers' HVAC system, which allows them to be more proactive instead of reactive when issues occur. The portal allows users to troubleshoot individual customer HVAC units.
Distributor & Dealer Dashboard

Distributors and Dealers view a customized, high-level overview based on their permissions and coverage. This allows them to view high-level stats about Dealers and customers.

HVAC Trend Maps

The trend map provides a visual overview of specific alerts, and the number of overall customers who have opted into the connected system.

Alert Activity

When there's an issue with a customer's HVAC system, the alert is automatically sent to the Dealer. This helps Dealers be pro-active when reaching out to customers about specific issues with their HVAC system.

New Filtering Capabilities

Due to the high volume of alerts Dealers receive, we added a filtering capability so Dealers view alerts based on priority and feel less overwhlemed.

Quick Access to System Data

Dealers can also get a quick access view into the HVAC data related to the alert.

View Customer HVAC Data

When a Dealer is helping a service technician troubleshoot they can view
a customer's entire HVAC system. This includes quick access to serial numbers, warranty information and a history of alerts

Advanced Troubleshooting

When diagnosing an HVAC system, time series view has been added to allow Dealers to go back in time to see how system parameters have changed leading up the error.

Process Overview

Where I joined the project

Development team takes over

UX Design Lead applies visuals

Re-design based
off legacy app

UX Design Lead finalizes visuals

Prototype

Prototype

Test (Round 1)

Test (Round 2)

Deliver

Development Handoff and
Implementation

The UX Design lead worked with the PM to understand needs, painpoints, etc.

I took the start of the lo-fi prototype created by the UX Design Lead and finished it for the testing

1:1 Moderated, User Interviews to understand needs and validate prototype concepts

1:1 Moderated, Semi-structured User-testing on revised hi-fidelity prototype

I worked with the UX Design Lead who implemented the design changes

Finalizing the Prototype

Qualitative
Concept Testing

Hi-Fi Qualitative Usability Testing

UX Design
Lead starts

Final Visual
Designs

Target Personas

Based on research completed by previous team

Distributor

Needs

+ Easily plan and move inventory

+ Earn Dealers’ trust & provide support

+ Provide high value to customers and dealers

Concerns

+ Consumers losing Brand affinity

+ Understanding produce status and faults

+ Maintaining produce margins

Dealer

Needs

+ Be perceived as an expert to Homeowners

+ Earn Homeowners’ trust & provide support

+ Help technician productivity in the field

Concerns

+ Troubleshooting machines without information

+ Being cut out of the value chain

+ Maintaining customer calls and satisfaction

Prototype

Prototype for Qualitative Concept Testing

I took over the initial prototype work the UX Design Lead started and created the first concept for the initial testing.

Distributor Features

+ View and manage overall alerts

+ View connected device metrics

+ Insights into individual Dealership

Dealer Features

+ View and manage customer alerts

+ Insights into customer connected device

+ Manage customer device information for troubleshooting

Prototype designed with the UX Design Lead & Project Manager for Distributor and Dealer

Test (Round 1)

Round 1 User Research Methods:

Moderated, Remote User Interviews and Concept Testing

I conducted 7, 30-minute interviews with Distributers and Dealers remotely via Zoom
Objectives

+ Understand the current process for how Dealers manage the service and maintenance of their connect systems to best support their customers (Dealer)

+ Understand the current process for how Distributors manage their connected systems throughout their Dealer base so they can help make service opportunities more efficient (Distributor)

+ Validate hypothesized features and values in the new portal experience

+ Gather feedback on the new connected portal user experience concepts (Does it make sense? Are there any gaps?)

Interview Structure

1. Background & Current Experience of the Portal

2. Provide open-ended tasks related to each of the main areas of the prototype to allow users to explore and provide feedback

Stakeholder Involvement

+ Co-designed the prototype with the Client Product Manager using legacy knowledge to ideate and design new features

+ Prototype review before testing

+ Interview protocol review: Testing goals and focus areas

Participant Profiles

+ 2 Distributors, and 5 Dealers currently using legacy app

+ Pre-determined list of users created by the clien

Insights from Testing Round 1

01
The current portal doesn’t provide enough up-to-date data, and it would be more helpful if they could see historical data for troubleshooting

(Distributors only)


02
The current alert system makes it difficult for Dealers to be able to help their customers:

Critical alerts aren’t really critical, duplicative faults codes, false alerts and a lack of available history makes it difficult to for dealers to be able to help their customers (Dealers only)

03
Portal connectivity and poor data loading occurs frequently and is a major issue because it prevents Dealers and Distributors from being able to access and view system data

(Both Distributor & Dealer)

04
The new concept of an alert map has the potential to give a better high-level view of trends and customer information to better support operations and be proactive with major issues

(Both Distributor & Dealer)

05
The updated view of seeing customer’s system parameter data was very streamlined and could help troubleshoot system issues more efficiently

(Both Distributor & Dealer)

“There are lots of different versions of fault codes – using the same number for different faults across different pieces of equipment” - Dealer
“I would love this because I don’t get to see alerts right now. It would help me be more proactive….     If a thunderstorm sweeps through the area, we would be able to see a trend.” - Distributor

Key Recommendations and Iterative Changes for Testing Round 2

Overall we got positive feedback from participants on the concept, which validated the value of the new design
I presented our findings and design recommendations to our client stakeholders.
We had 1 design sprint left to make changes, conduct a final qualitative usability study, and complete the designs.
Our team worked with our client stakeholders
to prioritize the design changes and recommendations.
Alert map view and filtering functionality

+ Ability to customize which alerts are shown

+ Show a more comprehensive map view of alerts and customers information

+ Update fault code language to be more intuitive

Customer system parameter data

+ Provide quick access directly from alerts

+ Show historical data for better troubleshooting

+ Allow dealers to previous numeric data



Design Changes based on Insights

Under the guidance of the Lead UX Designer, I made the design updates to the prototype.

Distributor Specific

Updated alert map view to show more comprehensive data with filtering options

X

Filters were added to make it easier for Distributors to view & manage their Dealer-base

Dealer Specific

Added the ability to view time series view to make it easier for troubleshooting

X

Expanded alter map and customer controls view with additional filtering options

X

Advanced filtering options to make it easier for Dealers & Distributors to find only relevant alerts

Test (Round 2)

Round 2 User Research Methods:

The Lead UX Design Lead applied visuals to the majority of the screens to do a final round of qualitative usability testing.
Hi-fi prototype screens designed by the UX Design Lead and myself based on insights from round 1.

Round 2 User Research Methods:

Moderated, Remote Qualitative User Testing

I conducted 5, 30-minute user testing sessions with Distributers and Dealers remotely via Zoom
Objectives:

+ Test the usability of the updated design and collect last feedback before delivering the final designs

Participant Profiles

+ 2 Distributors, and 3 Dealers

+ Returning Participants from Round 1

Needs

+ Updated prototype review

+ Interview protocol review: focus areas for Distributors and Dealers

Interview Structure:

+ Provide open-ended tasks related to each of the focus areas depending on user-type (Dealer or Distributor)

Test Areas:

+ How would a Distributor:

+ Manage Dealers Trends, Manage Customer Trends

+ How would a Dealer:

+ Manage Alerts, Manage Customers, View Connected Controls + Trends

Insights from Testing Round 2

Overall, participants were delighted by the UI enhancements which make the portal feel cleaner and easier to use -- in general, the design was clear and understandable.

There were minor UI changes around navigation elements, labels and buttons.

“The portal has stepped its game up. I see the value in the re-design and once it goes lives I would want me and my team to use it every day” - Distributor
01
The navigation wasn’t prominent enough and Distributors had confusion about which Dealer they were viewing

Before

After

02
Adjustment to alert titles, buttons and icons to clear up general, minor confusion about different status meanings

Before

After

Deliver

Final Design Handoff

I worked with the Lead UX Designer to ensure all changes from Usability Testing were implemented

Final designs produced by the Lead UX Designer
Final Research Readout

Technical pain points that prevent users from using the portal and should be fixed before launch:

+ Dealers and Distributors receiving false, repetitive, or confusion alerts about their customers’ system

+ Portal connectivity issues delay customer system data from uploading and syncing

+ Data load time is a huge issue, users often wait minutes for simple data to load

+ Inconsistencies between controller alert lot and contractor alert log make it difficult for users to troubleshoot

Further research recommendations:

+ Alert triggers & classifications: work with engineers and users to understand how to make alerts more understandable, and whether there’s a way to reclassify “informational”, “moderate” and “critical” alerts

+ Verify system parameter information to make sure nothing needs to be adjusted to allow Dealers and service technicians to work together

+ Explore what causes slow data load time, and determine what changes can be made to make the portal run smooth and quick

Unique Challenges During the Design Sprint

Challenge 1: Main Research Challenge

Recording Constraint: I was unable to record the sessions due to client restraints, so I depended solely on notes for analysis.

Workaround & Key Takeaway

I asked my team’s PM to join me in note-taking during the sessions. We debriefed after every session, with extra emphasis to capture quotes, areas where users got stuck, and things that worked well.

Challenge 2: Historical Technical Issues Overshadowing UI in Usability Testing

Despite the positive feedback on the UI, many users still had major concerns about how the UI updates will solve the technical issues and backend issues they face today that prevent them from using the portal.

Workaround & Key Takeaway

Unfortunately, these technical issues were out of scope for me and the design team to handle, but are critical for the success of the product. We made sure to include these pain points and recommendations on for the product team in our final readout and handoff.

We also tried to make certain design changes, such as expanding filtering options, as simple workarounds for some of the technical issues.

Business Impact

Delivered a new UI for the platform that is usable, delightful and meets user needs

+ Made quick, iterative changes based on testing insights to make sure we’re meeting user needs

+ Conducted 2 testing sessions in
a quick timeframe to validate the new design and ensure it would have a positive response when implemented

Developed insights to drive future efforts to increase retention and platform efficiency

+ Identified pain points beyond this phase of work that the business can use to drive the product roadmap for the Portal

+ Highlighted current pain points discovered that negatively impact users' attitudes towards the platform and recommendations.

Provided team further research recommendations to help fix technical issues uncovered

+ Provided actionable next steps and recommendations to help guide the business in uncovering technical issues

+ The goal is the recommendations would help the team maintain momentum to keep improving the product experience after this phase.

Reflection

What would I have done differently?

+ If I had more time and agency to recruit users, I would have tested with additional Distributors to get more insights into their needs and pain points with the current system.

+ Create a post-test questionnaire for the second round of testing to capture feedback on overall satisfaction and ease-of-use of the new portal.


What did I learn?

+ The technical pain points are equally, if not more important to capture and mitigate in a product experience. They can cause customer dissatisfaction and can cause a brand to lose customer loyalty and trust

+ The importance of clearly communicating the insights and findings to guide design recommendations when working with a UX designer. I learned how to explain the specific finding in more depth and ideate through potential solutions with the designer.