Reimagining code review in Bitbucket Cloud

Working with code is a critical part of your day-to-day job. Whether you have created code and are waiting for your team's review or you're reviewing and approving code to help implement and deliver new features, pull requests are a part of your daily lives.

We've spent the year researching, user testing, and reimagining the Bitbucket Cloud code review experience. Check out the updates and changes we are launching, and our current and long term plans for adding new functionality and features to the pull request interface. 

A new code-first design

To help reviewers assess changes quickly, we've historically taken a ‘code-first’ design approach for the pull request view (reviewing and working in a pull request). Bitbucket displays the diff front and center so reviewers don't need to click around to see what's changed or to provide feedback.

Today, we're taking this concept a step further: we've redesigned the pull request view to display everything the reviewer needs on a single page, without tabs.


Through several rounds of user testing, we optimized the new design around improving navigability for the reviewer. In the new pull request experience, we’ve calculated that reviewers reduce their time-to-approve by 21% compared to the existing UI.

Below are some of the key features that help reviewers evaluate code quickly:

Sidebar with file tree and activity feed

Just like the sidebar in the new source browser, the pull request sidebar groups information into collapsible cards for quick reference at any time. One of these cards is the brand new file tree for navigating between files in the diff. Now, you can jump between files without having to scroll back to the top of the page.

Files are organized into collapsible folders in a familiar layout, and files are marked with comment counts and conflict markers so they can be addressed. If a filename is truncated, hover over the filename to reveal a tooltip with the full filename or click-and-drag the edge of the sidebar to reveal more of the tree. You can also collapse and expand the sidebar by clicking on its edge or using the ']' keyboard shortcut.













A powerful new activity feed

No more switching back and forth between the activity tab and the code. Now you can see all of the prior history of the activity feed as you're reviewing the diffs from your pull request, with an easy one-click navigation to jump you to key events that spark your interest. 

Sticky action header as you scroll

The redesigned header remains sticky to the top of the page as you scroll, which also allows you to more easily approve or merge the PR once you've finished reviewing.

Sticky file headers and file tree highlighting as you scroll

Similarly, diff file headers are also sticky to the top of the page as you scroll so you don't lose your place viewing long diffs. And to further reinforce this, the current file is highlighted in the file tree as you scroll, so it's always clear which file you're viewing.

Collapsible diffs

Each file's diff is collapsible, so you can mark your progress and reduce scrolling as you move through your review.

And each diff's side-by-side view is now available inline, instead of in a modal window.

Recent Releases and Upcoming Feature Investments

In addition to those new features, the new interface includes most of the key functionality from the existing pull request experience. However, some features have not yet been migrated but will be added soon. We've also got plans to address some highly requested improvements from users. 

Here is the approximate order in which we will be addressing these requests, ordered by what we think will have the highest impact (or reduce our technical burden by deprecating the old PR experience).

Feature

Legacy PR

New PR UI

Status

Public Ticket

Completed

Tasks on Sidebar

(minus)

(tick)

DONE


File Tree

(minus)

(tick)

DONE


Activity Feed filters

(minus)

(tick)

DONE

BCLOUD-19748 - Getting issue details... STATUS

Side-by-side diff comments

(minus)

(tick)

DONE

BCLOUD-6357 - Getting issue details... STATUS

Global PR settings(minus)(tick)

DONE

BCLOUD-19951 - Getting issue details... STATUS

Improved Big Diff performance

(minus)

(tick)

DONE

BCLOUD-7723 - Getting issue details... STATUS

Collapsible File Headers

(minus)

(tick)

DONE


Sync Branches

(tick)

(tick)

DONE


Revert Branches

(tick)

(tick)

DONE


Tasks on Comments

(tick)

(tick)

DONE

BCLOUD-19747 - Getting issue details... STATUS

Activity Feed

(tick)

(tick)

DONE


Image Diffs

(tick)

(tick)

DONE

BCLOUD-19746 - Getting issue details... STATUS

Likes

(tick)

(tick)

DONE

BCLOUD-19744 - Getting issue details... STATUS

View Whole File at Once(tick)(tick)

DONE

BCLOUD-19935 - Getting issue details... STATUS

Merge Checklist

(tick)

(tick)

DONE

BCLOUD-19745 - Getting issue details... STATUS

Single-file-mode for Big PRs(tick)(tick)

V1 COMPLETE

BCLOUD-19934 - Getting issue details... STATUS

** we're still doing some follow on work related to virtualizing the file tree.

Rolling Out
Pending Merges(minus)(warning)

IN PROGRESS

BCLOUD-20061 - Getting issue details... STATUS

Planned Work

Mark Files as Reviewed

(minus)

(minus)

DESIGNED

BCLOUD-19679 - Getting issue details... STATUS

'Needs Work' status

(minus)

(minus)

DESIGNED

BCLOUD-13021 - Getting issue details... STATUS

'Work in progress' status

(minus)

(minus)

DESIGNED

BCLOUD-12503 - Getting issue details... STATUS

Syntax Highlighting

(minus)

(minus)

WAITING

BCLOUD-8673 - Getting issue details... STATUS

Labels for PRs

(minus)

(minus)

EVALUATING

BCLOUD-11976 - Getting issue details... STATUS

Commit-based diffing

(minus)

(minus)

EVALUATING

BCLOUD-19687 - Getting issue details... STATUS

What about the old PR experience?

We have no immediate plans to turn off the old pull request experience, but are planning on launching all new features on the new pull request experience. We expect that our support for the old UI will continue to decrease over the first half of 2020. Once we've reached a point where almost everyone is on the new UI (and mostly happy with it), we will plan to turn off the old experience. 

How to leave feedback

The new experience includes a Feedback card at the bottom of the right sidebar. Let us know what you think. Customer feedback strongly informs our roadmap, so if you're missing a key feature – let us know!

The Feedback card also includes a link to temporarily see a pull request you're viewing in the old experience.

Enable the new pull request interface

  1. Click your avatar in the Bitbucket sidebar.

  2. Select Bitbucket Labs

  3. Enable the New pull request experience feature.

All pull requests will now load in the new interface.

Disable the new pull request interface

Disabling the new interface switches to the old pull request interface. If you find yourself switching back often because of a missing feature, let us know using the Feedback button.

To disable the new interface temporarily, click the link in Feedback card in the right sidebar.

To disable the new interface entirely:

  1. Click your avatar in the left sidebar.

  2. Select Bitbucket Labs.

  3. Enable the Old pull request experience feature.