Sherlock couldn't find the goldmine
Even Watson missed the jackpot.
Challenge
We solved a major discoverability problem for a large, feature-rich Learning Management System (LMS) with numerous hidden, profit-driving features. By redesigning the navigation, we enhanced user access to all functionalities, unveiling hidden features and boosting user engagement. Our design thinking approach made the LMS more intuitive, unlocking its full potential for both users and the business.
Defining the Problem
After numerous conversations with stakeholders, we uncovered the real problem: the navigation and admin/learner homepages had become difficult to navigate. Users, including our very own “Sherlock” (metaphorically speaking), struggled to locate essential and profitable features, leaving even the more seasoned “Watsons” of the platform missing key opportunities. Discoverability was a major issue, as echoed by user feedback: “I wasn’t aware I had access to any of these features!” This resulted in lost business and missed opportunities, as users simply couldn’t find what they needed.
Mega Menu
To tackle the discoverability crisis, we turned to a more structured approach by implementing a mega menu. Mega menus are highly effective for displaying complex site structures, making it easy for users to visualize all content at a glance. While not always the favorite menu design, it made perfect sense for this case:
- Good for displaying lower-level site pages.
- Great for larger sites with many features.
Our product had evolved rapidly, and many profitable features were buried deep in the existing navigation. In fact, they were so well-hidden, no one could find them, back to square one with the discoverability crisis. The mega menu allowed users to immediately see all available features without relying on short-term memory to juggle choices.
I made a quick sketch and ran it by stakeholders.
Research
We conducted several rounds of user research to refine the new navigation structure:
- Card Sorting: We used this method to understand the users’ mental models of our features and to discover logical groupings for categories.
- Tree Testing: This helped us iterate on our proposed navigation hierarchy and validate if our labels made sense. Tree testing showed us whether users could find the correct information, how long it took them, and if they were jumping between unrelated categories.
Iterations
To refine the design further, our product designer engaged in user feedback sessions to validate low-fidelity wireframes and iterated on design improvements based on real-world feedback.
Through this research, they also uncovered major pain points, such as the frustration of switching between admin and learner views, which added another layer of complexity to the user experience.
Results
The implementation of the mega menu significantly improved the discoverability of key features. Users were no longer lost in the depths of the interface, and feedback reflected a notable decrease in navigation-related frustration. As a result, engagement with hidden, yet profitable features increased, and users were finally able to fully utilize the platform’s offerings.
Mobile
The mobile version of the mega menu is specifically designed to cater to the most highly used and essential features of the mobile app. Recognizing the different needs of mobile users, the menu prioritizes functionalities that are most relevant on the go.