Reduce developer onboarding time and cognitive load when navigating complex GitLab issues with a new context pinning feature

GitLab is an open-source platform built on Git, the distributed version control system. It offers a comprehensive suite of tools for managing repositories, project planning, continuous integration/continuous deployment (CI/CD), code reviews, issue tracking, and more.

In the spring of 2024, I collaborated with GitLab’s UX team - including senior product designers, UX researchers, product managers, and engineers - for my Human Factors Psychology Capstone Project. My UX challenge centered on streamlining developer onboarding: when receiving a task in the form of an issue, developers often lose time digging through lengthy threads and scattered discussions to understand their next steps. Working in a team of 4, I led the design of a new context pinning feature aimed at reducing onboarding friction and helping developers quickly orient themselves within new GitLab issues.

Date

Jan 2025 - May 2025

Role

Product Designer

Skills

UX Design, Visual Design, User Research, Concept Testing, A/B Testing

Team

1 Project Manager, 2 UX Researchers, 1 Product Designer (me)

⎯   ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩   ⎯

TL;DR

The project at a glance

⎯⎯⎯

What is GitLab issue?

Issues help contributors collaborate with the team to plan, track, and deliver work in GitLab. One of the use cases of it is to facilitate team discussion and decision-making through comments and threaded discussions.

The redesign of the MWG Loyalty App improves engagement at three levels:

  • Micro: Focuses on moment-to-moment experiences, optimizing the homepage for easier navigation and access to key features.

  • Meso: Enhances user journeys, providing clearer information on point accumulation and redemption.

  • Macro: Strengthens long-term engagement with a newly proposed tiered loyalty program that rewards users for their continued use, increasing retention and Monthly Active Users (MAU).

—————————————————————————————————————————————————-

————————————————————————————————————————————

—————————————————————

The Problem

THE CURRENT GITLAB ISSUE BOARD SLOWS DOWN DEVELOPER ONBOARDING

Developers waste time and risk misalignment when onboarding themselves to new issues as they jump between multiple discussions, scan through lengthy threads, and manually piece together decision trails.

Developers waste time and risk misalignment when onboarding themselves to new issues as they jump between multiple discussions, scan through lengthy threads, and manually piece together decision trails.

Pain point: lengthy thread

Pain point: lengthy thread

It is overwhelming to click through numerous ancestor links and understand how the current issue relates to other issues.

Endless scrolling …

Pain point: complicated issue dependancies

It is overwhelming to click through numerous ancestor links and understand how the current issue relates to other issues.

Pain point: complicated issue dependancies

It is overwhelming to click through numerous ancestor links and understand how the current issue relates to other issues.

What are the relationships between the blocking issues and related issues?

—————————————————————————————————————————————————-

————————————————————————————————————————————

—————————————————————

The Solution (demo)

A NEW WAY TO GATHER NEW CONTEXT

The pinning feature helps users stay updated on the most relevant discussions by having a section for important comments. Clicking a pin instantly navigates users to that comment in the discussion thread.

The pinning feature helps users stay updated on the most relevant discussions by having a section for important comments. Clicking a pin instantly navigates users to that comment in the discussion thread.

—————————————————————————————————————————————————-

————————————————————————————————————————————

—————————————————————

⎯   ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩   ⎯

Let's backtrack a little

Validating the problem with research

⎯⎯⎯

Together with my team, I conducted 10 interviews with internal and external GitLab users

1.

It can take any time from a couple of minutes to days for users to fully understand the issue depending on the complexity

Austin, Staff Product Designer

"Sometimes the issue is not as straightforward as it might seem, and you commit to something that is really like a trapdoor, and you start working on something that you think is going to take maybe half a week or a full week. All of a sudden, there are so many other components to it that weren't visible at the beginning."

"Sometimes the issue is not as straightforward as it might seem, and you commit to something that is really like a trapdoor, and you start working on something that you think is going to take maybe half a week or a full week. All of a sudden, there are so many other components to it that weren't visible at the beginning."

2.

There are many hyperlinks/ ancestor links, so the user needs more time to find more context on previous issues

Alyssa, Product Designer

"There are always parallel ongoing discussions about related issues. And so then sometimes you end up in a rabbit hole discussion about a feature that tangentially touches another feature or a vision roadmap that is interfering with another one, and you have to figure out what to do."

