the challenge
The network activity dashboard for Anglo American mining sites needed a redesign to improve usability, scalability, and adaptability across devices and screen sizes.
the solution
A complete design overhaul of the dashboard that makes use of a modern colour scheme and taking into consideration the client's needs of accommodating for additional technological enhancements.
Context
I was brought onto the dashboard redesign project as the lead designer to provide strategic design direction and take full ownership of the redesign process. The project involved migrating the existing dashboard from Grafana to PowerBI, handled by data engineers whom I worked alongside, while ensuring the new design could integrate technologies, including machine learning and predictive analytics. My role required creating a scalable, user-centric solution that aligned with both current needs and future capabilities.
Research
Before jumping into the solution, I wanted to first understand if the actual end users, service desk agents who monitor the dashboard and report activity to management, are experiencing any unique challenges. I achieved this by running a user interview focusing on picking up key insights and pain points experienced by the users. This exercise was really important as a foundational step in the redesign as I was able to not only create a relationship with the end user but to have also have an on-the-ground understanding of the dashboard which the main stakeholders (mainly management) were unable to find time to do so.
Common themes from these insights included:
Inaccurate information
A majority of the users noted that the information on the video wall, the main display device used to view the dashboard, is inaccurate and that the refresh rate for bringing up new information takes far too long.
Illegible text
All the users mentioned that making out text on the dashboard is extremely difficult. This is due to the size of the text and the font used.
Spending too long scanning the dashboard for information
When it came to looking for specific information, most of the users made mention that looking for this takes them a long time. They attributed this to the layout of the information on the dashboard.
Feedback shared from the users:
"I have trouble reading the text on the dashboard on the video wall meaning I have to wear glasses to make out the text."
"Where I am positioned, I am unable to see some of the screens on the video wall and would rather need to make use of the desktop app."
"I struggle with finding a specific ribbon on the video wall."
To better understand which information on the dashboard is critical for the end users to do their work, I ran a survey to understand which dashboard network activity item (referred to as a ribbon) is viewed the most by the end users.
What I found is that the most important ribbon is found at the bottom of the dashboard. Dashboard design best practices advocates that the most important information needs to be placed at the top half of a screen screen, the next most important piece of information in the middle of the screen and the least important information at the bottom half of the screen. Keeping this in mind, this gave the team and I the direction we needed to take with the redesign.
UI Design and design guide
To address the issue of the visuals being difficult to make out, I looked at first creating conceptual designs which I A/B tested with end users to gather sentiments on colour choices and the card design keeping in mind accessibility standards too. The results from the tests provided insights into how to shape up the design system for the re-design such as having to stick to two accent colours (red and green) instead of three to prevent the dashboard looking overwhelming with three accent colours (red, yellow, and green).
For the style guide, I used a simple colour scheme guided from my findings from the A/B test along with neutral colours to ensure elements such as text and icons contrast well on the card. The font choice was Inter which was in line with CI requirements of the organisation. I kept layouts consistent by using a 9-column, 8px grid.
The card design for the dashboard is designed for quick insights and efficient action. The title and icon establish the context, while the status indicator highlights the system’s state (critical - red strip; no issues - green strip). The downed instances count provides a clear overview of issues, and the list of sites prioritises affected locations. The server list details top impacted instances, enabling swift identification and resolution.
The results
The entire end-to-end design process took approximately 4 months to design with an additional month to design a concept for a mobile interface, successfully meeting stakeholders expectations for the redesign effort. A majority of the time was spent on designing components to be reviewed with stakeholders in bi-weekly review sessions, working on integrating these components with data analysts and ensuring design standards are met throughout the project. The final product has now been released for Anglo American end-users for both desktop devices and a concept for a mobile view for mobile devices. Future releases of the project include using predictive learning to proactively prevent any major network outages by using historical data to draw a conclusion.
post-design research validation
To validate if the design was a success with the users, I employed a structured user research methodology a few months after the team deployed the redesigned dashboard. The aim was to measure dashboard ease of use, task success, and error rate. Key data showed that the redesign was largely a success with some areas of improvement particularly down to how the ribbons on the dashboard don't necessarily represent accurate data, a task which the data analysts on the team had spent additional time investigating and addressing throughout the project.
Reflections
Lessons learnt in the project have been gaining a first hand experience for designing for PowerBI dashboards. What I had picked up from this is that because the main view of the dashboard, being the video wall was non-interactive and purely informational, I had to think of a way to deliver an excellent user experience for users. This taught me the importance of having to constantly engage with subject matter experts who have the required knowledge needed for me to deliver an excellent user experience. Additionally, having metrics to measure the implementation of the re-design helped with giving the team and I an idea of the effectiveness of the overhaul.
