ABIGAIL CHESTER
Dashboard Redesign
My role: Lead designer of internal reporting software, user research, wireframe development and prototyping, UI design
Results: Improved Information Architecture, improved readability and navigability
Overview
Disclaimer: This project is protected by an NDA, so I am unable to get into the nitty gritty details and images. The image used on the homepage is a stock image included for decorative purposes.
This project involves a software we use with our clients that aims to showcase monthly statistics, leads and lead sources, and opportunities for improvement. The goal of this project was to conduct user research to pinpoint pain points, restructure the information architecture to improve readability and navigability, and design the entirety of the software.
Background
This dashboard is an internal software that parses through different leads and lead sources so the user can easily see, understand, and compare data. It generates an online, interactive report so the client has reference to their conversion rates, phone calls, and opportunities for improvement. As the lead designer of this project, I was tasked with reorganizing and redesigning the software to improve the readability and navigability of the software.
Problem
During monthly reporting, clients and employees are having a hard time finding specific, relevant information within the current report. Elements are not grouped properly and important information doesn’t stand out, causing a much longer process than needed to analyze the monthly data. Some clients have a very long report that needs to be readable and sortable.
Guiding Questions
In order to fully understand the use cases and pain points of the users, I conducted user research with current users. This user research involved user interviews, heuristic evaluation, and usability testing to uncover insights about users so I could rework that information into features that coincide with users needs, while also mitigating their pain points. Some of the guiding questions I asked in order to learn about the users included:
What features are most important in seeing the efficacy of the tracked campaign?
What is your typical process when viewing/analyzing the report?
What are your biggest challenges when viewing/analyzing the monthly report?
Design Process
For this project, I used an iterative design process in order to continue testing and making improvements.
Research Phase
During the research phase, I spoke with current users in order to gather their pain points, their goals and needs, and their process in using the software.
Analysis Phase
During the analysis phase, I took the needs and pain points from the research and grouped them into features to fix, features to add, and features to remove. I then prioritized those feature updates by must haves and nice to haves.
Ideation Phase
During the ideation phase, I rethought the information architecture, designed wireframes, and turned those wireframes into low fidelity mockups. After the low fidelity mockup was created, I began the iterative testing in order to save time further down the line.
Design Phase
During the design phase, I transformed those low fidelity mockups into high fidelity prototypes by adding UI elements and more sophisticated prototyping techniques.
The project is currently in the process of being passed off to the development team.
Important Features
Improved Information Architecture
Before the redesign, the report didn’t have proper heading usage or ways to split up/chunkate information, making it difficult to read. In order to mitigate this issue, I made sure proper headings were used, organized elements differently in order to find specific information without the user having to search and find it, and grouped similar elements together.
Why This Is Important
By splitting content up so it’s not all in a big paragraph, I designed it so that the important elements stood out. Besides the proper heading usage, I used different UI elements to help emphasize certain content, such as changing the font-weight, adding icons where necessary, and utilizing charts and tables to help the user visualize the information, while also breaking up the content to add some more interest to the page.
Sorting & Filtering
One of the main issues with the current software is that the user is unable to sort and filter the lead sources. During the ideation phase, I made a side navigation on the lead pages for users to filter through the services, and added a sorting drop down on each of those pages so the user could sort by multiple different factors.
Why This Is Important
Sorting and filtering helps the users to specify where certain leads came from, and makes it easier to compare from one service to another. Filtering and sorting also improves the readability of the content, as it narrows down the information to exactly what the user wants to find.
There are many other features that I didn’t highlight here, but these two were the most important factors in this redesign.
Learning & Takeaways
The design process of this project has taken around 8 months, and is now being prepared to send off to development for the build phase. There are many other features that weren’t displayed in this synopsis, including the feature to compare data by month/year. This project was a huge learning experience for me and the peers that I worked with. Not only was I able to collaborate extensively with the development team, but I was able to explore my design skills in different areas other than web design, as well as be able to put my time management skills to the test (thank you Asana for being the backbone of this project). I’m looking forward to my next big project and what I will learn from that :) If you want to know some more details about this project, set up a time for us to chat and I’ll go into a little more detail. Thanks for reading!