Visual Studio Code Live Share Onboarding Guide
In Spring 2020, Microsoft partnered with New York University to optimize
the user experience of Visual Studio Code for new programmers. These are
some of the questions that we were asked from Microsoft: How can we
make learning to code more accessible for students? What does an educational version of VS Code look and feel?
Visual Studio Code
Visual Studio Code is a freeware source-code editor made by Microsoft for Windows, Linux and macOS. Features include syntax highlighting, support for debugging, intelligent code completion, snippets, code refactoring, and embedded Git.
The Life Share function allows users to collaborate on the same codebase without the need to synchronize or 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.
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.
In order to have a better understand the difficulties in learning coding, our team created a survey. We circulated the survey at NYU and posted on forums that focus on learning programming for beginners.
Key Findings: 80 percent of users found Visual Studio to not be friendly for beginners. 80 percent of users prefer doing research by themselves rather than asking people for help. New coders spend time struggling to know if they are “doing the right thing” and seek validation that they are creating effective work.
In Microsoft’s 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. We analyzed the research provided to us by Microsoft, pulling key statistics that highlight pain points. Key Findings:
Researchers found that students were most satisfied with the visual appeal and least satisfied with remote development and debugging.
Affinity Mapping: Survey Data
Our group acquired hands-on experience with Live Share and created post-it notes of all of our insights directly related to the difficulty in collaborating in Visual Studio Code. We learned during our own experience of downloading Visual Studio Code that the information is scattered and rather confusing. Users are unable to navigate the software at first without watching long tutorials on their official page.
Afterward, we created a feature prioritization and storyboard that outlines the issue from a user perspective. We prioritized the features that are more crucial than others. After discussion, we all agreed that Adobe Creative suite performed well with onboarding and may serve as inspiration, such as the step-by-step guides and animations.
Live Session Start
2. Side Bar Icons have text to indicate what the icons mean to the user.
3. Removed the Welcome page to filter advanced functions and prevent confusion.
Live Session Start - Invitation Link
2. Contacts is now Participants, where user could see who is in their session and interface with them more directly.
3. Created higher contrast for pop-up notifications and removed the “More info” button.
1. Created 10 steps of onboarding guidance for new users.
2. Live Share Guide shows the user where they are during the guide and if they may revisit a section or look at more advanced areas.