Android design with two-tier (primary and secondary) navigation

Question

I need a way to include tabbed primary navigation (i.e. facebook)

with one of those primary tabs having 2 states (secondary nav/tabs).

My 3 ideas are as follows:

1. stack them (eeek!)
2. Make a dropdown (just for this tab)
3. Put the secondary nav/tabs at the bottom of the screen while keeping 5 primary at top

Do any of these ideas work within android convention? Client really does not want to use a drawer menu... so I'm stuck with a non-conventional solution. Let me know what you think works best or if you have a better alternative!

Answer 1

Android navigation belongs at the top

The Material Guidelines are pretty clear on that subject. Aside from the bizarre usability of it, putting navigation at the bottom is solidly associated with iOS.

In-context navigation may be the answer

In a three-level situation like this, it's common to dive down to a dedicated page and use the "up arrow" control to return to the main nav. That spares you from using up copious amounts of real estate to show too many levels of depth.

When moving through in-context navigation, navigating to a new scene will display navigational controls specific to that view.

Answer 2

Wow this is a crazy coincidence! I literally had this same problem today trying to design a two-level deep filter in iOS and tried stacking segmented controls. It didn't get positive feedback and we ended up restructuring the information into different areas. I kept one segmented control (very similar to Android's tabs) that only changed the view underneath them, and we made sure that the different views of the segmented controller were similar (in this case it was lists of similarly format blocks of text with an icon). Then we moved the odd-ball view (a map) to the navigation bar as an icon on the right side in line with the title. This made sense because the map view was a higher level of information that didn't actually belong inside the filter. This is a very roundabout answer, but perhaps one or two of those top-level tabs aren't actually in the right place and it's forcing you to create too deep of a filter.

I think the dropdown menu is the best solution here that you have presented, but it sacrifices visibility and users will likely not realize or struggle to find those features.

Answer 3

Add both in the top bar? 6 icons should still fit well.

Also, if this is for Spotify or another music app, I think you should reserve the bottom part of the screen for the current song with 'pause', 'skip' and 'add' buttons.