Backoffice is an administrative web-based platform for interacting with user account data, designed primarily for technical support employees. We created a new product from scratch, an end-to-end design process

I joined the project when there was already the first version of wireframes. After seeing the UX problems of the current solution, I convinced the teams to return to the exploration phase. I managed to put together a new interface using various qualitative research methods and other product design instruments. As a result, we reduced the processing time of customer requests by 4 times

Before the platform was created, there was no single tool for working with user data. Support staff and managers collected customer information from 5 different sources, which was time-consuming and resource-intensive. Sometimes when users contacted the support team, we knew almost nothing about who contacted us and the reasons for the problems on the user's side

PROBLEM

I was connected to this project when the first version of the prototype was already assembled in Axure. After a Heuristic review, I came to the conclusion that this prototype was built with UX errors, it looks very difficult and I will be able to put together a simpler and more understandable interface. Although initially I was asked to do a UI design, I asked for more time to work through this task and convinced the team to return to the stage of studying user problems and their needs

A quick look at the first version of the Backoffice

An example of a flowchart created

INITIAL WIREFRAMES

I started to study the most frequent support requests, conducted interviews with technical support staff, managers, analysts, and discussed with them the tasks they perform and what problems they solve. Systematized the information received into a project wiki

Wiki pages

DISCOVERY

After studying the documentation and conducting interviews with stakeholders, it was possible to describe the main processes of the support team and their interaction with managers and analysts. These scenarios formed the basis of a new information architecture, which I will discuss further

MAIN SCENARIOS

The analysis of available information opened the possibility of moving away from grouping information by tasks to grouping by meanings in order to scale easier the application and not load an employee with a large amount of data at a time, one of the main problems of the first prototype

Based on the new architecture, we began to design modified layouts, validate solutions within the team, using the axure prototype as a "Control Group" and comparing the execution of scenarios inside it and inside the LoFI prototype of the new interface. One section “Player ID” was taken as MVP

The result of the previous stages has been translated into a Figma prototype. I wrote a test script and then remotely tested the new interface with 5 end users. As tasks, we used examples of frequent user support requests

The affinity mapping technique helped us to cluster observations into specific to figure out what we need to focus on and form a backlog of tasks before the first release and for subsequent ones. Fortunately, the problems did not turn out to be critical, and some difficulties were related exclusively to the limitations of the prototype

WIREFRAMES

USABILITY TESTING

BACKLOG

Examples of new data grouping, new wireframes and team meetings

One of the calls made

Backlog of tasks for the first and second release

Edits and improvements made after testing allowed us to move on to visual design, working out the rules for constructing interface elements (tables, forms, indentation systems, etc.), as well as working out edge cases within the platform

Our team was able to put together a tool that is already used on an ongoing basis. We have reduced the processing time of customer requests by 4 times and, accordingly, increased the number of requests that can be processed in one shift. We have automated the receipt of statistics, thereby freeing up the additional time of managers and analysts which can be used for other tasks. Now I continue to refine the interface and draw new sections, in the near future we will roll out new functionality for working with documents and communicating with our users within the framework of bonus mechanics / technical messages of the company

VISUAL DESIGN

RESULTS