Performance Monitoring Tool

Role: Interaction designer
Team: 4 people including myself (a user researcher, interaction designer, and visual designer)
Techniques: wireframing, prototyping, usability testing
Tools: Axure, AdobeXD

Background
The backup admin needs to be able to monitor the health of an appliance so that they can understand if the appliance is working too hard or if it is not functioning properly. An appliance is a server which can be a master or media server. Each type of server has a distinct role in backing up data.

Problem
The backup admin is unable to monitor the health of the appliance and currently they do not have any means to right now.

Goals

  • To create an intuitive experience
  • To identify the metrics that they need to see upfront
  • To understand what timeframes they need to see the data in and which important to them


Requirement Gathering
We met with the project manager (PM), architect, and engineering leads to understand the requirements, define the MVP, and scope. Once the features were defined, we created user stories and defined tasks and scenarios.

Use Cases
The backup admin would view the performance to see:

  • Where the network bottlenecks are
  • If the network is functioning well or not
  • The history of the appliance health to view trends

Solution
The backup admin will use this performance monitoring tool to observe the appliance performance. One of the most valuable aspects of the tool is that the admin will be able to see all of the metrics in one point of time so that they can compare the values.

User flow

Note: This feature was incorporated into an already existing flow.

Wireframes
I researched charting and data visualization libraries such as D3 and HighCharts for inspiration. I iterated and validated the wireframes with the stakeholders and I worked alongside my UX peers to bring the lo-fi wireframes into hi-fi mockups.

Prototype
I created the interactive prototype using Axure and I used Adobe XD as the foundation to build the screens. < add screenshots>

Highlight metric dropdown 3 different variations

Usability Sessions
The team and I along with our designated user researcher tested the designs. During the user research sessions, I actively took notes and asked questions to the participants. We had 8 participants through 1:1 WebEx sessions. < add questions from the script>

Highlights from the sessions were:

  • The order of the metrics worked well as long as they have the options to hide metrics
  • Putting alerts upfront is important so that the backup admin is aware
  • Comparing the health of one appliance to another is helpful

After the usability sessions were over, we had a debrief together as a team and we discussed our findings and impressions. Based on the feedback that we received from the usability testing, we iterated the designs and collaborated to review the iterations during our readout with the PM and engineering team.

Challenges overcome
An appliance collects many data points within a given amount of time. Given the results from the user testing, we chose to support 1 hour, 6 hours, 12 hours, 24 hours, 72 hours, 7 days, and 30 days. Given the collection interval of the data, we had to accommodate the large data set as the timeframe increased.

Delivery
After the designs were finalized, I created a specification document using PowerPoint. I shared the Axure prototype and specification with the engineering team. Once shared with the engineering team we were able to discuss the technical feasibilities with them. Since the team works in Agile and divides their work in sprints, they were able to take the prototype and divide the prototype into tangible engineering tasks. I worked very closely with the engineering team to make sure that the implementation resembled the prototype.

Use case: view metrics

View 3 of 7 metrics of appliance data.

Use case: compare appliance data with other appliances

Compare the data of 3 appliances.

Lessons Learned
Overall this experience taught me how necessary it is to do several options of a design and test them. Creating 3 different variations of the interaction to reorder metrics helped us identify the interactions that were needed for the backup admin.