Creating a responsive unified navigation
Role
Lead designer
Scope
Responsive and accessible navigation
Impact
Unified navigation elements, multi product theming, accessibility remediation
Overview
Sprout’s navigation had become cluttered over years of feature additions all competing for the users attention. Every team solved page structure and loading a little differently, so the product felt inconsistent as you moved between areas. We were introducing an AI chat interface into the product, and there was no established pattern for how that should sit alongside the existing application.
I set out to reorganize and consolidate the navigation and global tools. Previously split across either side of the app and forcing users to hunt for what they needed into a unified navigation that all lived in the same area. This provided a foundation for all wayfinding of the application.
Ideation & testing
Rather than guessing at the right structure, I ran a series of user tests across several distinct navigation concepts to see how people actually found their way around the product. Once a direction clearly outperformed the others, I moved into smaller, targeted revisions to refine it rather than continuing to test broad alternatives.
Refine and validate
Based on user feedback from the first round of test, I refined the unified navigation direction to resolve the specific pain points users ran into. I ran a second round of testing with new participants to confirm the changes actually solved the user feedback without introducing new concerns.
Opt-out option
We planed for a phased rollout of the new navigation and also supported an opt-out option for users in case they where in the middle of a critical workflow and needed to focus on any current tasks.
Less than 1% of customers used the opt-out escape hatch and many that did reverted back to the new unified navigation shortly after.
Customization & theming
While updating the visual style of the navigation I also took the opportunity to extend the navigation theme to allow for a number of preset themes that allowed users to customize the look of Sprout the way they liked.
Using the same infrastructure as theme presets I created branded themes for each application in the Sprout suite.
Previous project
Responsive layout
Next project
Seeds foundations