In a long-overdue overhaul, I was tasked with redesigning the user interface of the internal bug tracking system while the client upgraded the back-end data structure and APIs.

Dissecting the existing product

Before beginning a full overhaul of the existing information architecture and system, I needed to understand the purpose, field usage and overall bug triage process to determine how to provide the right details at the right time. I participated in all but a few interviews and assisted in the analysis of user needs.

As a designer and researcher pair, we were able to document the company-specific process of fixing software bugs in a service blueprint diagram. This enabled us to show our client when key roles where involved and what their key tasks were. In a concurrent work stream, I conducted reviews of competitor issue tracking software such as Jira and Github, while also analyzing the existing system, field-by-field.

A snippet of the form field analysis.

A snippet of the form field analysis.

The Desired Experience

BURT design principles from client team discussion.

BURT design principles from client team discussion.

I also facilitated a discussion with the core client team to understand what direction they wanted to take the product into. This revealed a good deal about where they see pain points and helped guide our research.

Drawing the lines between research & Design

I worked with a researcher to shadow 19 ethnographic-style interviews and a survey sent to BURT software users, resulting in 325 responses about product satisfaction and pain points.

Summary of journey pain points and relevant design principles to solve them.

Summary of journey pain points and relevant design principles to solve them.

PROPOSING NEW CONCEPTUAL MODELS

With a greater understanding of the user journey and design principles in hand, I developed new conceptual models for three major areas of the product: the central dashboard, bug detail screen and query bugs screen. 

Choosing a navigation Philosophy

In the existing detail page, the form fields existed in a single scrolling page. 

It was clear from research that areas needed to be organized in order to appeal to the “job to be done” by a particular user type. I proposed two solutions: 1) create clear sections but keep within context of the rest of the BURT information, or 2) provide sections tailored to the state of the bug, so that users could have a focused view.

While the team agreed to move forward with the tab view to “manage the mess”, we needed to revisit the concept due to technical limitations around form submission. Ultimately we has to return to the sections concept, but provide additional navigation as anchor links to ensure that users could jump to what they needed. 

DYNAMIC PROTOTYPING IN AXURE

Because of complicated form dynamics and page relationships, I used Axure even during low-fidelity sketching and implemented more complex logic for high-fidelity wireframes of key workflows. This enabled the client to test drive design suggestions and provide substantiative feedback.

Dashboard prototype low-fidelity (left) and high-fidelity (right) wireframes

Detail page prototype low-fidelity (left) and high-fidelity (right) wireframes

VISUAL DESIGN & IMPLEMENTATION

I collaborated with a visual design team to create visual mockups and specifications. I also provided UX support during the implementation phase, led by a development firm. I provided guidance on area where design patterns need to be adjusted to accommodate for certain content types.

Client
Duration
Role
Team

Detail page high fidelity wireframes (left) and visual design reference page (right)