Overhaul the core navigation experience
## What's this about? We've used the last year to reflect on user feedback and run numerous research endeavors to discover a way to make navigating GitLab easier to approach, less overwhelming, and more efficient for everyone. This is no small feat and we are aware how much these changes can implicate the usability of GitLab so there will be a progressive rollout plan to test our riskiest assumptions. ## What's different? - There will no longer be a top bar - What we call the "super sidebar" will contain all the elements that pertain to moving around GitLab - New locations like "Your work" and "Explore" are designed to be more context specific - The Environments, Operations, and Security Dashboard are now under "Your work" - Some features will have moved into a new category grouping - There is no collapsible view of the super sidebar - There will be a new section introduced that will allow anyone to pin or favorite features for quick access - The breadcrumb will be migrated to use GlBreadcrumb ## Snapshot ![New_Navigation](/uploads/872e3bc7a27fde0e48a6078d4de5952c/New_Navigation.png) ## Rollout All these dates are tentative and can change at any time in the future, but it shows the ambitious goal we have ahead of us. - ✅ Starting in 15.7, GitLab team members from ~"group::foundations" can sign up for the alpha in Slack → `f_super_sidebar_alpha_users` - ✅ Once 15.10 has been completed, we will open that channel more broadly to GitLab team members to try the Alpha version of the new navigation. It won't be fully tested and may break in some areas. - ✅ Early 15.11, we will give all GitLab Team Members the option to turn on the new navigation using a toggle if it has reached feature parity. At this point, we will consider it in Beta so it may still contain bugs or inconsistencies. - ✅ Assuming the GitLab dogfooding closed beta does not bring up any significant issues that would delay a more public release, then we will allow everyone to try the new navigation beta. Ideally, this would be with the release of version 16.0 with the toggled defaulting to off. - ✅ In 16.0, Remove the beta tag and convert the full experience over the new navigation for <abbr title="General Availability">GA</abbr> once it is complete and stable. ~~Targeting the release of 16.2%~~ - we beat this! - :arrow_forward: 16.1 complete a Longtidunal study to see if navigation sentiment increases with time. Complete logged-out state, context switcher design deep dive. - :arrow_forward: By 2023-06-02, the new navigation toggle will be toggled to on by progressive rollout (https://gitlab.com/gitlab-org/gitlab/-/issues/410121) on ~"gitlab.com". - At some point, we will pull the toggle completely; our goal is %16.4 <small>See the tentative schedule </small>[<small>here</small>](https://docs.google.com/spreadsheets/d/1Neu3ncCsf07d_49YrlzZKjvQU8MvpLOTnwx-jO2oLnY/edit#gid=1620911302) ## References There is _a lot_ of history, and this section can't include everything but it does include some insightful details that might be useful for referencing again in the future. Check out the fully vision of where we are headed in [Figma →](https://www.figma.com/file/kAAMkIqKPE4rRYo1JQIheI/Navigation-Redesign?node-id=3497%3A114581&t=XZ8NhpybTxoFg02i-1), checkout a sample [prototype](https://www.figma.com/proto/kAAMkIqKPE4rRYo1JQIheI/Navigation-Redesign?page-id=3497%3A114581&node-id=3497%3A114582&viewport=421%2C391%2C0.13&scaling=min-zoom&starting-point-node-id=3497%3A114582&hide-ui=1) or take peak into our demo on [codepen](https://codepen.io/br4ndt/pen/ExRMdWj). <details> <summary> :microscope: User research efforts </summary> Each round of testing brought forth new insights. We made numerous tweaks in several design ideations based on what was resonating with our participants and more importantly what was not. This has given us confidence in the direction for what to do next. - https://gitlab.com/gitlab-org/ux-research/-/issues/2001+ → [:bulb: Insights](https://docs.google.com/presentation/d/1mKHDSYzx4M4lO9AadUgBzTvspZSCxZIrFNKpa41Z36g/edit?usp=sharing) - https://gitlab.com/gitlab-org/ux-research/-/issues/2083+ → [:bulb: Insights](https://docs.google.com/presentation/d/1G9MpsM59AQsHYJRCfeEMpjSNl4Trvr1RtH0th-SO_Uc/edit?usp=sharing) - https://gitlab.com/gitlab-org/gitlab/-/issues/365403+ → [:play_pause:️ UX Showcase](https://www.youtube.com/watch?v=WVGltfIDWPk&ab_channel=GitLabUnfiltered) </details> <details> <summary> :arrow_forward:️ Google Slides </summary> **Only available to GitLab Team members**. Useful for quickly findings verbatims related to navigation struggles. - [FY23-Q3 System Usability Scale - SaaS and SM](https://docs.google.com/presentation/d/1Ib1Iz3fstGUA8TvjyuaSjTpuO1zjTawo4UZkdg_0YG4/edit#slide=id.gf3f626d636_0_214) - [FY23-Q3 System Usability Scale - SaaS - Results Overview](https://docs.google.com/presentation/d/1VmpIyXPK8xoiSUbYrKEHkcCQ_L-T4MxcziQTmE4aPU4/edit?usp=sharing) - [FY23-Q1 System Usability Scale - SaaS - Results Overview](https://docs.google.com/presentation/d/1hlhyL5Ox30R9oTe3_huDwjG3X0WakFigvjiF3t81Gx4/edit#slide=id.gf3f626d636_0_214) - [FY22-Q4 System Usability Scale - Results Overview](https://docs.google.com/presentation/d/1Op9-3pW3HcHfYb1A52dMMjLoqTDXg9V8ig13z2IBiFY/edit#slide=id.g639141d4c5_0_15) - [FY22-Q3 System Usability Scale - Results Overview](https://docs.google.com/presentation/d/1VmpIyXPK8xoiSUbYrKEHkcCQ_L-T4MxcziQTmE4aPU4/edit#slide=id.g639141d4c5_0_15) - [FY22-Q2 System Usability Scale - Results Overview](https://docs.google.com/presentation/d/1L8hisjJSwkuuwsAGNAcAM7SEXi81cqYRgHn0RTRS3lo/edit#slide=id.g639141d4c5_0_15) - [FY22-Q1 System Usability Scale - Results Overview](https://docs.google.com/presentation/d/1crS0oQ91Tr895FEk0Qmm3KTe9F_T5y9CDuSIBtFA87M/edit#slide=id.g639141d4c5_0_15) </details> <details> <summary> :popcorn: Unfiltered Videos </summary> Here are a few if you want to get the popcorn out and catch-up on where things are at. - [UX Showcase: Navigation Redesign](https://www.youtube.com/watch?v=WVGltfIDWPk&ab_channel=GitLabUnfiltered) - [GitLab Navigation update - Aug 9, 2022](https://www.youtube.com/watch?v=yDyHCwpY-cg) - [Navigation & Settings Direction feedback](https://www.youtube.com/watch?v=eNxtXDrj-Cw) - [GitLab Navigation update - July 16, 2022](https://www.youtube.com/watch?v=PQRg8BoZ8Po) - [GitLab Navigation Discussion](https://www.youtube.com/watch?v=Rn6ZTDOKxNc&t=768s&ab_channel=GitLabUnfiltered) - [Navigation updates - Product Design](https://www.youtube.com/watch?v=aZcl6bomBkU&t=564s&ab_channel=GitLabUnfiltered) - [Navigation long-term opportunities](https://www.youtube.com/watch?v=qqnO4RkvU-0) - [Understanding the challenges of GitLab's left side navigation](https://www.youtube.com/watch?v=ZeCdGTe_hbU&t=3s&ab_channel=GitLabUnfiltered) </details> <details> <summary> :page_facing_up: Historical blogs </summary> We can learn a lot about what worked well in the past. Check out how we evolved the navigation in the past. - [Jul 31, 2019 | Explore the past, present, and future of GitLab's Navigation design](https://about.gitlab.com/blog/2019/07/31/navigation-state-of-play/) - [Sep 13, 2017 | Unveiling GitLab's new navigation](https://about.gitlab.com/blog/2017/09/13/unveiling-gitlabs-new-navigation/) - [Jul 17, 2017 | Redesigning GitLab's navigation](https://about.gitlab.com/blog/2017/07/17/redesigning-gitlabs-navigation/) - [Jun 6, 2016 | Navigation redesign](https://about.gitlab.com/blog/2016/06/06/navigation-redesign/) - [Sep 22, 2015 | GitLab 8.0 released with new look..](https://about.gitlab.com/releases/2015/09/22/gitlab-8-0-released/) </details> <details> <summary> :fox: Issues </summary> These were insightful ideas for considering in future changes. - https://gitlab.com/gitlab-org/gitlab/-/issues/353648+ - https://gitlab.com/gitlab-org/gitlab/-/issues/366457+ - https://gitlab.com/gitlab-org/gitlab/-/issues/342877+ - https://gitlab.com/gitlab-org/ux-research/-/issues/1279+ - https://gitlab.com/gitlab-org/gitlab-design/-/issues/2066+ - https://gitlab.com/gitlab-org/gitlab/-/issues/233429+ </details> <details> <summary> :sparkles: Objectives and Key Results </summary> We have several open epics to ensure that we stay on track towards defining this vision. - ~UX https://gitlab.com/groups/gitlab-org/-/epics/8481+ - https://gitlab.com/gitlab-org/gitlab-design/-/issues/2049+ - https://gitlab.com/gitlab-org/gitlab-design/-/issues/2050+ - https://gitlab.com/gitlab-org/gitlab-design/-/issues/2051+ - ~"Product Management" https://gitlab.com/gitlab-org/ecosystem-stage/team-tasks/-/issues/164+ </details> ## Back burner To give our team as much capacity to focus on implementing the new navigation, some lingering issues will not be addressed. These will be closed and no longer necessary once the new navigation reaches <abbr title="General Availability">GA</abbr>. - https://gitlab.com/gitlab-org/gitlab/-/issues/330982+ - https://gitlab.com/gitlab-org/gitlab/-/issues/17576+ - https://gitlab.com/gitlab-org/gitlab/-/issues/379043+ - https://gitlab.com/gitlab-org/gitlab/-/issues/373073+ - https://gitlab.com/gitlab-org/gitlab/-/issues/332513+ - https://gitlab.com/gitlab-org/gitlab/-/issues/323230+ - https://gitlab.com/gitlab-org/gitlab/-/issues/362819+ - https://gitlab.com/gitlab-org/gitlab/-/issues/352334+ - https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/issues/1264+
epic