In Pursuit of Enjoyable Developer Collaboration
Tags: productivity, vscode, collaboration, webdev
Published: 2019-03-16 22:34:47

---
title: In Pursuit of Enjoyable Developer Collaboration
description: 
published: true 
tags: productivity, vscode, collaboration, webdev
cover_image: https://quotation.io/quotes/want-go-fast-go-alone-want-go-far-go-together.jpg
series: Visual Studio Live Share
---

Collaboration is **critical** for any successful development team. That's a fairly uncontroversial opinion, and definitely not novel. Whether you're mentoring someone, providing a code review, lending a helping hand with a difficult bug, or just doing regular pairing, it's important to encourage continuous knowledge transfer (in all directions!), and support a culture of shared ownership and team cohesion. That said, there are [plenty](http://github.com) [of](https://ryanlue.com/posts/2018-01-13-pair-programming-over-ssh) [existing](https://products.office.com/en-us/microsoft-teams/group-chat-software) [tools](https://en.wikipedia.org/wiki/Virtual_Network_Computing) and [processes](https://en.wikipedia.org/wiki/Pair_programming) to help developers collaborate, so why create *yet another one*?

When we set out to build [Visual Studio Live Share](https://aka.ms/vsls), we learned that teams collaborate in [very diverse ways](https://aka.ms/vsls), with unique and meaningful perspectives about how it works most effectively for them (e.g. frequency of collaboration, session duration, whether it happens ad-hoc vs. scheduled). We didn't intend to ask teams to change how they already work, but we were interested in *complementing it*. In particular, we discovered a few ways that developer collaboration could potentially become more **enjoyable**, and ultimately, more **productive**, regardless if your team is fully remote, partially distributed, or entirely co-located. Let's see what I mean!
 
## Sharing context, not screens

As developers, we spend countless hours customizing our environment, tuning it to be more ergonomic and visually appealing. Everything from your OS preference, default shell, editor theme, keybindings, window layouts, and font size contribute to an experience that makes your workflow feel "just right". So the idea of sacrificing (or inflicting 😊) those personalizations, in order to do something as fundamental as collaboration, seems...kind of silly.

<!--{% twitter 1101107279019929600 %}-->

With Live Share, participants can collaboratively edit and debug a shared codebase in real-time, while **retaining their individual machine setup** (from either Visual Studio or Visual Studio Code). Prefer a light theme, while everyone else on your team favors dark? Great! Does your pair use Vim keybindings, and you'd...rather not? No problem! Do you prefer to align the file explorer on the right-side of your IDE, increase your font size, hide the status bar, render whitespace and/or display the minimap (among many other decisions)? Keep doing that! And let the rest of your team keep all of their preferences as well. Everybody wins 👍

<img width="1172" alt="Screen Shot 2019-03-10 at 2 51 13 PM" src="https://user-images.githubusercontent.com/116461/54091982-fabbeb00-4343-11e9-927e-c70b98fe0a43.png">
<figcaption>Two very different VS Code configurations, comfortably collaborating together</figcaption>

This experience works because Live Share is simply synchronizing the project context (e.g. files, edits, debugging state, localhost servers) and user positions (e.g. cursor, highlights), while leaving everything else intact. Each “guest” in a collaboration session is leveraging the runtime environment of the developer who shared, but **viewed through the lens of their own world**. This may seem like a subtle win at first, but when collaboration happens daily or weekly, it quickly adds up.

{% twitter 1275476182377598976 %}

Besides **decoupling screens**, Live Share also enables everyone in a session to have entirely different keyboard layouts, which is important for geo-distributed teams. So you could have developer’s collaborating, using a combination of [QWERTZ](https://en.m.wikipedia.org/wiki/QWERTZ), [QWERTY](https://en.m.wikipedia.org/wiki/QWERTY) and/or [AZERTY](https://en.m.wikipedia.org/wiki/AZERTY) keyboards, and everyone can edit freely, without any unexpected behavior. This works because everyone is actually editing locally (unlike screen sharing), which allows their keystrokes to be handled properly, before being synchronized with the group.

Another key benefit of the fact that edits happen locally, is that you won’t experience any of the latency associated with screen sharing. Since editing is the most latency-sensitive operation we perform, having collaboration tools that optimize for that is critical for both productivity and long-term satisfaction.

{% twitter 1163167349207445506 %}

## Collaborate together, but [think different](https://en.wikipedia.org/wiki/Think_different)

Two (or more!) minds are often greater than one, because diverse perspectives can help break down problems more quickly, and produce better results (e.g. less “clever” abstractions). Collaborating via a shared screen/projector has the benefit of keeping everyone focused on the exact same thing (e.g. a method implementation), but it also has a potential downside: it limits participant's ability to explore independent ideas, without disrupting the entire group. Even if you're using a solution that supports multiple cursors, everyone is still fundamentally locked to the same screen, and therefore, limited in their ability to *think on their own*, or at *their own pace*.

   {% twitter 1096623368902754305 %}

With Live Share, participants are collaborating on a shared codebase and runtime environment, but are able to seamlessly transition between [focusing on the exact same thing, and working independently](https://docs.microsoft.com/en-us/visualstudio/liveshare/use/vscode#following). Furthermore, Live Share even supports a hybrid model, where you can temporarily edit separate files (or sections of the same file), while continuing to observe each other at the same time. 

<img src="https://user-images.githubusercontent.com/116461/54481058-43b0eb00-47ed-11e9-8d2b-53161bf68bf5.gif" />
<figcaption>Two developers, editing separate files, while being able to passively observe each, and re-focus their attention when needed</figcaption>

Whether you want to parallelize a task (e.g. you write a test and your pair writes the associated code), look at different stack frames while debugging, or simply peek the definition of a method you’re not familiar with, Live Share enables a form of collaboration that isn’t **mentally serialized**. You can choose whether to focus together, divide and conquer, or somewhere in between. The decision about which model works best is up to you and your team, and Live Share is simply there to enable it 👍

{% twitter 1241839125042532355 %}

> View [this post](https://aka.ms/vsls-modality) for more details on multi-modal collaboration.

## Code-centric communication

There are plenty of great chat tools out there, and Live Share was built to compliment whichever one(s) you and your team are already using. However, most of these tools were built to facilitate conference calls and presentations, not to enable **efficient discussions about code**. As a result, while they work great for keeping your entire organization in touch, they don't provide an experience that's optimized for distraction-free, developer "flow".

With Live Share, you can simply share your current workspace, and begin chatting with your guests using integrated text and voice support. There's no need to coordinate the use of a separate service, or context switch between different apps. Just remain in your editor and begin communicating and collaborating as neccessary! 

   {% twitter 1075155769870307329 %}

Furthermore, while you're collaborating, it's likely that you or others will have questions about specific section of code. To make it easier to **talk about code**, Live Share allows you to click on any line in the shared project, and add a rich, Markdown-enabled comment to it. This way, you can communication effectively at all levels of detail, without needing to explain or re-create the context that your editor already provides.

> View [this post](https://dev.to/lostintangent/you-can-t-spell-collaboration-without-communication-2a3o) for more details on Live Share's integrated communication support.

## Real-time editing, and beyond!

Developers often refer to Visual Studio Live Share as being like “Google Docs for Code”, which is understandable, since it provides a real-time collaborative editing experience, with shared cursors and highlights. However, in order to enable developer collaboration, that can scale from the simplest situations (e.g. a quick code review), to the most complex (e.g. group debugging a site incident), we found that we needed to support much more collaborative context than simply files and edits. We needed to enable collaboration that was truly **end-to-end**, and didn’t require developers to turn to another tool or service in order to progress a collaboration session forward.

With Live Share, developers start by sharing their entire project context (just click the `Live Share` button!). This gives participants access to the entire codebase, as opposed to needing to exchange code snippets back and forth (which is a painful way to collaborate!). From there, it enables you to share as much or as little as needed, in order to satisfy the requirements of your specific collaboration session. That way simple situations are simple, and complex situations are...simple as well. Humor me as I illustrate this via a parade of tweets:

* Need to debug through some code? Cool! Just press F5 and everyone will be automatically attached to a [shared debugging session](https://docs.microsoft.com/en-us/visualstudio/liveshare/use/vscode#co-debugging) (that's running on the host's machine!). 

* Need to illustrate a failing test or run a diagnostic command? Great! [Open up a shared terminal](https://docs.microsoft.com/en-us/visualstudio/liveshare/use/vscode#share-a-terminal), and everyone in the session will automatically see it.

   {% twitter 1021829949760495616 %}

* Do guests need to see a running web app in order to understand a bug or validate a fix? Simply [share the localhost server](https://docs.microsoft.com/en-us/visualstudio/liveshare/use/vscode#share-a-server) on your machine, and everyone can immediately access it, using the secure SSH channel that Live Share already establishes.

   {% twitter 1077984816782397440 %}

* Want to do a code review, but in real-time? Guests can access the state of the [Git repo](https://code.visualstudio.com/Docs/editor/versioncontrol#_git-support), and if you're using the [GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens) and/or [GitHub Pull Request](https://marketplace.visualstudio.com/items?itemName=GitHub.vscode-pull-request-github) extensions, they are fully shared as well!

   {% twitter 1093950344239837184 %}

* Want to explain something visually? Check out the [collaborative whiteboard](https://marketplace.visualstudio.com/items?itemName=lostintangent.vsls-whiteboard) and start drawing together.

   {% twitter 1079846355290415104 %}

* Want to provide a guided walkthrough of a codebase, using a pre-prepared "tour" (almost like a developer-optimized PowerPoint!)? Check out the [CodeTour](https://aka.ms/codetour) extension, and start sharing your knowledge!

   {% twitter 1289712637652082691 %}

* Want to make sure everyone you collaborate with gets proper Git attribution? Live Share will automatically generate your commit [message trailers](https://help.github.com/en/articles/creating-a-commit-with-multiple-authors).

   {% twitter 1071522731810672640 %}

* Do you use the [Pomodoro technique](https://en.wikipedia.org/wiki/Pomodoro_Technique) for time management, and want to continue using that while collaborating? The [Live Share Pomodoro](https://aka.ms/vsls-pomodoro) has you covered 👍

    {% twitter 1115847842453762049 %}

* Need to browse documentation together, such as looking up code samples, or following along with a tutorial? Grab the [Browser Preview](https://marketplace.visualstudio.com/itemdetails?itemName=auchenberg.vscode-browser-preview) extension and begin collaboratively browsing together.

    {% twitter 1116362646784102400 %}

And that's only the tip of the iceberg. While Live Share comes with a bunch of functionality out of the box, it's also [fully extensible](https://npmjs.com/vsls), and has a growing [ecosystem of extensions](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack#user-content-recommended-extensions) that are building on top of its collaborative platform (e.g. [time tracking](https://twitter.com/brettmstevens/status/1103809321702313984), [shared test runners](https://marketplace.visualstudio.com/items?itemName=hbenl.vscode-test-explorer-liveshare)). We're constantly looking for new opportunities to engage the community, since that's the only way to to sustain a collaboration experience that accommodates the moving target that is "modern" development.

> View [this post](https://dev.to/lostintangent/building-a-collaborative-development-platform-5c34) for more details on Live Share's extensibility and ecosystem.

## We’ve only just begun

So in summary: [Visual Studio Live Share](http://aka.ms/vsls) enables developers to collaborate in real-time, using their own personalized environments, working together and/or fully independently, all while being able to share the holistic set of project context (you can [whiteboard](https://aka.ms/vsls-whiteboard) for heaven's sake!). We've found that this combination of experiences can enable a pretty useful form a collaboration, and may actually mitigate some of the [frustrations](https://dev.to/mortoray/why-im-not-a-fan-of-pair-programming) that some devs have with traditional tools and processes.

That said, we're only just getting started, and so we look forward to continuing to learn more about developer collaboration, and in particular, how we can contribute to making it a more enjoyable experience. Considering how critical collaboration is, that seems like a pretty worthy pursuit.

<img src="https://user-images.githubusercontent.com/116461/43758228-4e97c3c0-99d0-11e8-9208-84e1f0e3b211.gif" />