Persuading Dev Teams to Prioritize UX

Case stu y exposure is limited by NDA

Summary:

Reworked a data driven SaaS web portal to become user focused. Streamlining user workflows, exposing key data, to increase engagement.

The Challenge

When I joined BroadSoft I was there to fulfil the roll of designer and front end developer. I was presented with their current SaaS (Software as a Service) web portal and asked… ‘Can you make this look better?’

With this question the stakeholders revealed that there was a larger issue at hand.

Wanting to understand the product I conducted a Heuristic Evaluation of the SaaS portal, this process is based on the NN/g 10 usability heuristics. The process was a quick one going through the portal and making notes of where it would fail to meet the heuristic standard. What this quickly revealed, was that they didn’t need to make the application look better, they needed it to work better.There were a number of issues with recognition, efficiency, aesthetic, consistency, etc. There were a lot of UI issues, however, primarily it needed to be taken from a data centred design (one which comes very naturally to developers) to a User Centred design that would cater on providing a delightful, efficient and streamlined CX interaction with the user.

My suggestion of a redesign was not met favorably.

They had their process established and were used to acting quickly, in short waterfall type bursts. Requirements would come from management with a quick sketch of what they thought it should look like. These requirements would then be fleshed out and passed on to the dev team. The Dev team would then split the tasks into front end / back end and would execute. The UI was put together using Google’s Material design system (a good starting point for a cohesive looking website) and was mostly a CRUD (Create, Read, Update, Delete) reflection of the database data.

In short, very little time was spent developing a good UX. They were happy with their process and didn’t want to make space for proper UX development. They were looking for ‘quick wins’ via ‘make it look better’.

The Process

The first thing that had to happen, before even getting to the website was to show them a better way. They needed to see the value of a well-developed UX site. In order to do this, I decided to work out the proper solution in parallel to the 'quick win' solutions they were looking for.

Discovery

To re-haul the application I started with research into the existing offering and looking into the existing customer base.

Who were the customers, belonging to what organisations? I shadowed users to see their thought process. I conducted interviews looking to distill their needs, looking for pain points in the offering. What was missing, what were their top asks? I looked at the data, was anything missing or incorrect? I looked at analytics; looking for patterns, what were the most visited pages and by what type of customer? Any trends, perhaps dependant on time or location? What did the analytics reveal?

Synthesis & insights

Taking the research, I proceeded to organise the information, searching for conclusions that would lead to a targeted User Experience.

I started by looking at what we already had. The Heuristic Evaluation done previously was a good starting point. I took some of what I learnt, identifying business goals, looking at the data and understanding their match in the real world.

I started by creating a couple of personas, both were identified as people very high in technical knowledge; one in a support role and one in a setup role, they both approached the application in slightly a different way, one using a more customer-oriented approach and language while the other was more data driven requiring more detail and complexity.

Cards were used to identify the key sections of the SaaS portal, and how these sections were being used. I identified that depending on the Persona these would vary slightly.

I built flow maps to visualise how the users were navigating the application. With the help of the carding, I distilled the ’tasks’ into golden paths.

I put together data maps to visually identify the data connections. I looked at what data the users would access while going down the golden paths and information they would need to see to evaluate and enrich their engagement (dashboards, charts, stats).

I looked at the asks from the users directly without the filter of management and noticed many of the asks had been discarded as they were not in line with business goals, however they did have value and so tried to evaluate them from the user perspective.

Location would also play a factor, with worldwide clients, language would need to be addressed.

Accessibility was something that had been looked at but there was still some improvement to be done to address x-linked recessive conditions such as red-green colour blindness and haemophilia.

Ideation

Lo-fi sketches were used to pull it all together.

First, I created the main menu, based on the gathered data card information, I created a hierarchical feature list.

From there I concentrated on golden paths, ensuring that the two Personas would have fluid workflows. The main user journeys would be of discovery (current data tables), analysis (dashboards), and tasks, (CRUD). I looked at the flow maps and built the feature list around them prioritizing business goals but including many valuable user requests. As a secondary priority I tried to build in some flexibility to allow the user to have freedom and control.

I identified what technical language terms the users would use and ensured that they were covered with tooltips to give further guidance if needed. Multiple languages brought in their own challenges, while I didn’t cater for right-left script I did ensure enough flexibility for different word lengths in different languages.

The UI was built following BroadSoft's design system guidelines and elements. I addressed the improvements necessary for accessibility, and created any missing assets that were not covered by the design system. I leaned into UX best principles of layout, spacing, sizing, error handling, discoverability, distance, etc. I concentrated on recognition rather than recall.

The Result

Final hi-fi mock-ups and prototypes were created to present my work to management. It went well. They suddenly could compare their current offering with what I had produced. They appreciated that my proposal with a good UX not only displayed the information but was so much easier to navigate, how the features were so much more discoverable and how completing tasks flowed so much better, saving time and providing a wealth of information along the way.

They approved the rebuild based on my designs.

Close