Lead UX/UI Designer
YETI Coolers
2 Weeks
.gif)
We noticed a trend in global navigations among our successful competitors that was a maximalist take on navigation layout and wanted to test how a navigation like that would perform with our customers. Our stakeholders also really wanted to explore a version that laid out the entire breadth of our product catalog as a company.
For this test, my goal was to add our unique perspective to a design trend that had become quite prominent among our competitors. Rather than simply following the trend, I wanted to infuse our own style while still aligning with what users were becoming accustomed to. I chose to implement a background for the drawer with low opacity and a subtle blur effect. This design choice not only helped create a modern, visually appealing look, but it also ensured the content remained legible and accessible, meeting key accessibility standards. The blur effect added a sense of depth and sophistication, while the reduced opacity prevented the background from overpowering the content, maintaining the focus on the primary information.
A major consideration during this iteration was to preserve the existing layering structure from the first version. I didn’t want to overwhelm the user by introducing too many potential entry points or visual distractions. By keeping the layering consistent, we maintained a smooth, intuitive flow that didn’t confuse or overwhelm the user. The goal was to create a seamless experience that felt fresh and engaging, without complicating the navigation. This balance of creativity, accessibility, and usability was crucial in ensuring that the design was both functional and visually striking.
Choosing the right font, font size, and font weight played a pivotal role in establishing a clear and effective visual hierarchy for this project. A well-structured hierarchy is critical for guiding users through the content effortlessly; without it, users would likely struggle to process information and locate what they’re searching for. I carefully considered the balance between readability and emphasis, ensuring that the most important elements stood out while still maintaining a cohesive flow across the design.
Another significant challenge was designing intuitive hover and selected states, which are essential for providing users with clear feedback as they interact with the interface. The interaction states needed to feel seamless and responsive to enhance the overall user experience. Additionally, I focused on selecting the right iconography for collapsible sections to make them easily recognizable and accessible, improving the navigational flow.
Lastly, I rethought the positioning of key elements like the 'Find A Store' and 'Language Selector.' Both features had to be relocated to ensure they were easily accessible but didn’t overwhelm the layout. The goal was to improve their visibility while maintaining a clean and user-friendly design.
.png){kind=small}
