Code Review Analytics + Table Component: Design evaluation & usability testing
## Research Objective This study was conducted as part of the [FY21-Q1 Manage UX OKR: Provide updates & improvements to Pajamas Design System Epic](https://gitlab.com/groups/gitlab-org/-/epics/2486). The goal of this study was to test the usability of new/existing table designs in the context of an existing use case: Code Review Analytics. These research insights will inform updates to the Pajamas table component and the direction of the Code Review Analytics feature. ## Research Questions - **Existing functionality** - *What are the key use cases and interactions where tables are used in GitLab? What are the pain points and workarounds?* - Search - Pagination - **New functionality** - *Can users understand and utilise the additional functionality? Have they seen this functionality before? How does this functionality help the user in a task-based exercise?* - Sorting - Integrated pagination - Expandable rows - User-defined table columns - **New styles / layouts -** *Which styles/layouts do users like from a utility, usability & desirability standpoint?* - Zebra stripes row ## Methodology We ran a moderated usability test with a total of 6 customer engineering managers & team leads We had a brief round of context-setting questions to understand the participants' team structures and code review processes. We then asked participants to complete the following scenario using existing code review analytics feature and two clickable prototypes created in Sketch with hotspot hints turned off: > You have been tasked with unblocking MRs that are currently in code review - Task 1. Look for any MRs with the UX label that are taking less than 17 days to be reviewed - Task 2. Continuing on from the previous exercise: - Display all the rows in the table - Add a new column to the table with the “pipelines” dimension and sort by no. of pipelines - How would you expect to find out more information about the recent activity (such as comments) within a particular MR? - Task 3. Reflecting on the two previous exercises, play around with the table padding toggle and tell me what you think. *Note: The user test was changed slightly after the first participant, so insights are either out of 5 or 6 people.* ## Appendix ### Planning - [Research request issue](https://gitlab.com/gitlab-org/ux-research/-/issues/670) - [OKR Epic](https://gitlab.com/groups/gitlab-org/-/epics/2486) - [Interview Script & Notes](https://docs.google.com/document/d/1ygcbBm97NvmaBii5ZRmmdOUYrMSeavMJu-GPiVAeU_A/edit?ts=5e43406b#) [Internal] ### Prototypes 1. [Code review analytics - current state](https://gitlab.com/gitlab-org/gitlab/-/analytics/code_reviews) 1. [Code review analytics - new functionality](https://sketch.cloud/s/xM1Rm/a/WVxban/play?hotspots=false) 1. [Table padding](https://sketch.cloud/s/xM1Rm/a/5wJj3d/play?hotspots=false) ### Analysis/Synthesis - Interview Recordings [Internal] - [Adrian](https://drive.google.com/open?id=1fmHqUdea9KK4nl1Uh6KecxbETrxrn6b6) - [Mathieu](https://drive.google.com/open?id=15NkMX6gR9z2bxspUVFjeI9CIzwmdtlpp) - [Riyadh](https://drive.google.com/open?id=109566W3IxzAYLl6rl0LEeM9pq8PxFi4J) - [Ravi](https://drive.google.com/open?id=1om13Rw84bN40jjz47GOARZ3zH76931Xb) - [Mike](https://drive.google.com/open?id=1PFyNRCdlnrDvMXPPfCPV1PZt1rzRF7aa) - [Thomas](https://drive.google.com/open?id=1tG9b9CX4iFUgVnoDrGb4d4Qv0KDp3iJz) - [Synthesis Mural](https://app.mural.co/invitation/mural/gitlab2474/1584712481734?sender=npost7450&key=65401498-dd58-402d-b6f1-e60cd9472d7e) [Internal] ### UX Showcase - [Deck](https://docs.google.com/presentation/d/1He9P_ZmhQbJRme4kqSTnNvUXOHDFDuDaHsbdALpHLZA/edit#slide=id.g29a70c6c35_0_68) - [Video recording](https://www.youtube.com/watch?v=Osl-y0VNH3o)
epic