State of the Navigation Drawer. UI design patterns evolve. Some come… | by Juhani Lehtimäki

UI design patterns evolve. Some come into fashion and some go out of fashion. A pattern, once common, over used, and pervasive has been slowly been turned into background and removed. I’m talking, of course, about the Navigation Drawer.

I recently had a discussion with a customer about the Navigation Drawer and its role in the current Android ecosystem. I put forth a claim that it is being phased out where possible.. including most Google’s apps.

The Navigation Drawer pattern, or hamburger menu, has been receiving fair amount of criticism for quite a long time. Main reasons for the criticism has been the fact that it hides core navigation behind hidden UI. Users won’t find new features added to apps or find out about the ones already there.

There are a good number of sources and experiences advising against the drawer:

So is Google actually ditching the pattern in their Android apps? It is still, after all, part of the Material Design guideline.

If we take a survey of Google apps that have been updated to the modern design we can find a good number of apps that used to use the drawer but now use bottom navigation as their sole navigation pattern:

A selection of Google first party apps that rely on bottom navigation.

Finding few Google Android apps without drawer is hardly a proof that the drawer is gone for good. However, it is a clear sign of times changing. The drawer was once something that was present everywhere. The much-more discoverability supporting bottom navigation pattern is replacing the drawer where possible.

You can find much more information about the bottom navigation pattern in the Material Design guidelines.

Truth is that the drawer still lives on. Even on Google’s redesigned apps.

A selection of Google first party apps that use Navigation Drawer as the secondary navigation.

However, in almost all newly designed Google apps that still retain the drawer it relegated to act as second level navigation containing less important, more rarely needed functions.

The bottom navigation is highly visible, usable, discoverable and reachable but it has a serious downside: you can realistically have only up to 4 to 5 items on it. Anything more would make the navigation difficult to use and awkward. The drawer, on the other hand, provides nearly infinite extendability. When you add a new feature you can simply add a new line to your drawer and you’re set (none of your users will find out about the new feature though).

The combination of bottom navigation and the drawer seems to be the optimum solution to both, discovery and extendability.. at least until we figure out something better.

Drawer still appears in the place of main navigation is some apps from Google

You can still find some apps from Google that appear to use the drawer as the main navigation component. However, if you look more closely, both the Calendar app and the Notes app use the drawer as a sort of a filter instead of navigation. Users do not miss any sections of the app if they fail to inspect the drawer content.

The navigation drawer seems to be finally be taking a backstage in navigation, good. However, it still remains as a viable option for specific cases and as secondary navigation. As with every design pattern, consider carefully if you actually need it and if there is an alternative ways to solve the design. Drawer has a lot of known problems but also some good features. Use it only when its use is justified.

Source link