Menu
LESS ANNOYING CRM • ADMIN PORTAL
Revamping the Admin dashboard experience
Web Application | UX Design
Project overview
Less Annoying CRM is a simple, yet effective CRM for small business owners. Their focus is to provide users with a low-tech way to manage their contacts without all the extra + unnecessary features major CRM companies provide.
The company was in need of a facelift of its internal tool, the Admin page. This page is where their customer support team, (known as CRM Coaches), helps solve incoming user problems + update users’ accounts. While powerful, over the years the page had become cluttered + slowed down the workflow of the team.
The role: UX designer working alongside CRM Coach Lead + CEO || The scope: UX design + user research || The timeline: 4 months
The challenge
With customer satisfaction + information density at the forefront of the company’s focus, the overall design of the admin page for the internal team was a second thought. The company approached this page as a “show everything” element so the team can quickly assist the customer, but failed to think through the experience for the team
The opportunity
This presented an opportunity to design a cleaner admin page that still allowed the internal team to be power users + quickly access all information they need to assist customers without taking too much time.
Initial screenshot of the admin page
User research
The primary users of this page are members of the customer support team (known as CRM Coaches), while other administrators occasionally access this page.
To further understand the needs of the user, I conducted user interviews (11 total) over the course of 2 months. The aim with my interviews was to gain a deeper understanding of:
+ How they use the admin page
- + The hierarchy of information on the page
Through my interviews, I was able to learn more about their use, understand the hierarchy of the page + ultimately identify three (3) major pain points. These pain points helped me create a user journey for our CRM Coaches.
Pain points
Pain point 1: Clutter Originally designed for power use, every action + piece of information is shown on the page. Diving deeper, as new features + information, became available, they were added to the page wherever space allowed without putting thought into this. This lead to a cluttered page that, while powerful, overwhelms the user + is a major learning curve during onboarding.
Pain point 2: Scrolling One of the major points that were brought up in all interviews was the need to scroll down the page to access information, instead of having it visible at all times.
Pain point 3: Flow + Hierarchy With much of the text + headers being the same size + color, many components throughout the page all blend together. This didn’t support a productive workflow for the user, nor did it help establish a hierarchy of information throughout the page.
Task flow
Ideation
Low Fidelity Mockup
I started with a low fidelity wireframe to help place the information on the page. My goal here was to set a good foundation to then lay out all the information for the page.
Within my wireframe, I prioritized user information as that was typically the detail needed to take any action on the page.
From there I also focused on ensuring the various actions that could be taken on an account were categorized + displayed in an easy to skim way.
Overall my goal was to use as much space on the page as possible, but position the elements to feel more spaced out + give all the information the breathing room it needs.
High Fidelity Mockup Attempt 1
In my first attempt to design this page, I deviated from the original wireframe. The insight that lead to this was that on the original page, the entire top row of information was information the CRM Coaches were used to parsing. With this in mind, I wanted to ensure that the first row of information still provided all the context they needed to move forward on the account.
Additionally, while this design worked in some ways, it didn’t fully enhance the user experience for the CRM Coaches. Through self editing + feedback from the team, here are some missteps I made in this design:
– Icons aren’t helpful. The original page barely had icons throughout, but my addition of them in this design didn’t provide value or reference as much as they should have.
– Still not nailing the hierarchy. Looking back on this design, I relied heavily on bolded text to establish hierarchy throughout this page. The bolding didn’t do what I had hoped + instead continued to make this page feel cluttered.
– Missing information association. One of the points that came up was associating elements with actions + links that are relevant to that information. For example, the option to “clear email address” should be close to the email, not necessarily in a mass list of actions. In this design I missed the opportunity to do this.
– Future thinking. I was very focused on trying to make the layout flow better with this design that I didn’t consider how + where future additions would be on the page.
High Fidelity Mockup Attempt 2
In my second attempt, I relied heavily on dialogs to hide unnecessary actions or information that a CRM Coach may not need at first glance. This allowed me to end up with a design that was extremely condensed + still extremely powerful.
While I was very happy with this design, it was missing a level of refinement to truly take it to the next level. The information, while better than the original, was still extremely compact throughout the different areas. I was creating a better user experience, but the interface needed to be edited. With my final attempt I wanted really take this design from “better than what we had” to “well thought out + well designed” outright.
The final result
The final result was a dashboard design, which addressed all major pain points of the user + allowed ample space for any future additions. I took this a step further + created a prototype for the design to further test out the product with CRM coaches to ensure this was the best possible outcome for them.
Next steps
For Development: After handing over these designs, the company has put this project into the pipeline for their Development team to ship. It is currently being worked on by a new team member as of September 2022. The goal is for the entire Admin page to be fully revamped before 2023.
For Review + Research: Once implemented, I would ideally love to revisit the design to continue to improve the dashboard for the team. Some metrics I’d be interested in reviewing to see how effective the design improvement are:
+ Time spent completing tasks. I’m interested in understanding if the new design cuts down on time “finding” the appropriate actions or information on the page.
+ The percentage of customer requests handled. My goal is to see if our team is able to handle more customer requests and inquiries with the new page versus the old one.
+ The overall user-friendliness of the page for new team members. The page has proven to be overwhelming to new team members. Tracking if the learning curve is as high as it is for the old page would help provide insight on how user-friendly the design is.
With this information, I would continue to review the feedback + stats from our team. Then I would proceed to iterate a new design to be tested + shipped to further improve this design.