Unified Dropdown Menu: One Menu to Rule All Links

#1

Post by waterhole » Thu, Jul 05, 2012, 4:15 PM UTC

Unified Dropdown Menu: One Menu to Rule All Links
uxmovement.com

Re: Unified Dropdown Menu: One Menu to Rule All Links

#2

Post by wolffnc3 » Thu, Jul 05, 2012, 5:05 PM UTC

Interesting idea, i'd love to hear from anyone who's tried this and see if they've gathered any data on it's effectiveness (a/b tests, heat maps etc...)

Re: Unified Dropdown Menu: One Menu to Rule All Links

#3

Post by ericras » Thu, Jul 05, 2012, 5:27 PM UTC

wolffnc3 wrote: post #2

Interesting idea, i'd love to hear from anyone who's tried this and see if they've gathered any data on it's effectiveness (a/b tests, heat maps etc...)

We implemented a "mega box" drop down at the University of Nebraska (http://www.unl.edu/) in 2009. We didn't do a production a/b test but we did do in-person a/b testing using a custom web app that tested user's ability to find things in the navigation in the mega box compared to a traditional flag model. Mega box won.

Also note that this nav and template isn't unique to the homepage like most higher Ed institutions but is used site wide by all units. That was an epic battle story for another time.

Re: Unified Dropdown Menu: One Menu to Rule All Links

#4

Post by bluetidepro » Thu, Jul 05, 2012, 5:33 PM UTC

I like this approach, esp how it is implemented on Lebron's site. Like wolffnc3 said above, I would be curious to see if users like the idea of triggering all of the drop-downs with one hover or if they prefer the classic way.

Re: Unified Dropdown Menu: One Menu to Rule All Links

#5

Post by ckluis » Thu, Jul 05, 2012, 5:36 PM UTC

ericras wrote: post #3

wolffnc3 wrote: post #2

Interesting idea, i'd love to hear from anyone who's tried this and see if they've gathered any data on it's effectiveness (a/b tests, heat maps etc...)

We implemented a "mega box" drop down at the University of Nebraska ( http://www.unl.edu/ ) in 2009. We didn't do a production a/b test but we did do in-person a/b testing using a custom web app that tested user's ability to find things in the navigation in the mega box compared to a traditional flag model. Mega box won. Also note that this nav and template isn't unique to the homepage like most higher Ed institution…

your font could be a bit bigger and you could provide a larger click area - but I like the design.

Re: Unified Dropdown Menu: One Menu to Rule All Links

#6

Post by DenisM » Thu, Jul 05, 2012, 6:12 PM UTC

Looks a bit like Ribbon.

Personally I like any menu system that has search in it. So that first 2-5 times I use search, then I learn the location and can click the right thing directly.

Re: Unified Dropdown Menu: One Menu to Rule All Links

#7

Post by digitalboss » Thu, Jul 05, 2012, 6:20 PM UTC

ericras wrote: post #3

wolffnc3 wrote: post #2

Interesting idea, i'd love to hear from anyone who's tried this and see if they've gathered any data on it's effectiveness (a/b tests, heat maps etc...)

We implemented a "mega box" drop down at the University of Nebraska ( http://www.unl.edu/ ) in 2009. We didn't do a production a/b test but we did do in-person a/b testing using a custom web app that tested user's ability to find things in the navigation in the mega box compared to a traditional flag model. Mega box won. Also note that this nav and template isn't unique to the homepage like most higher Ed institution…

I like the "pinning" the menu feature - interesting.....

Re: Unified Dropdown Menu: One Menu to Rule All Links

#8

Post by wolffnc3 » Thu, Jul 05, 2012, 6:24 PM UTC

ericras wrote: post #3

wolffnc3 wrote: post #2

Interesting idea, i'd love to hear from anyone who's tried this and see if they've gathered any data on it's effectiveness (a/b tests, heat maps etc...)

We implemented a "mega box" drop down at the University of Nebraska ( http://www.unl.edu/ ) in 2009. We didn't do a production a/b test but we did do in-person a/b testing using a custom web app that tested user's ability to find things in the navigation in the mega box compared to a traditional flag model. Mega box won. Also note that this nav and template isn't unique to the homepage like most higher Ed institution…

thanks for the info, i'm currently working on a redesign from a site that has all of the top 2 levels of nav showing in a side bar and the proposed design has a single level with "mega menu" style dropdowns, I'll bring this solution up as an option we can focus group. Also, I like the ability to pin the menu open, nice touch

Re: Unified Dropdown Menu: One Menu to Rule All Links

#9

Post by jeffehobbs » Thu, Jul 05, 2012, 6:54 PM UTC

This is great on desktop, but I don't think it scales smoothly down to the available space on mobile.

Re: Unified Dropdown Menu: One Menu to Rule All Links

#10

Post by WiseWeasel » Thu, Jul 05, 2012, 7:05 PM UTC

I'd rather these complex sites avoid having drop-down menus entirely for their top-nav bar. Instead, have the most common general sections linked in the top-nav, and put links to their sub-sections in a section-specific navigation area inside the newly-loaded general section, separate from the top-nav. Less common pages and sections are linked in the bottom-nav.

Cluttered top-nav is a hassle to use, with the worst offenders making me feel like I'm looking for a needle in a haystack every time I use it. It's much nicer to drill down to the section you need one step at a time without modal navigation windows appearing and disappearing, especially if the defaults are well-chosen.

[It's also worth noting, as mentioned by others here, that the paradigm of stacked windows, and thus pull-down menus, is incompatible with pocket OS designs, so you're going to end up with completely different navigation workflows on different platforms if you go this route.]