Solution validation - WebIDE: combine Review and Commit tabs into one
What’s this issue all about?
Validate the solution that would work for combining the Review and Commit tab of the WebIDE into one experience.
Who is the target user of the feature?
The following attributes are ideal to have for the participant screener
- User of GitLab
- User does code reviews
- Has used an online IDE in the past 6 months
What questions are you trying to answer?
- Would the combine view help users focus in on the files that have been changed in the same way or better than the "Commit" tab?
- Would users navigating from a merge request to the WebIDE understand which state of "editing" or "reviewing" they are in?
What assumptions do you have?
- We don't need to have the full-size navigation tree when reviewing an MR (link)
- When reviewing in the WebIDE we should focus on a view with a list of changes
- Users are confused about which files are part of the merge request when entering the WebIDE from a merge request
- Users understand the icon system we have at the moment for the following
- Modified
- Added
- Part of merge request
- Simplifying experience to 2 tabs of
Files
andChanges
will make the experience easier to understand compared to the current 3 tabs ofEdit
,Review
, andCommit
.
What hypotheses do you have?
Hypothesis | Testing | Observing | Comment |
---|---|---|---|
Providing a navigation tree for users when reviewing an MR will help them understand the structure and location of the files are in the repository | When users are placed into the WebIDE in review mode, we will present the files with changes a list and ask to the user if they can verify the folder that a file that is under a parent folder is in | Users will struggle and go to the file tree or back to the merge request page to check the file tree structure | #1266 (comment 551552525) |
Showing the path of where the file is in the repository when listing the files changed in the merge request will help users for better scanability | When users are placed into the WebIDE in review mode, we will present the files with changes a list and ask to the user if they can verify the folder that a file that is under a parent folder is in | Users will be able to identify the folders of each file without navigating away from the "Changes" list | #1266 (comment 551552525) |
The current method of using icons to visualize what needs to be reviewed is complex | Show current icons and ask users what they think each one means in the context of reviewing code | Assessing the clarity of the current icons. Track the success rate of matching meaning to icon. Hypothesis would be correct if less than 50% of the participants will get all of the icons correct | #1266 (comment 551565385) |
Allowing users to view the current changes that are part of the merge request will help with reviewing changes in the Web IDE | When users are placed into the WebIDE in review mode, we will default the view to show the "Changes" tab which lists all files that are part of the merge request | Participant can understand that "Changes" are files of the merge requests and then makes a relation that the tree view is where they can add more files | #1266 (comment 551565385) |
![]() ![]() |
Ask the participant to change a small css change with one file change and commit the change | The flow with 2 tabs will perform the same as or better than the existing experience of making a change and commit a change | TBD |
What decisions will you make based on the research findings?
Inform future direction of WebIDE layout and refine babysteps to get there.
Scripts
- In front of you is an image of the 3 views you saw in the previous questions. Please state which option would help you check that you have included the right files for your commit. Please explain the rationale for your decision.
- Imagine you have entered the WebIDE from a merge request to review changes. Please tell us how many files are part of the merge request. Explore this clickable tabs on the page and please tell us where you would click to add a new file and which areas of the page should update with information of this new file.
- Imagine you are looking an image of a file tree of a merge request with changes committed to it. Please state what the icons are representing for the 3 different markers on the image.
- Imagine you have entered the WebIDE from a merge request to review changes. Please tell us how many files are part of the merge request. How would you compare this presentation approach versus what you have seen previously?
Links
- UserTesting https://app.usertesting.com/dashboard#!/study/3473933/sessions
- YouTube video: https://youtu.be/4lowTM66x-8