Background: In Spring 2020, a team of researchers at New York University partnered with Microsoft to improve the Live Share feature in Visual Studio Code. Microsoft Live Share helps users to quickly collaborate on the same codebase without the need to synchronize code or to configure the same development tool, settings, or environment. When users share a collaborative session, their teammate sees the context of the workspace in their editor.
Team Members: Nick Grant, Amy Hu, Ellen Shiu, and Muhan Guo
Role: UX Designer
First and second-year undergraduate students have difficulty with learning how to code, which may be resolved by facilitating a more seamless collaboration with others. We know we are correct when students are able to learn the basics of programming together, measured by their ability to complete assignments or onboarding tasks through Visual Studio Code Live Share.
Our team created a survey, which we circulated at NYU and posted on forums that focus on learning programming for beginners. The survey received 17 responses. They ranged from beginners to advanced coders. We found the following:
- While the majority of respondents are familiar with Visual Studio Code, they are not aware of the Live Share function.
- Over half of the respondents do not code with others.
We asked the respondents how they code collaboratively and the biggest hurdles. We learned the following:
- Coders work collaboratively with over-the-shoulder pair programming, the Discord chat, and discussing out loud while only one person types at a time.
- Users dislike the difficulty of communicating intent behind code, a partner not giving up control of the keyboard physically, and how someone may be adamant to change the code.
In the New York Education Research Trip in October 2019, 18 students and 5 professors/TAs were interviewed from CUNY City Technical College and New York University. The researchers found:
- Most students do not actively research how to use a tool, but rather learn the basics from the professor.
- The first and second-year students desire more help on errors instead of spending their time Googling.
- The first and second-year students are struggling to know if they are “doing the right thing” and seek validation that they are creating positive work.
- Almost nobody heard of Live Share.
As a result of these insights, peer programming is significant.
Students were asked how satisfied or dissatisfied they were with Visual Studio Code. Out of a weighted score of 6.4, students rated ease of use as 6.07.
Out of a weighted score of 6.2, students rated remote development as 5.44. Students also rated debugging as 5.28. Live Share may improve both of these statistics.
We created a storyboard for Tom, a college freshman who is using Visual Studio Code for the first time.
Affinity Mapping Survey Data
Based on the initial research and our own experiences with Live Share as beginners in coding, the team listed out keywords and methods to improve. Each color represents a different member. Afterwards, we grouped the notes into different categories. We concluded that when coding for the first time, guidance is often sought. Encouraging cooperation when learning to code by developing an onboarding guide would be beneficial.
We each interviewed students who have learned how to code by asking them a set number of questions. The majority of the users were coding novices. Each interviewer asked the same questions, such as their familiarity with Visual Studio Code, challenges when learning to code, methods to debug, and experiences with collaborative coding. We noticed the following patterns across all of the interviews:
- VS Code: Users do not know the existence of several functions in VS code or how they operate.
- Collaborative programming allows users to remain on the same page when coding.
- Pain point for combining separate work into a larger project.
Our team created a Miro for us to highlight our insights and found the following four groups: barriers, resources, collaborative, and working preference.
Next, we created a feature prioritization for our final prototype that we presented to Microsoft.
We created UI changes, such as the pop-up having a higher color contrast for accessibility. The Side Bar Icons have typography to indicate what the icons mean to the user.
The Live Share Hierarchy changed in terms of the following:
- Navigation from a text tree list to be icons, organized where all functionality of communication on top with the programming functions on the bottom.
- Contacts is now Participants in which the user may see who is in their session and interface more directly.
- Live Share Guide shows the user where they are during the guide. Additionally, they may revisit a section or look at more advanced areas.