6

Working on a feed driven iOS application and wondering peoples thoughts on Tab Bar driven iOS design for feed based apps. There is a large amount of evidence that supports the well integrated use of both main styles of iOS navigation - Hamburger/Flyout Nav and Tab Bar Nav.

Benefits of Hamburger Nav

  • Great for when there are more that 5 "main" views
  • Persistent top nav stays out of the way
  • Navigation can stay consistant between iOS and Android apps
  • e.g. Foursquare 6.0, Facebook, Path

Benefits of Tab Bar Nav

  • Makes interacting with the screens more "exploratory"
  • Puts the nav in an area that's perhaps more usually obstructed by your thumb
  • e.g. Twitter, Instagram

This isn't is a bit more of a subjective question because I don't know if there is entirely a "correct" answer as both navigation styles have done well in the iOS world.

But, what are your thoughts on which is better for the user? If it's a feed based, vertical scrolling as the primary interaction - Do you think a Tab Bar or a persistent navbar with a flyout makes more sense for navigation?

2 Answers 2

2

There are a few guidelines (number of items, etc.) you can use to decide between the two options. But, beyond those it is upto you as a designer, what choice you want to make. I have highlighted some cases where a particular design might be more favorable to use.

A tab based navigation is only useful if you have a small number of tabs (4-6). Many apps prefer to have an odd number of items if they want to make a particular tab highlighted eg: instagram. This allows them to focus on a particular aspect of the navigation or establishing the primary tab and the secondary tabs.

The hamburger menu is effective (in my opinion) only when you have a considerable amount of items in the navigation. It is also helpful when you want to do two levels of navigation hierarchy. The advantage of hamburger menu is that theoretically it can have endless items since you can scroll that menu without losing focus of the main content eg: facebook.

Edit: As Charles Wesley rightly pointed out, if you have miscellaneous items which you can group under a generic 'more' label, then you can have more than 4-6 items in the tab bar menu. Most of the apps seem to be using the tab bar in this manner. It should be noted that in that case, you are consciously deciding that you want to focus on 4 items in your menu and all the rest can be hidden under more.

5
  • This is not true for the Tab Bar control specifically asked about by OP. The iTunes app on iOS uses the Tab Bar control and has 7 tabs (four visible, four behind the "More" tab, which behaves like a hamburger menu). Commented Apr 23, 2013 at 13:37
  • Can you link a screenshot? I am not able to understand.
    – rk.
    Commented Apr 23, 2013 at 13:39
  • imgur.com/4gXXQTC.jpg Commented Apr 23, 2013 at 14:01
  • Also the "Music" app similarly uses the Tab Bar imgur.com/USTvw0i.jpg Commented Apr 23, 2013 at 14:03
  • Yes, but only 5 items are visible/highlighted. Similar argument also holds true in case of the hamburger menu, facebook has Account Settings, Privacy settings, problem reporting and other items which themselves have 'more' items in them.
    – rk.
    Commented Apr 23, 2013 at 14:04
1

In my experience, using a Tab Bar is useful when users switch frequently between options in any moment in any point on the application. Tab Bar is usually persistent so the user can switch with only one tap. An example could be tabs for differents views of the same item type (like apps in App Store)

The hamburguer menu is better when options are scenario driven. The user is going to start and finish his task selecting one option and we can assume that he or she's not going to switch frequently (like in Foursquare).

Answering directly your question, I would say that there's no better or worse option, it depends on the specific use and information architecture of your application.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.