"There are always parallel ongoing discussions about related issues. And so then sometimes you end up in a rabbit hole discussion about a feature that tangentially touches another feature or a vision roadmap that is interfering with another one, and you have to figure out what to do."

3.

When the project summary is not updated, it is hard to onboard onto an issue when there is little context or updates

Thomas, Staff Fullstack Engineer

"You would have 20, 30 long comments shifting the requirements. And then somewhere towards the end of this comment stream, you find this is the final requirement for the issue, and it doesn't match the description."

"You would have 20, 30 long comments shifting the requirements. And then somewhere towards the end of this comment stream, you find this is the final requirement for the issue, and it doesn't match the description."

Through affinity mapping, we group the problem areas into 3 main themes:

Navigation

There was complexity in navigation, which was due to scanning through links, code files, other issues, and even people to get further clarification from

There was complexity in navigation, which was due to scanning through links, code files, other issues, and even people to get further clarification from

Lack of context

It wasn't immediately clear where an issue lies within the broader goals or project, or because the description did not contain enough updated information

It wasn't immediately clear where an issue lies within the broader goals or project, or because the description did not contain enough updated information

Information Overload

The long discussion threads and the long scroll format of an issues page

The long discussion threads and the long scroll format of an issues page

Which then came down to 2 paths moving forward:

HOW MIGHT WE #1

How might we make it easier for users to see the most relevant discussion comments?

How might we make it easier for users to see the most relevant discussion comments?

How might we make it easier for users to see the most relevant discussion comments?

HOW MIGHT WE #2

How might we improve the process of understanding the relationships between ancestors, child items, linked items, and epics?

How might we improve the process of understanding the relationships between ancestors, child items, linked items, and epics?

How might we improve the process of understanding the relationships between ancestors, child items, linked items, and epics?

The 1st one focused on the problem of lengthy discussion threads, while the 2nd one focused on the problem of navigating between different issues pages.

The redesign of the MWG Loyalty App improves engagement at three levels:

  • Micro: Focuses on moment-to-moment experiences, optimizing the homepage for easier navigation and access to key features.

  • Meso: Enhances user journeys, providing clearer information on point accumulation and redemption.

  • Macro: Strengthens long-term engagement with a newly proposed tiered loyalty program that rewards users for their continued use, increasing retention and Monthly Active Users (MAU).

⎯   ⋆˚✿˖ °𐙚 ⊹ ࣪ ˖ ᡣ𐭩   ⎯

Problems defined, let's move on to…

Ideation and Testing

⎯⎯⎯

Concept Testing

Through Crazy 8's Ideation, we came up with 2 concepts for the 2 HMW statements. I led the design for the initial concept prototypes.

The redesign of the MWG Loyalty App improves engagement at three levels:

  • Micro: Focuses on moment-to-moment experiences, optimizing the homepage for easier navigation and access to key features.

  • Meso: Enhances user journeys, providing clearer information on point accumulation and redemption.

  • Macro: Strengthens long-term engagement with a newly proposed tiered loyalty program that rewards users for their continued use, increasing retention and Monthly Active Users (MAU).

Concept #1: Pinning Feature

Concept #1: Pinning Feature

The pinning feature helps users stay updated on the most relevant discussions by having a section for important comments. Clicking a pin brings a user to the comment's origin in a discussion thread, providing an easier path for gaining context through these relevant discussions.

Concept #2: Linked Tree Diagram

The linked tree diagram helps users navigate related issues to gain context. It's located next to the list of child, linked, and merge requests. Clicking on an issue bubble takes you to the issue's page, where a block is indicated if it exists.

Pain point: complicated issue dependancies

It is overwhelming to click through numerous ancestor links and understand how the current issue relates to other issues.

Through testing with 5 internal and external GitLab users, 4/5 prefer the pinning feature!

External Gitlab User 1

"I can immediately see the highlights or the main problem for this issue, which I think is a very good feature that I would actually go and use."

External Gitlab User 2

"It just makes my life a lot more easier now I don't have to find those information, I can just directly find it from here and then either reach out to the person or take a deeper look at the issue from the section."

—————————————————————————————————————————————————-

————————————————————————————————————————————

—————————————————————

Problems defined, let's move on to…

Design Iterations and Testing

⎯⎯⎯

Full case study is coming soon ☺ Contact me at an.tran140203@gmail.com for more information!

Next Project

Overview

TLD;R

Problem Validation

User Testing

Design Iterations

Final Solution

Reflections