My Role
As the lead senior designer for this project, I collaborated with product managers, engineers, go-to-market strategists, and stakeholders from the leadership and compliance teams to ensure we delivered the best possible experience for our end users. My role involved creating design iterations, prototyping concepts, communicating the design vision, and serving as the lead design voice from concept to implementation and QA.
Context
The navigation and dashboard for our external, client-facing web and mobile application were designed to help beverage brands manage their product catalog, inventory, sales, accounting, logistics, and compliance. Since these components were implemented before our design system was launched, we determined that a redesign of the central user experience was necessary before applying the design system to new or updated tools.
The Problem
The system had several critical issues that hindered user experience. The outdated design looked visually obsolete, negatively impacting engagement and satisfaction. Users struggled to determine their current page, leading to confusion and inefficiency. The cluttered navigation menu made it hard to find specific content, and the lack of information hierarchy left users feeling overwhelmed. Additionally, the dashboard's heavy data load caused slow loading times.
The Solution
Several key enhancements were made to improve the overall user experience. A clean and intuitive sidebar navigation system was introduced to streamline the user journey and reduce clutter. Content was reorganized with a clear information hierarchy, making it easier for users to find and navigate categories. Each page’s main tool or feature was emphasized to help users focus on their tasks. Performance optimizations eliminated manual data loading, significantly improving loading times. Additionally, the dashboard was redesigned to provide a more intuitive and efficient interface, enabling users to access and interpret key data more effectively.
Navigation Design
To improve app navigation, we began by analyzing analytics and heat maps to determine the optimal menu hierarchy. After defining the structure, we conducted a card sorting exercise with the Product Owner to group similar tools. Collaborating with department directors and leadership, we refined the structure through several iterations in Google Sheets. Once finalized, I implemented the grouping into a prototype and presented it to leadership for validation. Based on their feedback and insights into the end user, we made adjustments to ensure the final structure met user needs.
Dashboard Design
To streamline and enhance the dashboard, we began by analyzing user interaction data and heat maps to identify the most engaged sections and data points. The analytics were particularly insightful, as users had to manually click "Reload" to update each section, highlighting key areas for improvement. Our approach included reducing information overload by focusing attention on individual data points in the "Facts & Figures" section through a carousel, introducing a horizontal section for graphs that allowed users to expand for more detailed information, and ensuring consistency between the activity feed and transaction overview.
After creating two mid-fidelity revisions within the product development team, we advanced to a high-fidelity prototype, which was presented to leadership. The feedback from leadership was minor, enabling us to proceed to user testing for validation.
Validation & Release
The redesign was validated and refined through an incremental release to small user batches. We started with an internal rollout to ensure data accuracy, followed by a preview mode for a limited user group, allowing opt-outs if desired. After expanding to a larger user base, we validated the changes and made minor improvements, like enhancing data visibility with drop-down menus. Within the first month of release, 78% of users had switched to the new view, confirming the redesign's success. Feedback from legacy users, who preferred more detailed "Facts & Figures," prompted us to update the design accordingly.
