GitHub Usability

Evaluating the usability of GitHub's new Pull Request experience through a comprehensive remote study

In this comprehensive usability study, I collaborated with GitHub to evaluate the effectiveness and user-friendliness of their new Pull Request experience, focusing on recently introduced UI enhancements. The study aimed to assess long-time GitHub users' learning curve and comfort in navigating the platform, complete code review tasks efficiently, and gather valuable feedback to improve the overall developer experience.

Roles

This is a research project where I wore the following hats:

  • User Experience (UX) Researcher
  • Data Analyst
  • Usability Tester
Tools

Usability Testing | Remote A/B Testing, Pre-Test Questionnaire, Post-Test Questionnaire, System Usability Score (SUS) Questionnaire
‍‍
Data Analysis | Excel

Visualization | Figma

Project Specifications

Duration | 10 weeks

Team | Collaboration with 4 classmates from Human-Centered Design & Engineering, UW

Problem

GitHub's Pull Request feature is fundamental to how teams review and improve code on GitHub.

Start a new feature or propose a change to existing code with a pull request—a base for your team to coordinate details and refine your changes.

As GitHub introduces updates and enhancements to this feature, it is essential to evaluate the usability and effectiveness of these changes to ensure a seamless and productive user experience.

Most crucially, the introduction of new UI elements and interaction patterns may inadvertently create usability hurdles, leading to confusion, reduced productivity, and user frustration.

Assessing the impact of these changes on existing users is crucial to identify areas for improvement and ensure a smooth transition to the updated experience.

Usability Study Plan

This study will examine how effectively existing users can complete essential tasks within the updated UI.

By conducting a comprehensive usability study, GitHub aims to gain insights into the strengths and weaknesses of the new Pull Request interface.

Additionally, the study will explore user attitudes towards the new interface, unveiling potential pain points, usability bottlenecks, and areas where the design may fall short in meeting user expectations or aligning with established mental models.

By identifying these usability challenges and gathering user feedback, GitHub can make informed decisions to refine the Pull Request experience, ensuring a seamless and productive workflow for developers.

Research Qs

1. Can existing users complete tasks as successfully with the new UI as the existing UI?

2. What are users' attitudes towards the new UI?

User Personas

The primary focus of the study is on existing users of GitHub who use the platform frequently for version control and collaboration.

Methods

A/B testing in a remote environment, participants played the roles of both the code author and code reviewer in a within-subjects design.

Environment

1
Remote A/B Testing

The evaluation will primarily utilize a remote A/B testing approach. Participants will perform predefined tasks using both within the GitHub Pull Request Experience.

2
Post-Task Feedback

After completing the tasks assigned during each scenario, participants will provide open-ended feedback, insights, and any challenges encountered to inform the evaluation process.

3
SUS Questionnaire

After completing tasks within each scenario, participants will complete the SUS questionnaire. This will help gather quantitative data on participants' perceptions of usability, effectiveness, and learnability of both the UIs.

Scenario 1: Code author tasks

Finding a comment
Resolving a comment
Seeing who reviewed your PR
Checking merge status

Scenario 2: Code reviewer tasks

Posting a comment
Posting a reply
Suggesting changes

Data analysis

We recorded each session to capture participants' live interactions with the interface, to aid analysis and gain valuable insights. Additionally, interviews and questionnaires following scenarios enhanced our understanding of the user experience.

Data Collected

We focused on collecting both quantitative and qualitative data from our participants.

Overview | Quantitative

All participants completed every task successfully, however, some tasks proved to be more challenging and error-prone than others.

Task completion rate
100%

While all participants finished the tasks in both the old and new UI, a few attempts were made for tasks in the new UI.

System usability Score
67/100

The System Usability Scale (SUS) scores showed clear differences between the existing and new UIs, with the existing UI scoring higher at 77 compared to the new UI's 67.

High Priority Findings + Recommendations

2 key discoveries and actionable recommendations

Exisitng UI
New UI

Finding and posting a comment

50% users faced difficulties locating the comment widget in the new UI.

The position of the comment widget moved from the extreme left (existing UI) to the extreme right (new UI) causing pause and confusion in users.

Additionally, a lack of contrast between the avatar and the background when in light mode raised visibility issues for the comment widget.

Recommendations

  • Enhance the visibility of the comment widget by adjusting contrast of avatar colors.
  • Improve discoverability of the comment widget by positioning the option more prominently
  • Consider maintaining consistency with the existing UI by placing the comment widget on the left side for better user familiarity and ease of access
Exisitng UI
New UI

Resolving a comment

67% users faced difficulties resolving a comment in the new UI.

The resolve icon is gray in color and seems unintuitive and "disabled" to users until they hover over it and see the tooltip that says 'Resolve conversation'.

Recommendations

  • Enhance visibility by using a distinct color (like green) for the resolve button/icon to indicate its active state
  • Maintaining text in the button to assist users in understanding the functionality of each interface element

There's more to check out.