Redesign SaaS Platform

Redesign SaaS Dashboard

Frame 674@4x.png
 

Project Brief

This is an internal company platform that caters to the employees of the organization, allowing them to gain visibility of data used to summarize the growth of various sectors of the company, as well as projects and their corresponding details. My goal was to conduct user research and understand why employees were having a hard time with the current platform.

 
 

DURATION

January 2021 (2 weeks)

MY ROLE

Lead UX Designer

Tools Used

XD, Overflow

 

Design: Lo-fi wireframes, adding to UI design system, hi-fi wireframes

Research: conducted user interviews

Due to NDA purposes, I will not be sharing the client name or high fidelity wireframes. As well, I will not be sharing key functionalities that may give away the brand but will focus on specific problems I encountered and how I proceeded to solve those problems.

 
 

Project Timeline (2 Weeks)

What I Did

01 Week

Empathize, Define, Exploration

  • understand problem space

  • setting stakeholder/user expectation

  • user interviews

  • initial design ideas/sketches

  • UI components exploration

02 Week

Design

  • Wireframes

  • Feedback Session

  • High fidelity wireframes

 
 

The Problem

The platform caters to the employees in the organization, allowing them to gain visibility of data used to summarize the growth of various sectors of the company, as well as projects and their corresponding details. The platform exists to add value to managers, who needed to filter certain information to report to management. It also allowed various staff levels to access information regarding projects and details of the project.

 
How can managers gain immediate knowledge to meaningful information that summarizes the growth of the company?
— Manager
 

The Solution

Lead engineer reported that managers were hesitant to use the platform and were resorting to their pre-existing excel sheet system. Therefore, my initial brief was to conduct UX research to understand the managers' needs and figure out how to make the platform more easily usable for their individual needs.

 

My Process

Defining the Problem

The platform caters to the employees in the organization, allowing them to gain visibility of data used to summarize the growth of various sectors of the company, as well as projects and their corresponding details. The platform exists to add value to managers, who needed to filter certain information to report to management. It also allowed various staff levels to access information regarding projects and details of the project.

Based on knowledge of existing dev team, lead engineer reported that managers were hesitant to use the platform and were resorting to their pre-existing excel sheet system. Therefore, my initial brief was to conduct UX research to understand the managers' needs and to make the platform more easily usable for their individual needs.

 
 

User Interviews (2 Interviews)

I started the discovery process by interviewing the managers to gain a better understanding of features needed to be included in the site as well as what they were having trouble with. I was able to ask them to share their screen and walk me through how they currently extract the data they require as well as how they currently use the platform.

Some Questions I asked included:

  1. Can you tell me about your last experience using this web portal?

  2. Can you tell me the biggest problem you've encountered while using this web portal?

  3. Which key tasks do you focus on when logged in?

  4. What is your alternative way of completing your task when you become frustrated with the platform? Can you walk me through that?

  5. What key pieces of information are you looking for?

  6. What key pieces of information need to be updated in real time for the dashboard information to be meaningful to you?

These conversations provided me insights to why employees were not currently using the platform even though all features were available. These included:

  • Not having a personalized dashboard/not knowing how to create a personalized dashboard

  • Confused about the overall navigation to get to dashboard

  • data within dashboard not being up to date and thus becoming unusable content

 
 

Relevant Findings

Information not being up to date

Due to data not being up to date, dashboard becomes considered unreliable and contains unusable content.

Difficulty locating appropriate dashboard

New users especially have a difficulty with figuring out the overall navigation to the dashboard and often messaged the lead developer to have him show them how to proceed.

Didn’t realize there is a personalized dashboard functionality

Even though there is a personalized dashboard feature, users seem to have difficulty realizing it is usable.

 
 

Task Analysis

Outcome: This task analysis outlines every single task & decision a manager goes through to retrieve the required information on the platform. This process flow is important because it helps identify the potential areas in which we can improve on (highlighted in blue).

 

Define the User

I created a short bio for the main persona. This was used to highlight motivations, needs, and frustrations. I then mapped through the common steps managers go through within the dashboard. This was difficult because tasks varied drastically depending on the goals of each manager.

 
 
UX Persona 3@4x.png
 
 

Ideation

Potential Solutions

After summarizing the information from the user interviews, I started sketching out different solutions to help the users.

 
 

Prioritizing Solutions

By collaborating with the product manager and devs, we discussed the various solutions and what to prioritize.

 
 

User Journey Flow

By creating a UX flow, I was able to cover all aspects of the various screens by prioritizing various features for MVP.

 
 
Frame 666@3x.png
 
 

Identifying the issues

Once I defined the current users and their current behaviour, I was able to define the issues we wanted to solve. After marking the main pain points, our team started hypothesizing solutions to make the process easier.

 
An exploration of various solutions/pathways

An exploration of various solutions/pathways

 

Refining the Design System

The UX designer who left the project had started to create components that fit into the grid and layout. I continued her work and continued creating the component library.

In our weekly meetings, we discussed the development of the design system and specific questions and feedback in regards to its components library. I also worked closely with the front end developer to ensure the design system fit their current framework. I provided QA support when needed.

 
 

Delivery

For the final design, I was able to implement these revised changes. I consolidated some of my others concerns to make the flow more succinct. As concept moved into the development phases, I worked closely with the engineering team to provide QA design review and detailed interaction design support for implementation. When there were constraints with the framework used by the engineering team and its inability to align with the design, I worked swiftly to find a solution to those issues and inform the client of the UX changes accordingly.

 
Dashboard@4x.png

Results

Overall, this portion of the redesign process was successful. 80%~ of the managers start using this feature rather than sticking with their excel sheets, and none of them requested help from the senior developer in charge of the project.

 

Future Development

This redesign was just one component of a larger redesign process. As the project evolves, we will continue understanding the various users of this platform as well as creating value for these users.

What I Learned

It is essential to consider the timeline of projects (for both design and development) before brainstorming certain features.

It is important to incorporate elements of the old design when doing a redesign project for users of the old dashboard.

 
 

My Other Projects

 

© 2024 by Jenna Yang